Character Animation with Flash CS3
Sandro Corsaro, Creative Direcotr for Disney Online
Gave a brief history of animation. Showed Muybridge and talked about persistence of vision. Showed example of animation and exaggeration. Talked about how Hanna-Barbara revolutionized animation. In 1940 a 6 min Warner Brothers cartoon cost $50k. They did a 21 minute animation called Ruff N Reddy for $2800 using "limited animation", which was the concept of keeping the head and body parts separate so that they did not have to be redrawn. Showed 1955 Nash commercial featuring Mickey Mouse (on YouTube).
Created an animation live using "stretch and squash". Draws on the canvas, then pulls points until he likes what he has. Adds features by drawing in a different color, deleting lines underneath that are not needed, then making the color black like the rest of the outline. Duplicated the contour of the face in another color, filled with a lighter color, then moved it to create a highlight and shadow. Separated body, eyes, and head as graphic symbols. Used "flinching" to add to character movement. So, the head would not just move left to right, but would pop up and down slightly while doing so. Used onion skins to create a front view of the character for a smoother change from left to right. Added blur lines to the front view that really helped sell the movement. Said he bought a TIVO and kept slowing down cartoons to see how they did movement. Showed us an animation of a crab (Flash's first mascot) and how it was created. All eye and mouth movements are in one graphic symbol and he jumps to different frames of that symbol to invoke that particular eye movement. Uses Single Frame First 32 in properties to call that individual movement. Important concept is that he uses graphic symbols instead of movie symbols to nest animations. Showed us a show reel that included some video with animation mixed over it (like Roger Rabbit) and told how he pulled it off. Reuses as much animation as possible.
General Session
Bruce Chizen - CEO of Adobe
Feels weird about being a CEO and the pitfalls of being in such of a position, but discussed why it's all worth it to him. Said he got backstage passes saturday night to the Dave Mathews Band and said that they couldn't stop talking about the new Adobe products that the band can't wait to use. Then he headed out to this conference and it dawned on him that 4000 people were paying to come here and that he was just amazed with what people create with Adobe products. His objective was to inspire us, but he is instead inspired but what we do as users.
Steven Webster, Adobe Consulting
Enterprise Applications
A rich internet application experience is dependent upon what goes on at both front and back sides of the glass. Showed MFG.com - Uses Flex to manage data in real time for world buyers and suppliers bidding on RFQs. LiveCycle ES, built on Flex can manage data services, forms, rights management, digital signatures, process management, output, reader extensions, and barcoded forms. They can take a paper form and turn it into a rich internet application. Once a supplier is awarded a contract, the other bidders can no longer view documents that have to do with that contract.
Doug Mack
Scene 7, an Adobe Company
Leading "on demand" rich media publishing services. Enables creation of enhanced website experiences. Dynamically rendered "single master image". Gucci.com - all images are dynamically delivered. Very elegant display of images and closeups rendered on demand. RDV - designing a football uniform that is rendered live on the website. Can render an uploaded logo onto a uniform in real time with perfect photo-realism. QVC has a desktop Air app that allows you to browse products while watching live video feeds.
SHAREbeta
Free gigabyte of storage for people to share files. Can select access level and can keep track of who you shared files with before. Can embed files in blogs and automatically creates thumbnails on the sharing interface.
Danielle Diebler
Pacifica, new Adobe product
High quality voice for Adobe Flex and Air developers.
Nigel Pegg
CoCoMo
Adobe Acrobat Connect - New version built on new client/server architecture code named CoCoMo. It is now based on Flex. Real-time data messaging, real-time AV streaming, user identity presence & permissions, realtime publishing and collaboration. Showed some code that should be easy for developers to include real-time video in their rich web applications. Shared whiteboard is a component that can easily be added as well.
Mark Anders, Steven Heintz
Thermo - RIA Design Tool
Makes it easier for designers to build rich internet applications. Helps them wire in interactivity without writing any code. Has a seamless workflow for developers working with Flex Builder. On a blank canvas, he dragged a rectangle and changed properties such as the color. It automatically wrote some MXML tags to represent what was drawn. Pulled up a static comp in Photoshop. In Thermo, he started a new application and imported the PSD file, preserving all properties of the PSD file. It again automatically wrote the MXML code for the layout. Using the layout as a background, he selected the text and created a text input control by right-clicking it and selecting text input control from a dropdown menu. It retains the same font and style as the PSD file. Selected a row of album cover thumbnails and converted the row into a list of albums. Clicked on one album cover and set behaviors for rollover that includes transitions. Made the rollover state larger just by dragging the icon larger. Added artist name and album name to the rollover state. Transition was a tween between normal and larger state on rollover using a timeline to control speed of the transition (just like flash). Set the album and artist text fields to be dynamic. Created a scrollbar from a graphic of a rectangle by selecting it from a dropdown, then wiring it to the album list visually by making a line to it. No coding was involved at all in creating the interface. Everything is done automatically. This was a very impressive demonstration. Basically, an artist can create a live application from a Photoshop file.
Flash Media Server 3 will be released in 2008 as well as Adobe Media Player.
Introduction to Actionscript 3.0
Chris Florio, Professor of Interactive Media at the New England Institute of Art.
This was a hands-on session, but we mostly observed. There are about 10 different concepts that need to be mastered to know Actionscript 3.0. Actionscript 3.0 differs from the previous versions in that none of the code may go into individual symbols like buttons. All code must be entered into keyframes. AS3 is not compatible with code written in AS3, so there could be some interoperability issues. Even though AS3 is more verbose, the typical user will pick it up quickly once they get the hang of how buttons are implemented via event listeners. Most end up liking AS3 better. It is more consistent in that in AS2, there could be many different ways of doing the same thing, whereas in AS3 there is usually one correct way. It is more like a regular programming language now and is much faster at runtime. This was a good overview of what changes have taken place in AS3 and a good primer on getting up to speed quickly.
Branding and Protecting Flash Enabled Video
Robert Reinhardt, VP Multimedia Platforms Group, Schematic
Not much they can do until Flash Media Server 3 comes out yet as far as protecting videos. Talked about why Flash is a desired platform for video: ubiquity, player dominance, express install and autoupdate, player SDK availability, cross-platform reliability, high quality visual experience, collaborative environments. Showed different sites - ABC.com full episode player and Nicelodeon.com video, and how they can adapt the Flash player to fit their desired audience. Also showed ShopVogueTV, which was built on a Flex framework that doesn't look like a typical Flex site. For people who like to watch the ads and shop for products related to them. New AVC/H.264 codec will have superior image quality and compression. Available in Flash Player 9 update 3. Compared the two codecs, Spark and VP6. VP6 is more desireable because it can deliver higher quality at a lower bit rate. Spark would have to be used to make video backwards compatible with earlier versions of Flash. Turning Smoothing on for playback will result in nicer video, however, some pre-Intel Macs may bog down with it. Not many people know about this playback option (it is not a compression option). http://blogs.flashsupport.com has an interactive video bitrate calculator in the form of a wizard. Video codecs such as On2 VP6 and Sorenson Spark perform better when the frame width and height use multiples of 16. While you can use any width and height in your encoding settings, non-optimal dimensions can result in poor image quality and reduced frame rate. For the best image quality and playback, you should always use width and height dimensions that use a multiple of 4 (good), 8 (better), or 16 (best). Showed a few examples of things from his book including a video class for AS3. Showed an example of captioning component FLVPlaybackCaptioning available for AS3 that can turn captions on and off. Showed how nicely the captions scaled when displayed full screen on the projectors screen. Made a customer skin that hid the playback controls to make the user watch an ad before the video. Used code to completely control the display of the video. Can cue up a bunch of instances of videos for the same FLV playback component.