Upgrade to Pro — share decks privately, control downloads, hide ads and more …

It's All About Context

Kevin Suttle
August 17, 2010

It's All About Context

Flash is everywhere now. On the desktop, in pockets, and even on TVs. The key to making your application uniquely valuable is to provide a consistent user experience by focusing on context. While we have the tools to create/author 80% of the code and interface, we must capitalize on the uniqueness of each device and platform to deliver an optimal experience that is mobilized, not minimized. Discover how screen resolution, portability, native interface controls, and use-case – the context of your app – dictate how the last 20% of the experience needs to be tailored. In this session, we’ll explore the new range of capabilities you should consider when planning to deploy applications across a variety of contexts including web (Flash Player 10.1), mobile (Android phone) and the litl OS.

Kevin Suttle

August 17, 2010

More Decks by Kevin Suttle

Other Decks in Design


  1. None
  2. Featured author for InsideRIA Tech Reviewer for O’Reilly’s Flex 4

    Cookbook Contributed just under 150 bugs/features for Flash CS5 Co-organizer of the Flash and the City conference in NYC kevinsuttle.com | @kevinSuttle KEVIN SUTTLE Channel Developer - litl
  3. kevinsuttle.com | @kevinSuttle KEVIN SUTTLE User Experience Designer Interaction Designer

    User Interface Designer Usability Engineer Information Architect Honest, people-centered, holistic approach. No nonsense. UNOFFICIAL JOB TITLES
  4. None
  5. CONTEXT “the interrelated conditions in which something exists or occurs”

    - dictionary.com Kind of generic.
  6. MULTI-SCREEN is a good description, but I don’t think it’s

    a good definition. There is a difference.
  7. MULTI-SCREEN seems to infer that the screen size, screen resolution

    and screen density are the main considerations. ...at least to me.
  8. I PREFER THE TERM Contextual Applications (or Contextual Experiences)

  9. ADOBE’S DESCRIPTION ”These solutions are broader in scope than a

    device, a campaign, or a single service; rather, they encapsulate the various contexts in which the end user exists, interacts, thinks, consumes, and purchases.”
  10. WHY IT MATTERS As developers today, we are more and

    more likely to port our applications to multiple devices and runtimes than ever before. One-offs are becoming increasingly less common.
  11. WHY IT MATTERS Context is much more than being aware

    of screen sizes. the user’s surroundings/location runtime/hardware capabilities time-sensitivity user presence social interaction ... plus much more
  12. FURTHER TO THE POINT ”Your content is of little value

    to its users if it ignores the context in which it was viewed, manipulated and processed.”
  13. None
  14. FAMILIAR TERRITORY The desktop has been our stomping grounds for

  15. DESKTOP ADVANTAGES 96% of monitors today are higher than 1024

    x 768 422 million broadband households in the US alone Multiple inputs (hands and peripherals)
  16. MODERN RENAISSANCE The desktop of 2000 is not the desktop

    of today
  17. NEW FEATURES - Native Process API - extending AIR natively

    - Mass Storage Detection - Drag and Drop Remote Files - P2P, UDP, Secure Sockets - Global error handling - Screen reader support - IME Text - Default ‘open-with’ settings OS-wide
  18. THE LINE IS BLURRING Web experiences and desktop experiences are

    converging more and more. With the advances of HTML5 and Flash, the differences between AIR, browser, and native applications are going to be a lot less noticable.
  19. None
  20. ALL OF A SUDDEN BAM. We’re all mobile developers. AIR

    on Android spawns a whole new set of developers ‘Full Flash’ on mobile handsets
  21. MOBILE EDUCATION Unless you’ve been doing mobile for a long

    time, it’s not as simple as you may think, and it is constantly changing.
  22. MOBILIZED Not minimized The key is to leverage the device-specific

    advantages. Provide immediate, relevant value with a planned, deliberately short list of interactions. Data should be readily accessible, and meet the needs of a mobile user. Simple != minimal.
  23. MOBILE FIRST Many are joining the ‘Mobile First Revolution’. It

    allows a team to focus on the most important features, specifically those that add the most contextual value.

  25. MOBILE = SOCIAL ”The mobile handset is, by its own

    nature, a social artifact; an object made and used by people, to connect with people.” - C. Enrique Ortiz
  26. THE 7th MASS MEDIUM 1. Printing Press 2. Recordings 3.

    Cinema 4. Radio 5. TV 6. The internet 7. Mobile
  27. 5 UNIQUE BENEFITS 1. First truly personal mass media 2.

    First always-on mass media 3. First always carried mass media 4. Only mass media with a built-in payment channel 5. Offers point of thought (ability to create or consume content whenever the mood strikes)
  28. LOCATION IS IMPERATIVE Easy to underestimate, but locational context is

    crucial. - Your application should adapt to handle many light sources and viewing angles - If sound is important to your application, think about noisy public places, use more text instead - Be prepared to handle network interruptions - Be prepared to handle phone interruptions - Consider privacy (user is home vs in public)
  29. MOBILE GOTCHAS Screensaver mode* Battery-life Hardware performance limitations Saving state

    upon interruptions* * can be remedied in Flash Player 10.1
  30. None
  31. THE DIGITAL HOME Modern experiences for modern families

  32. KNOWS THEIR AUDIENCE The litl family computing platform is meant

    to be used specifically in the home, with a focus on content.
  33. AN ENTIRE OS Powered-by Flash, at your disposal. This allows

    you to take advantage of unique, tailored hardware that has context at the forefront of it’s design.
  34. MULTIPLE CONTEXTS With the litl SDK, you can design channels

    that handle 3 different types on contexts. 1. Card view 2. Focus view 3. Channel view (a.k.a. Easel Mode) Allows you to be creative in developing content that is both passive and interactive; consuming and creating.
  35. FLASH ON YOUR TV Average American watches 4.5 hours of

    TV a day 65% of homes have broadband 70% want internet on TV
  36. litl’s 4th CONTEXT The TV

  37. A NEW FRONTIER - Full keyboard - Touch/Gesturing - Accelerometer

    - Microphone
  38. FLASH ON YOUR TV! Not just widgets You now have

    entire HD television screens for your full Flash-powered games, content, and media!
  39. WHY litlOS MAKES SENSE The web book and upcoming set-top

    box are hardware that is laser-focused on user’s context. The SDK is straight-forward, well-documented, tested Support is readily available Open and clear submission guidelines for custom channels litl is ready for your creativity (developer.litl.com) Develop how YOU want to.
  40. OPEN FOR SUBMISSION! Our channel store is now accepting submissions.

    Visit developer.litl.com for details and to register ideas!
  41. None
  42. CONTEXT-AGNOSTIC There is no such thing as ”write once, deploy

    everywhere,” unless you want your application to suck. However, there are many aspects of contextual application development that will be the same no matter where you choose to deploy.
  43. PERFORMANCE Performance is no longer an option. No matter where

    you deploy, your application needs to perform exceedingly well.
  44. RESPONSIBILITIES “With great power comes great CPU usage” - ME

  45. SERIOUSLY THOUGH It’s very easy to forget about, but performance

    is a lynchpin across all contexts. Optimization MUST be a part of your iterations/sprints.
  46. GOOD NEWS AIR 2+ and Flash Player 10.1 rescind control

    back to you. Dynamic Framerates Flash Player Throttling - SWF is in a hidden tab - SWF is scrolled out of the viewing area - GPU Video acceleration
  47. GOOD NEWS Support for many types of hardware rendering -

    Vector graphics - Bitmaps - 3D effects - Filters/Shaders - Color transforms - Alpha transparency - Device/embedded text fonts - Bitmap caching
  48. BAD NEWS Some performance tuning methods are dependent on browser

    support, though it shouldn’t hurt to include them. Progressively enhanced Flash will become common soon. You should check each browser/device for support details.
  49. ARCHITECTURE In a typical MVC(S) architecture, the view is the

    only thing that should have to significantly change.
  50. MODEL and CONTROLLER Your data structure and value objects should

    already be scalable enough to not impact performance on mobile and other non-desktop devices.
  51. SERVICES Tread carefully here. Server calls can be costly in

    terms of memory, battery and even actual money in the case of mobile. Not everyone has unlimited data plans. Make good use of push, or asynchronous calls when it makes sense to.
  52. SHARED OBJECTS You can minimize server calls SQLLite is not

    available in all cases SharedObjects seem to ‘just work’ On litlOS, SharedObjects are available, but it makes more sense to explore the shared properties model in
  53. LAYOUT One of the most fun objectives to handle. -

    Stage.Scalemode - Stage.Resize (best option) - Stage.OrientationChange (flash.sensors)* *Limited to accelerometer, doesn’t always behave how you’d expect.
  54. IT’S ALL RELATIVE Or at least it used to be.

    - Pixels are a relative unit of measurement. - Screen density and PPI/DPI are the most crucial and is the property that will change the most (Capabilities.ScreenDPI) Christian Cantrell suggests investing in a ruler to make sure your measurements are consistent
  55. GET PHYSICAL Many of your users will only be using

    one hand to interact with your mobile application (typically the right hand). When you’re designing assets, use your own hand as a guide on the screen to judge how accessible and ergonomic your application is, as well as what might be covered up by a user’s hand. Rule of finger: 10mm (44px) for finger touch, but that’s an average. Never hurts to make it bigger.
  56. DON’T GET TOUCHY unless you have to. Multitouch is great,

    but not always necessary. Unless you need specific multitouch gesture support, mouse events ‘just work’ on multiple devices.
  57. GET VIRTUAL Many mobile devices have native keyboards, some have

    physical keyboards only, and some have both. Be sure to account for this when designing your application, as it could easily go awry. You don’t want a native keyboard covering up your screen assets.
  58. GO GLOBAL Globalization API in Flash Player 10.1 - Text

    language/orientation (RTL) - Date/Time - Currency formatting/parsing - Number formatting/parsing - String comparison for sorting or searching for text - Upper and lower case conversions
  59. TAKE CONTROL With AIR on Android, you can control your

    desktop client with a controller app. With the litl OS, you’ll be able to control a channel on the web book with an iPhone or native Android device.* *See more about this in October, at the litl-sponsored FITC Unconference at MAX + (Free beer!) as well as RIAUnleashed Boston in November
  60. FOR MORE INFO @kevinSuttle kevinsuttle.com developer.litl.com @litl @litlDev