adapting expectations to fit a mobile workflow
TRANSCRIPT
Adapting Expectations to Fit a Mobile Workflow
Presented by Joseph Labrecque D2W Conference – July 15th 2011 – Kansas City, MO
Introduction
Joseph Labrecque, MA Senior Interactive Software Engineer University of Denver – CTL
Fractured Vision Media, LLC
Adobe Community Professional Adobe Education Leader
Flash Development for Android Cookbook
What we’ll be talking about
• Background – Platforms – Tooling
• Expectations – Adjust them
• Workflow – Planning – Design – Development – Testing
• Publication
Starting out…
• Mobile can be a pain! • Mobile is also
addictive and FUN!
A plethora of devices
Mobile Devices! • Smartphone OS
– iOS – Android – Windows Phone 7 – WebOS
• Tablet OS
– iOS – Android – Tablet OS (QNX) – WebOS
Advancements in platforms
• Web Browsers • JavaScript Engines • JavaScript Frameworks • Flash Player • Adobe AIR • Native (Obj-C, C#, Java)
Advancements in Flash / AIR
• Open Screen Project • Adobe AIR
– AIR for Android – AIR for iOS – AIR for Tablet OS – AIR for ???
• Flash Player – Android and QNX
Advancements in tooling
• Flash Professional CS5.5 – iOS – Android – Project linkages
• Flash Builder 4.5 – Mobile Flex Projects!!! – iOS – Android – Tablet OS
Web apps are lacking (on mobile)
• Tiny controls on 160-320 PPI screens
• Video generally not optimized for mobile
• No Flash Player on iOS – (thanks, Steve)
• Need a directed cross-platform app solution
Let’s have a look… (desktop)
Expectations
• Existing content – Let’s get it on mobile – Hmmm…
• New content – What does it need to do – How do we do it – Hmmm…
Adapting expectations
• Fingers… and touch… – We need big buttons – New interactions
• Small screens – This won’t fit – Will it fit now?
• Slow processors – Think 7 years ago
• Time to change your thinking
Let’s have a look… (mobile)
Workflow matters!
• Decisions and Planning around restrictions
• Distill your Ideas! • Designing for Touch • Designing for Gestures • Designing for Movement • Develop for Directness • Release and Test often and
everywhere
Planning
• Realistic • Directed • Tear-Down • Usability
Design: How?
• Fingers • Gestures • Obviousness • Platform-awareness
Design: What?
• Flash Catalyst • Fireworks • Illustrator • Photoshop • Flash Builder (really)
Development
• Multiplatform – Simulators – Media Queries – Flex Libraries
• Lots of new concepts when dealing with mobile
Simulators
• Take advantage of Flash Builder simulator
• Stay away from the Android emulator
• Device Central can also be useful
Application Scaling
• applicationDPI can be set in the app root tag – 160 x1 – 240 x1.5 – 320 x2
• Dependent upon the correct DPI report from the device on runtime to function correctly…
Media Queries
@media (os-platform: “Android”) {} @media (os-platform: “QNX”) {} @media (os-platform: “IOS”) {} @media (application-dpi: 160) {} @media (application-dpi: 240) {} @media (application-dpi: 320) {} Just like “standard” CSS ;)
CSS
Flex Libraries
• Share “core” project code across Flex Libraries
• Use targeted application logic which wraps the core
• Export release builds specific to each target platform
Let’s have a look… (code)
Testing!!!
• Android is an excellent test platform
• Test on device • Test a lot • Get friends to test • Get your parents to test
I can help!
Releases
• Android Market • Amazon AppStore • BlackBerry AppWorld • iTunes App Store
• Who’s next???
– Hi, Sony!!!
In conclusion
• Mobile requires a certain directed approach that is not required with desktop application development.
• Mobile takes a lot more planning than what you may be used to…
• Mobile takes a lot more testing than what you may be used to…
• Mobile users still expect everything to work flawlessly on whatever random device they may be using.
• A good workflow can help in all these areas!
Thanks!
• Catch me at these upcoming events… – Adobe Summer Institute ”Building a Functional Flex
Mobile Application for Android in Less Than an Hour” – COLTT “Mobile computing in a ‘Post-PC’ era… right?”
+ Café Pédagogique “Does your institution need a mobile app? Probably not.”
– Adobe MAX “From Desktop to Mobile: Application Functionality for Small Screens” + FITC Unconference @ MAX “UX Concerns across Mobile Platforms”