PATRICK JOSEPH BESONG: October 2007 Archives

Update on the Simulation project and the Sports Museum Kiosk

| | Comments (0)

I haven't posted for a while, mostly because I just hadn't had that much to say, but have also been busy with other things.

I blew the dust off the actionscript I'd written for the anesthesiology simulation with the idea of simplifying it and adding a couple of things. I don't remember if I mentioned before that I will be putting together a hands-on workshop for the 8th Annual International Meeting on Simulation in Healthcare in San Diego this coming January. Sounds pretty hoity-toity. I'll basically be showing people the technical end of how I put this simulation together and how they can use the same template to create other simulations in the healthcare field. And who knows, maybe some rich southern-California company will offer me a job with a huge raise to create such apps for them. And maybe monkeys will fly out of my butt, too.

Anyway, back to the sim. What I wanted to do in this version was to simplify wherever I can. So, I decided to drop using XPath, as cool and as hip as it is, because I was afraid that people would forget to use the data binding part of it and would be frustrated that their code is right but that it doesn't work for them. So I used my more recently acquired understanding of XML to pull in the data and parse it. Once I homed in on the correct path to the data I needed, it was simply a matter of changing one number to get the data for each different field from the database and push it all into their respective arrays. Here is what the code now looks like:


sims_xml.load('xml/sim.xml');
function processXML(xmlDoc_xml) {

// first we start a loop to get all the data from each field from each record

for (var n = 0; n<xmlDoc_xml.firstChild.childNodes[4].childNodes.length; n++) {

// each array corresponds to a field in each record
// the first one is the scene number
numberArray.push(xmlDoc_xml.firstChild.childNodes[4].childNodes[n].childNodes[0].firstChild.firstChild);
// then comes the title of the scene
titleArray.push(xmlDoc_xml.firstChild.childNodes[4].childNodes[n].childNodes[1].firstChild.firstChild);
// this is the photo associated with each scene
imageArray.push(xmlDoc_xml.firstChild.childNodes[4].childNodes[n].childNodes[2].firstChild.firstChild);
// this is the description of what going on in the scene
descriptionArray.push(xmlDoc_xml.firstChild.childNodes[4].childNodes[n].childNodes[3].firstChild.firstChild);
// this is the question that is posed to the user
questionArray.push(xmlDoc_xml.firstChild.childNodes[4].childNodes[n].childNodes[4].firstChild.firstChild);
// the next 4 things are the possible choices
choice1Array.push(xmlDoc_xml.firstChild.childNodes[4].childNodes[n].childNodes[5].firstChild.firstChild);
choice2Array.push(xmlDoc_xml.firstChild.childNodes[4].childNodes[n].childNodes[6].firstChild.firstChild);
choice3Array.push(xmlDoc_xml.firstChild.childNodes[4].childNodes[n].childNodes[7].firstChild.firstChild);
choice4Array.push(xmlDoc_xml.firstChild.childNodes[4].childNodes[n].childNodes[8].firstChild.firstChild);
// the next 4 tell the simulation which scene to go to if that choice is picked
choice1DestinationArray.push(xmlDoc_xml.firstChild.childNodes[4].childNodes[n].childNodes[9].firstChild.firstChild);
choice2DestinationArray.push(xmlDoc_xml.firstChild.childNodes[4].childNodes[n].childNodes[10].firstChild.firstChild);
choice3DestinationArray.push(xmlDoc_xml.firstChild.childNodes[4].childNodes[n].childNodes[11].firstChild.firstChild);
choice4DestinationArray.push(xmlDoc_xml.firstChild.childNodes[4].childNodes[n].childNodes[12].firstChild.firstChild);
// this is the background image for the simulation (could be different rooms, for example)
backgroundArray.push(xmlDoc_xml.firstChild.childNodes[4].childNodes[n].childNodes[13].firstChild.firstChild);

}
}

sim_xml.load('sim.xml');


Ok I see your eyes glazing over. The important thing about the above code is this - once I got the code right for one data field, if you look closely, each one thereafter was one number more (look at the last number in brackets for each line). Also note that they must be in the order that they appear in the XML file, so if you decide to add a field in the database, it's best to export it with that field at the end or it will hose the code.

