Yesterday I had the pleasure of attending the Create the Web event in San Francisco where Adobe made a number of announcements. I also got to meet a lot of new people in the community and within Adobe (where I work). For those of you who were unable to make it and didn't catch it live - or for those who just prefer to get their information in print - here's a summary of what happened during the morning keynote with links to where you can learn more about the newly released products
First up was Adobe's CTO, Kevin Lynch. He briefly discussed some of Adobe's code contributions to WebKit - things like CSS Regions, CSS Exclusions and CSS Custom Filters (some of you may remember them as CSS Shaders). He said the goal of all of Adobe's work in this area is to "increase expressiveness of web." These centered on several areas of focus:
- Magazine style advanced layout (CSS exclusions and CSS regions)
- Cinematic effects (CSS custom filters)
- Advanced graphical effects.
He also noted that CSS Filters are already available today on Safari on iOS6. He demonstrated CSS Custom Filters running in Chromium on a laptop. Finally he announced CSS FilterLab, a free, web-based tool for creating and testing built-in filters and building custom filters. CSS FilterLab let's you live edit and apply filters and see the resutls, even applying multiple effects. You can even animate these effects using a simple timeline. Also, it allows you to publish and import filters directly from GitHub. CSS FilterLab is just free, but fully open sourced on GitHub
Next up on stage was Adobe's VP/GM Interactive Development, Danny Winokur. he started off by announcing a subscription update to Dreamweaver CS6 that was being released for Creative Cloud members. This update includes enhanced HTML5 support for Forms and Semantic tags, integration with Edge Animate and the ability to insert HTML audio and video into projects
The key announcement of the day was the unveiling of Adobe Edge Tools & Services. The ideas behind this set of tools were to make them:
- Optimized for mobile web content;
- Focused on specific task;
- Work well with other products (both from Adobe and not);
- Not hide the underlying web technologies.
Edge Animate 1.0 and Free
He discussed how this started with Edge Animate (formerly just Edge) and a new "release early, release often" model. Of course, he announces that Edge Animate is now officially 1.0 and, perhaps more importantly, it is currently available completely free
Edge Reflow
Following some demonstrations of Edge Animate by Adobe evangelist, Paul Trani, Danny discusses some of the current difficulties of building responsive web designs. The big stumbling block, he says, is that there is currently no easy way to see what you are doing "real time." To solve this problem, Danny reveals a "sneak peek" of a new product called Edge Reflow. Edge Reflow is a visual tool for building responsive sites that is also built with the same technologies it edits (like Brackets): HTML, CSS and JavaScript. Paul then shows how it can be used to build a responsive page including adding generated media queries at customizable breakpoints. Danny says that Edge Reflow is currently targeting a preview release before the end of the year
TypeKit, Edge Web Fonts and Source Code Pro
Jeff Veen, Adobe's VP of Digital Imaging Product Marketing, then comes on stage to discuss typography. He goes over a brief history of the web focused on how much web typography has changed culminating in the statistics that TypeKit now powers fonts on 1.5 million websites and includes over 1,200 font families from 53 font foundries. Jeff then announces that that Adobe has been working with Google on a new service called Edge Web Fonts. Edge Web Fonts includes over 500 open source and free fonts curated by Adobe that are available to use on your web page. You can try them out and get the embed code without an account as they are all open URLs. The service is also being Integrated into Adobe products like Edge Code (more on that later). Jeff mentions that Edge Web Fonts includes a bunch of Adobe Originals fonts and two new fonts - Source Sans Pro (a recently open-sourced font from Adobe) and new font being released at the event called Source Code Pro. This new font also open-sourced and is a mono-spaced font with features making it ideal for editing and displaying code. Finally, Jeff announces a new partnership with Monotype Imaging to make 1,000 of their best fonts available via TypeKit
Edge Code
Danny returns to discuss Brackets - Adobe's open source, web-centric code editor. He then announces a new Brackets distribution that is named Adobe Edge Code. While Edge Code is a distribution of Brackets, it is geared towards integration with other Edge tools and services. Currently it integrates with Edge Web Fonts and PhoneGap Build and will integrate with more services over time. Paul demos using Edge Code to edit his project using features like inline CSS and JavaScript editing, a new color picker and the Edge Web Fonts integration. A free preview of Edge Code is available today. Also, you can get more details on using Edge Code and these features in my article for the Adobe Developer Connection, "HTML, CSS, and JavaScript Code Editing with Edge Code."
Edge Inspect
Danny then discusses the difficulty of testing and debugging mobile web sites across the ever growing list of devices and screens. To solve this, he announces Edge Inspect, formerly called Shadow. Paul then demos using Edge Inspect to test across a number of iOS and Android devices simultaneously, showing off remote debugging using Weinre and collecting screenshots on all devices at once. Edge Inspect is now available via subscription, including a free version. You can also learn more about how to use Edge Inspect in my article on the Adobe Developer Connection, "Browser testing across devices with Adobe Edge Inspect."
PhoneGap Build
Danny transitions from web-based mobile applications to mobile apps and specifically PhoneGap. He says, impressively, that there have been over one million downloads of PhoneGap and then announces the official release of PhoneGap Build. PhoneGap Build is a service that creates the multiple distributions for a wide array of device operating systems in the cloud. Paul demonstrates how you use PhoneGap Build to generate an app from a zip file containing HTML, CSS and JavaScript. If you want to learn more about PhoneGap Build and the new features, including Hydration, which automatically updates you app when a new build is posted, check out Ray Camden's article on the Adobe Developer Connection, "PhoneGap Build Levels Up."
Edge Tools and Services - for free!
Last, and least (from a cost perspective), Danny notes that all of Edge Tools & Services available via free version of the Creative Cloud.
DIGITAL JUICE
No comments:
Post a Comment
Thank's!