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

Design, Device, Delight

May 20, 2014

Design, Device, Delight

An engaging and fluid mobile user interface requires more than beautiful pixel arrangement. An exceptional design may not delight users simply because it is misaligned with device constraints. In this talk, Matt Seeley, a Netflix UI Engineering Technical Lead, will discuss design and engineering compromises faced when design-meets-device head-on and the solutions they’ve found to enable world-class streaming experience.


May 20, 2014

More Decks by Matt

Other Decks in Technology


  1. Delightful design is… • personalized (Carolyn Chandler, Brian Henkel) •

    responsive to orientation, tap & gesture • culturally relevant (Will Sullivan) • fluid in interaction & animation (Cory Hudson) • predictably worthwhile (Brandon Harris) • graceful amidst network interruptions • accepting of intermittent partial attention (Cate Hudson)
  2. Sharing context • Early and frequent collaboration • Design considering

    development • Implement considering user experience • Having trouble? Colocate!
  3. Device reality • Physical size & orientation • Pixel dimensions

    & density • Network & disk IO • Processor(s) speed • Available memory (main & video) • Device platform
  4. Tiles intersecting the viewport Pre-painted to cover scrolling TiledBackingStore Source:

    https://trac.webkit.org/browser/trunk/Source/ WebCore/platform/graphics/TiledBackingStore.cpp
  5. Avoid chasing unicorns • Beware of immediate content updates •

    Plan for graceful introduction of resources over time • Preload carefully
  6. Attributions Creative Commons – Attribution (CC BY 3.0) Golden Ratio

    designed by Jae Aquino from the Noun Project http://thenounproject.com/term/golden-ratio/9361/ ! Creative Commons – Attribution (CC BY 3.0) Code designed by useiconic.com from the Noun Project http://thenounproject.com/term/code/45869/ ! Creative Commons – Attribution (CC BY 3.0) Happy designed by Michael Hourigan from the Noun Project http://thenounproject.com/term/happy/3540/ ! Creative Commons – Attribution (CC BY 3.0) Group Think designed by Jose Morbán from the Noun Project http://thenounproject.com/term/happy/3540/ ! Creative Commons – Attribution (CC BY 3.0) Devices designed by Kelig Le Luron from the Noun Project http://thenounproject.com/term/devices/38380/ ! Creative Commons – Attribution (CC BY 3.0) Watch designed by Julien Deveaux from the Noun Project http://thenounproject.com/term/watch/48017/