1 / 15

Adobe Presentation

Adobe Presentation. Dragos Dascalita | Designer - Developer workflow with Flash Catalyst and Flash Builder. Goal. Method to enhance Designer a nd Developer collaboration to Streamline d evelopment process. Goal, in other words. Make Designers and Developers happy .

lam
Download Presentation

Adobe Presentation

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. Adobe Presentation Dragos Dascalita | Designer - Developer workflow with Flash Catalyst and Flash Builder

  2. Goal Method to enhance Designerand Developer collaboration to Streamline development process.

  3. Goal, in other words Make Designers and Developers happy 

  4. Problem : Main challenges between designers and developers • Easily push changes that might have been considered insignificant and delayed past shipping date • Create prototypes and preview the changes easily in the real app • Catch XD mistakes on time before it’s too late Designer • Pixel perfect match • Reflecting the design changes into the app • Transform visual assets into code • Little UI expertise Developer

  5. High-level workflow Designer Modify design Create design 1.0 1.2 1.1 … Developer 1.0 1.1 Prepare design Development

  6. High-level workflow integrating wire-framing processes Designer Modify wireframes Create wireframes Sign-off Customer agreement on functionality 1.1 1.0 Developer 1.0 1.1 Optional enhancements

  7. Phase1 : [ Designer ] Create design with Flash Catalyst Create design 1.0

  8. Flash Catalyst and Flash Builder • Catalyst – WYSIWYG over Flex SDK • Has similar principles with Flash Builder, hiding the code, exposing visual tools – excelent for designers • This means: • It comes bundled with a Flex SDK • It compiles a Flex project in the same way Flash Builder does • Keeps all project files into a single file for simplicity

  9. Phase2 : [ Developer ] Prepare design with Flash Catalyst and Flash Builder (I) Main Challenge Code base : multiple files Maybe multiple projects too Flash Catalyst: single file 1.0 Prepare design

  10. Phase2 : [ Developer ] Prepare design with Flash Catalyst and Flash Builder ( II ) • Flash Catalyst project file is a zip container • Instead of maintaining a duplicated code base inside the Flash Catalyst project file, maintain only a few compiled modules: • Identify functional areas • Split functional areas into modules • Load a runtime skin ( Compile CSS to SWF ) • Externalize as much as possible the look & feel and UI behavior into skin classes 1.0 Prepare design

  11. Phase2 : [ Developer ] Modularize application ( III ) Common library to be shared among modules and applications Module #1 Module #2 Module #... Main App – shell application Services

  12. Phase 2 : [ Developer ] Include modular application into Flash Catalyst ( IV ) • Transparent for the designer • Only developers maintain this. Module #1 Module #2 Common library Mimic shell application loading some modules

  13. Differences from Flash / Illustrator approach • Flash / Illustrator gives you access to the assets • Catalyst can give you access to the real stuff • Flash / Illustrator - design how stuff looks • Catalyst –control how stuff behaves and looks

  14. Recap + Q&A Thank you

More Related