Prototyping Adobe AIR Applications with Fireworks CS4

  • 3,900 views
Uploaded on

This presentation gives an overview of prototyping AIR applications using Fireworks CS4. You can get the source for the prototyped application here: …

This presentation gives an overview of prototyping AIR applications using Fireworks CS4. You can get the source for the prototyped application here: http://scalenine.com/blog/2008/12/01/adobe-max-presentation-and-source/

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
3,900
On Slideshare
0
From Embeds
0
Number of Embeds
2

Actions

Shares
Downloads
115
Comments
0
Likes
7

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Prototyping Adobe AIR Applications with Fireworks CS4 Juan Sanchez MAX 2008 ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 2. Who is this guy? ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 3. Introduction  The Bene ts of Prototyping  Why Adobe Fireworks CS4?  How Adobe AIR Fits into the Picture  A Live Look ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 4. The Bene ts of Prototyping  Helps all parties gain easy understanding of goal  Helps the internal team build the nal product more accurately  Reduces the documentation overhead  Reduces misinterpretation  Generates excitement for internal buy-off, funding, or demonstration ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 5. Why Fireworks?  Easy Creation  Fast, drag and drop environment that allows for bitmaps and vector  Pages and states allow for organized structure  Styles and symbols for easy construction and updating  Easy hotspots for links, code, behaviors  Fast Deployment  Deploy to multiple environments simultaneously (HTML, SWF, Flex, FXG, AIR, PDF)  Assets are production-ready  Create prototypes quickly without investing time in coding  Customizable  Extend Fireworks through a robust scripting environment ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 6. Structuring the Application ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 7. Tying Things Together  Slices  Cuts images up for easy image swapping  Attach links, behaviors and code  Links  Allow you to jump to other Pages  Attach behaviors and code  Behaviors  Attach actions like Swap Image or Rollover  Triggered by interactions like onClick, onMouseOver, etc.  Code (JSF)  Scripting used in Fireworks for advanced scenarios ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 8. How AIR Fits into the Picture  Adobe AIR  Build rich Internet applications that deploy to the desktop and run across operating systems  Desktop Prototyping  Custom Chrome, Desktop Icon, etc.  Consider the operating system’s (OS) guidelines  Integrated experiences with the OS (e.g., Filesystem, Drag-Drop, Windowing)  Browser within app, instead of app within browser  Apple Human Interface Guidelines  http://developer.apple.com/documentation/UserExperience/index.html  Windows User Experience Guidelines  http://msdn.microsoft.com/en-us/library/aa511258.aspx ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 9. Let’s Prototype Something!  Plan it out  Diagram and sketch  Interaction models  Lay it out  Structure the pages, layers and states  Design and build  Design key screens rst  Build symbol and style library  Build states  Fill in the rest of the pages and states  Link pages and assign rollovers  Export to Adobe AIR ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 10. What we’re Prototyping ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 11. Recommended Resources  Fireworks and Skinning  senocular.com  weblogs.macromedia.com/amusselman  reworksguru.com  scalenine.com  Adobe AIR Showcases  adobe.com/products/air/showcase  refreshingapps.com  airapps.pbwiki.com  Interface Guidelines  developer.apple.com/documentation/UserExperience/index.html  msdn.microsoft.com/en-us/library/aa511258.aspx  adobe.com/devnet/ ex/ g ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.
  • 12. Questions? juan.sanchez@effectiveui.com ® Copyright 2008 Adobe Systems Incorporated. All rights reserved.