I'm going to try and blog while I watch this presentation. There's like 4000 people here in one room, very much like the Apple keynote at WWDC. The geeks are in frenzied anticipation. There is a triple screen in the front of the room and music is blaring to the animated slides.
Shantanu Narayen, president and CEO of Adobe:
How do we engage our audience? Make customer the focus of what we do. Great digital experiences are the exception, not the rule. Lessons learned on user focus:
1. Content is king - interface is often a barrier to to the content. Think about the content first and make interaction flow around it.
2. Make it personal - s/w should provide what the user wants when they want it. Phone demo. Designed for middle aged person, TV-based interface design. Phone interface design for teenager - multimedia, video, fun oriented. Adapt the user interface to the target audience.
3. Less is (still) More - We are in a constant state of information overload. Focus on the heart of the problem and make the user experience simple. Showed demo of Premiere Express - very much like iMovie - drag and drop interface, simplified timeline, add captions, borders, transitions.
4. Movement has Meaning - cinematic affects and transitions can help the user experience. Adobe Media Player - Glide UI - helps your navigation by directing what your eyes see via movement.
5. Create an Experience, Not a UI - California bike race website - shows video of race and overhead view of GPS location of bikers during the race, chat built into the site, mulitple media engagement.
Kevin Lynch:
Applications
Video - Flash is now the #1 video player around the world. Will now support h.264 (embedded into the player). Will be easier to deliver video to multiple platforms. Moviestar - HD video up to 1080p delivered over the internet, multicore cpu boost, Example - Halo 3 - used flash player for interactive experience even though it's a Microsoft site. You'd think they would use Windows Media.
Adobe Media Player- collect and watch videos - catalog of video feeds via rss. Can connect ads to videos to monetize them. Now available.
FlashLite 3 - now available for creating content for mobile devices.
United Way website demo - used Adobe s/w to build their site. Cold Fusion 8 and Dreamweaver CS3 were used to enhance the site. After filling out a form, it creates a more user-centric experience. Pulls in local information, depending on how you answer the form, it may direct you to different pages. If you have children, it will direct you to a page that shows family volunteer opportunities in your area. Used Flex to dynamically generate jpeg images of volunteer tips.
Rich Internet Applications
ScrapBlog (scrapbook blog) - drag and drop images, edit, rotate, create multiple pages. Can make thought balloons over people's pictures, Published directly to the web.
Adobe Air - to enable the creation of cross-platform desktop applications, includes an embedded SQL database, Customer Manager demo - sales rep field tool. Built on html and javascript. Uses web to do update a database of contacts. Can send info back to the live database. Written by one person in a couple of days.
Flex 3 - New features: Flex Profiler, Language Intelligence, Advanced Data Visualization Comps, Flex Framework Caching. Profiler - graphs memory useage over time, detailed view of all objects in memory, shows all methods and the time it is taking to run them. Helps to debug applications. Data visualization gives quick at-a-glance charts of application information. Framework caching - downloads application framework once, never has to again.
Air Developer Derby - Finalists were Spaz.air, Ora Time Tracker, Agile Agenda, SearchCoders, Digimix. Winner was Agile Agenda, which is a project management app. ebay, AOL top 100 videos, SAP, PayPal, Philips, Disney Parks, QVC are all developing Air apps. Disney in partnership with Frog Design created an app that gives travel agents easy access to Disney's travel information. Synchs content from Disney servers. Customer management list for agents, Can embed video and rich media in trip quote. Can drag in custom content to be sent to the customer. Follow-up built in as well.
Other examples:
Tweeter, Snippage (make yoiur own widgets), Pronto (email/calendar app), Analytics Reporting Suite for Google Analytics. PayPal app, can drag and drop content between Air applications. SAP Briefing Book - most recent data, can do data modelling, Digimix (sound editing app) - can add tracks much like Garage Band
WaveIM, Pounce, Nickelodeon app - can interact with web.
Word Processing - Refrigerator magnets for desktop
Buzzword - like GoogleDocs, but nicer looking. XML rendered real time, wraps text around pictures, tables, sharable. Adobe has acquired Buzzword.
Anthropologie - catalog app - amazing sorting capabilities, updates automatically. This could be the way catalogs are distributed in the future. They will update with new content via RSS automatically.
90% worldwide adoption of Flash 9.
Astro - codename for next Flash. Advanced text layout support. New layout engine supports bi-directional languages, text is now an extensible part of the platform. Native support for simple API for transofroming display objects in 3D space, full interactivity, high performance. Custom filters, blend modes and fills. Build your own effects. Hydra - new programming language Adobe is working on that allows you to create your own filters. Very close to Actionscript.
Design Shootout
3 designers showed some of their best techniques. One mapped a logo on a photo of a large builiding in Adobe After Effects, then created a 3D animated movie of the building turning slightly with moving video of sky behind. Another was in Photoshop where the designer added a surfboard to a photo and rotated it in 3D before pasting it. Another was filtering out a cell phone ring using Sound Booth CS3, which is aimed at audio editing for novice sound editors. Removes unwanted sounds like coughing, sneezing, HVAC, etc. Shows a color visualization of the sound wave. You can actually see the cell phone wave image in color. Uses Photoshop-like tools to select and edit out the offending sound. Can select and play only that sound. Can use Auto Heal (like healing brush in Photoshop) to resample the sound around the edited sound to fix it. CS3 includes new video components for Flash video (using Actionscript 3). Explained trigger points for captioning video. Can allow importing cuepoints (xml from Sound Booth). Showed a different way of displaying captions. Made text appear on a piece of cardboard that a guy in the video was holding. Another demo showed animating a 2d picture of a bird on a bicycle wheel. Selected bird and cut it and pasted it to a new layer. Fixed area where the bird was with clone tool. Puppet pin tool was used to choose where you want the object to pivot. He was able to animate the 2d image of the bird and make him start pecking the bike tire. It was very realistic and pretty amazing.
Adobe CS3 Tools Overview
Showed some of the highlights of each of the tools and some very amazing things that are now possible, like mapping a label on a soda can and manipulating the can in 3D. Dreamweaver is able to take a Photoshop design and easily create a web page out of it, incorporating elements of the design and preserving editability. Photoshop - showed how you can take two similar photos of a group of people and keeping the best parts of each photo into a combined photo by creating a mask and painting out the parts your don't want. Also showed creating a seamless panoramic photo created from a series of overlapping photos. You could not tell where the photos were joined. Very impressive. Showed new auto-selection tool and how Photoshop can now treat the original photo as a symbol, which will preserve it even though filters are applied. Makes it easy to undo or adjust filters later.
Flash and After Effects
Talked about 3D text, modifying animation presets, motion tracking, parenting, track mattes, markers, and FLV encoding via the render que. Also covered importing PSD files, importing video, basic actionscript, event cue points. Showed a bike race video with 3d text revolving around a rider. Showed interactive data of each rider.
Started by importing video into After Effects and creating a new composition. Used animation presets to add 3d text effects. You can view previews of each preset in the Adobe Bridge. Selected text revolving in a circle. Adjusted the angle of rotation and entered the desired text. Then adjusted the circumference of the orbit. Used the motion tracker to attach a tracking point to the biker's helmet and linked the revolving text to that tracking point. Text now rotates around biker's helmet no matter where they go in the video. He then created a mask so that the text would appear to disappear behind the biker. Used parenting to link the mask to the revolving text. After Effects can do Flash cue points and FLV compression. Can batch render and render to different formats at the same time.