The reason I mentioned the Sport Museum Kiosk was that what I learned in that project I'm also applying here in the sim. The kiosk has been used by the general public now all football season. The one problem we had with it was that occasionally it would act completely weird. Data would get confused with other data and the scrolling list of names would suddenly scroll to the end without even touching it. I was unable to duplicate this problem on my Mac. Worked perfectly every time. What I eventually came to figure out was that the interface was offering links to data that had not fully loaded yet. So, what I had to do was move the display of the links back a frame from where the XML is loaded, then tell it specifically to go to the next frame once all the data is loaded. So far so good. No more complaints. I think I have this problem licked. I'm employing the same strategy with the simulation. Make sure the gun is loaded before you try to fire it.

In a separate version of the simulation from what I'm doing for the workshop, I'll add some features like having a timer and a default scene for the sim to go to if someone takes too long to decide. Another feature is what we might call a dice. By that I mean that if the chances are 80% that something should happen, the Flash simulation should do something else 20% of the time. I haven't fully worked this part out, but I think I have an idea how I'm going to do it. It may involve another field for a time limit and one for the default scene to go to if they don't choose quickly enough.

As far as the 20% of the time idea goes, I'm not so sure how to implement this yet. If you had four different choices, you might have 4 different alternate outcomes other than the one that it would go to 80% of the time. Or perhaps there are only two real results, I don't know. It may depend on what the choices are. We will have to discuss this further, and it definitely won't be something we implement for the workshop in San Diego.

Well, that's all for now. I already wrote a lot more than I'd planned to write.

Adobe Max 2007 Conference - Day 3

| | Comments (0)

XML 101
Robi Sen, Senior Partner at Twin Technologies

Spry is Adobe's open source Ajax framework. Not a presentation language. Just a way of formatting text. XML is easy to read by a computer and easy to read by a human. Why use it? Clear separation of data, meta data, and presentation, W3 recommendation, easy to read and understand, easy to extend, great tool support, used by many applications and platforms. When to use it? For a common way of sharing data, storing data (but not a database) as a flat file, RSS, ATOM, XHTML, WML, Abstraction layer. Don't use it when you need to operate in a low bandwidth environment, when you need fast or high performance, when you are dealing with data that should be in a relational database, when XML's various benefits are not actually requirements for your project. Has root and child tags. Showed examples of XHTML and RSS. XHTML is a standardized form of HTML that is very strict in order to play well with all browsers. Showed how he uses Cold Fusion to save data as XML. Talked about XML nodes and tags. Everything is a node. Attributes are children of nodes that are simple properties of that node (name, phone, width, class, etc.). Generally don't need to comment since it's pretty readable as is, but comments are done like standard HTML comments. All nodes must be closed, it should have a single root node, should be properly nested (

...

), tags and attributes are case sensitive, attributes have to be quotes. Need to escape certain data. Can use for email: . A namespace is a unique identifier. Points to a url where the namespace is defined. So if 2 docs have the same idenditifer, it will know which definition to use. XML Schema vs. DTD. DTD is the old way of doing things. XML Schema is the new way. Should use schemas instead. Can use Dreamweaver to validate XML. It does not have very good support for schemas and DTDs, however. XSLT is a stylesheet language. "CSS on steroids". Can translate docs from one format to another (xml to pdf). XPath is a language for querying XML.


Introduction to Flex
Tom Ortega, Flex Developer, Workday, Inc.

silvafug.org has breeze tutorials on Flex. Uses Flex Builder as an IDE. Flex is component oriented. Uses AS3. States are different page layouts, effects, transitions between states (fades, pushes, etc.). Components - can be skinned to give your application a new look. Flex Builder is a complete IDE with debugger. First, start a new project and specify how you want your application to access data. Basic mxml file is created automatically. Can switch between Source (code) and Design (interface) by clicking a button. You can drag and drop coponents onto the blank interface. Double-click to edit component attributes. Changing "lyout=verticl'" will automatically apply layout defaults to the interface. Buttos and label tags are nested in the mxml code. He demostrated creating a olgin form for an app. Added a Submit button and a cluck function for it. He then created a function in a CDtat tag.
public function changelabel():void;
{
formlabel.text = username.test;
}
]]>

