Menu
Search
23 July 2013

Breaking Development: Pitfalls and Triumphs of the Cross-Screen Experience

I’m attending the Breaking Development conference in San Diego this week, and will be posting my notes from a few of the talks here.

I really enjoyed Cameron Moll‘s talk entitled “Pitfalls and Triumps of the Cross-Screen Experience”. One of the things that I appreciated is that it’s one of the first talks here I’ve seen that looked a bit more critically at Responsive Web Design. Not that Cameron isn’t a fan of responsive design, but he does bring up some interesting questions about its limitations. Here are my notes.

The need for multi-device experiences

  • “We don’t know what will be underneath Christmas trees two years from now, but that’s what we need to design for today” – Brad Frost
  • The best interface is the one that’s within reach.
  • Forget mobile. Think multiscreen.
  • At any time during the day, I may have 2-5 screens in use.
  • Would be more if you include screens in cars, other internet-enabled devices.

Five guidelines for multi-screen experiences

  • Discrete: an experience on one screen independent of, but ideally cohesive with, experiences on other screens
    • Twitter.com and NPR.com have great multi-screen experiences
  • Sequential: An experience capable of flowing from one screen to another
    • Amazon.com cart is available across multiple devices
    • 67% use multiple screens sequentially for online shopping
    • 90% use sequential for online activities in general
    • Up to 49% email themselves a link for continuing the activity on another device
  • Complementary: An experience complemented by a device’s unique capabilities
    • Day One and Google Maps apps utilize device capabilities of desktop browser and native apps
  • Extensional: An experience that controls, or is controlled by, another source
    • Instagram photos can be reposted to other networks, or pulled into apps like Flipboard
    • APIs essential for these types of experiences
  • Simultaneous: An experience involving multiples screens used simultaneously
    • Watching TV while going online with phones or tablets

Some do’s and don’ts for cross-screen experiences

Don’t:

  • Stereotype devices (or their owners, for that matter)
  • Fall prey to the convenience of device silos — we’re using multiple devices for multiple purposes
  • Unforgivingly force your app on users — let them use the web if they want to

Do:

  • Respect users’ mental models, aesthetically & functionally
    • Flipboard iPad and iPhone apps have different scrolling directions (left-right vs. up-down)
    • The iOS App Store “Update All” button is on opposite sides on iPhone and iPad
    • Simplenote has a “Done” button on iPhone, but not on iPad
  • Sequence tasks across screens (to the extent possible)
  • Make it vertically responsive, too
  • Leverage outside expertise

A closer look at Responsive Web Design

Don’t believe responsive design is a one-size-fits-all solution:

  • RWD is a must… for the browser, that is
  • How did native app development escape the same scrutiny?
  • Why don’t we have Media Query Snippets for native apps?
  • Amazon’s lack of RWD is not a concern — most of us rarely use their web site on mobile devices
  • You have to figure out the cross-screen experience for your product, because there’s not a single solution that applies to everyone
  • Remember, No One’s Forgotten How to Pinch and Zoom
  • What if pinch & zoom utilized media queries to render the layout differently (for those wanting denser content) vs. one size fits all? Demo: Gesture-Enabled RWD Proof-of-Concept

eBay CEO John Donahoe gets it:

We understand mobile to be just another screen…

It was a great talk with lots of food for thought.