1 / 30

Flash And other mysteries of the web…

Flash And other mysteries of the web…. Paul Trani Adobe Certified Instructor/Expert www.paultrani.com paul@paultrani.com Resources: www.designupdate.com/flashtraining www.designupdate.com. An Introduction. What is Flash? How do I make Flash content? What is the Flash Player?

zoe
Download Presentation

Flash And other mysteries of the web…

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. FlashAnd other mysteries of the web… Paul Trani Adobe Certified Instructor/Expert www.paultrani.com paul@paultrani.com Resources: www.designupdate.com/flashtraining www.designupdate.com

  2. An Introduction • What is Flash? • How do I make Flash content? • What is the Flash Player? • What is Flash Video? • Where can I play my Flash content? • Who uses Flash? • Is Flash the only tool out there? 1-5

  3. What is Flash? Seamless video integration: http://www.nike.com/nikeair/ Flash is everything that’s cool about the web. Receive/record video:http://www.webcamtastic.com Video delivery: http://www.youtube.com Streaming Video: http://www.nbc.com

  4. TV And everything cool about other platforms as well… Wireless Handhelds iTV & Consoles Desktop Browser

  5. But technically, what is it? • Flash is the development environment that is used to design, develop and publish SWF documents. The flash “source” file is an FLA file. • The published Flash document is an SWF file (small web format). This is what goes on “the web”. • Flash video (FLV) files can also be created from flash. • In order to view Flash content, users need to have the appropriate version of the Adobe Flash Player installed on their computer because a Flash file is not composed of HTML. The Flash Player reads and interprets SWF content. 2-2

  6. Interface

  7. How is it most commonly delivered? Source File .AVI, .MOV, .WMV, .DV, .MPEG Web Server http://www.flashcomguru.com

  8. What is the Flash Player? • Flash Player is a lightweight client with near 100 percent market acceptance • Version 7 supports streaming and download video, faster playback, rendering of elements • Version 8 supports the video with transparency, layer blend modes, layer effects • Flash Player eliminates browser/platform compatibility issues. • Flash Player can be supported on browser and non-browser devices. • Flash Player supports mobile devices and handhelds. • Create once, deploy everywhere. • Flash Player provides more capabilities to developers and users than HTML does. • http://www.thefwa.com 1-5

  9. What is Flash Video? Flash Video - video files compressed into FLV format • The Flash Player is used to send/receive video • Custom video players are built using • Flash Professional 8 • Dreamweaver 8 makes it easy to embed Flash video • Video in Flash can be embedded, progressively downloaded or streamed using a Flash Video streaming service. • Video can be integrated seamlessly • Live and pre-recorded video are supported

  10. Another slide the marketers like… • Higher availability • 23% more than Apple QuickTime • 39% more than Real Media • 12% more than Windows Media Player • If it works in Flash, it works everywhere • No unwanted player controls/interface Starz Edge • No “backdoor” communication • Embed video in context with content • Easily control playback with ActionScript • Video can be made “interactive” JCOnline.com • http://www.flashstreamworks.com

  11. Who uses it? Designers • Use it to create enhanced user experiences giving them total creative control Developers • Use it to create robust internet applications. www.bacardiflavors.com 1-5

  12. Who uses it? A couple of realizations: • Web and Instructional Designers were using it to create training and demos, including importing screen recordings. • Web Developers didn’t care for the timeline or drawing tools uneccesary for their job. 1-5

  13. Related Adobe Software Adobe created two new programs that also produce swf files: • Captivate • Flex 1-5

  14. Captivate

  15. Introducing Captivate • Easy way to create professional-quality, interactive simulations and software demonstrations in Flash format • Automatically record onscreen actions, including • Editable mouse movements • Text captions • Scored click boxes • Add e-learning interactions like data-entry fields and customizable quizzes • Ideal for rapid application training, user support tutorials, and online product demonstrations 2-2

  16. Using the Edit View • Contains the Filmstrip which shows all the slides while you edit an individual slide • This is the view in which you add project objects such as text captions and images 2-10

  17. Introducing the Captivate Interface Elements Menu Bar Toolbar Timeline Filmstrip • Use the Menu Bar to access menu commands, such as File  Open • Use the Context menu to select a command from the menu • Use the Toolbar access Captivate functions, such as Preview or Save • Use the Timeline to view all the objects on a slide and their relationship to each other • Use the Filmstrip to see all the slides in your project 2-11

  18. Flex

  19. Flex Strengths • Relatively easy to create form based applications and heavy data entry interfaces providing it’s own layout engine with a seperation of code from graphics, giving mostly a code view for creating ActionScript and MXML code. • Outputs SWF files for Flash Player 9 • Programmers like it import Character; var a:Character = new Character(); addChild(a);

  20. Flex Isn’t Flash • Flex has no timeline • Flex has no library • Flex has no drawing tools • Flex can look boring

  21. http://examples.adobe.com/flex2/consulting/styleexplorer/Flex2StyleExplorer.htmlhttp://examples.adobe.com/flex2/consulting/styleexplorer/Flex2StyleExplorer.html

  22. Flex with Flash • Applications look the way your designers want • Better animations • Better integration & modifications of video and sound • Better user experience • Less compromise

  23. Flex with Flash

  24. Dissecting the Design • Background? Definitely Flash. Load a SWF. • Buttons? Custom component or SWF skin.

  25. Flex • Flash makes Flex better, through graphics, sound, animation, and video • More design control • Better design = more usable app

  26. But is Flash always the answer?

  27. DREAMWEAVER 8 • Use Dreamweaver to generate HTML tags for page formatting and view the resulting HTML source code • Create and link style sheets for a consistent look and feel of your web pages • Use graphics to make your website attractive and link to other pages • Create links between and within pages, as well as links to email addresses

  28. Windows Designer Workspace

  29. Using Development Views • Three views: • Design view • Code view • Split view

  30. (But Flash is cooler…)

More Related