Although this presenter didn't do a very good job of presenting, I think I got enough out of this to get started with Flex.


How to Shoot, Edit, Encode, and Author Video for the Web
Shooting - 3CCDs is better. Use HD if you really need to get detail, like in close-up shots of a flower, for example. Onboard mic is only good for about 5-10 feet from the camera. Next best thing is a shotgun mic, which can be aimed at the speaker, or use wireless mic or handheld. Use a tripod for steady shots. Fluid head has smooth operation for pans and tilts. Keep backgrounds simple to not only keep the subject the primary focus, but it will also render better for the web if the background is less complicated. White balance manually to get proper skin tones. Aim the camera at a white card and manually adjust the white balance on the camera after zooming in to the card. Properly expose your subject with lighting so as to not lose information either in the lights or darks, which could be unrecoverable. A Neutral Density (ND) filter will block out light when the light is too great. Adobe OnLoaction - PC app that helps you with lighting in the field. Key light is main light, fill light brings up detail opposite of the key light. Light background separately. Don't break the 180 degree rule. Do not shoot 2 subjects where they appear on the same side of the scrreen. Use balanced audio cables (most XLR cables are balanced) to avoid noise. Keep sound level out of the red zone on the VU meters. Record 2 channels - 1 normal and one low, so if someone ends up shouting, you can switch to the lower level.
Encoding - avoid long transitions and fades. They don't compress well. Break up the video to make it more user friendly. They only download what they need to see. Captions - more accurate at encoding time instead of relying on actionscript which may not hit a keyframe at the proper time. You should de-interlace after editing or while encoding to preserve detail. Should try to shoot in progressive mode to begin with. Keep an ear for interactive sound bites that might be useful later. MovieStar will support h.264 and AAC audio. Will scale much better across many mediums. Talked about general encoding options, which were pretty much review for me. Captions are now supported via XML file in Flash video via FLVPLaybackCaptioning and FLVPlayback components in tandem. The XML file is linked externally to the FLVPlaybackCaptioning component just as the FLVPlaybackComponent is linked to the external FLV file. You must use a Flash document that is based on Actionscript 3.0 to use these components. Once compiled, the captions play below the Flash movie.

Building Applications using Actionscript 3.0 for Air
Grant Skinner, Chief Architect/CEO gskinner.com

Cross-plaform deployment via ".air" file or through "badge install". Leverages your experience with HTML, Javascript, AJAX, MXML, and Actionscript 3.0. Script bridging allows you to bridge the gap between actionscript and javascript. Free download of AIR tools. Air is based on Central 2.0, which was a miserable failure for Macromedia. They're not making the same mistakes with AIR. There is full access to the file system (no sand box), no shared interface, applications appear as standard applications to the user. and a much more robust API. AIR is NOT a robust desktop programming environment (yet). Slim subset of APIs to work with, it's not extensible via libraries. Many online services are migrating to the desktop using AIR. Casual gaming is becoming popular as well. Installations and kiosks are also a good use of AIR. The support market can also benefit from AIR. New components and libraries could be more easily distributed. Showed some examples of new AIR apps: DiggTop (sharing top news stories), gTimer (synching timetracking data).BuzzWord (document handling), RichFLV (displays que points and keyframes of Flash videos). AIR can create apps that have a clear window so it looks like they're on your Desktop.
To start using AIR:
Download and install the Flash CS3 update for AIR, create a new FLA and set the publish settings to Adobe Air 1.0. The AIR API consists of a new set of libraries for actionscript 3.0. Used Air Application and Installer Settings to make the window transparent. ID should be your domain name. Set the Window Style to Custom Chrome (transparent). He went through some of the code for an app he was building. Showed how it could interact with the screen properties, how to do a drag/drop event, how to check the content type of a flle that is dragged, so you know whether or not to accept the drop or not. Showed that he could get it to create a new file on the user's computer from a file dropped on the interface.

Adobe Max 2007 Conference - Day 2

| | Comments (0)

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.

Adobe Max 2007 Conference - Day 1

| | Comments (0)

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.