Designing for Mice and Men
Bill Scott
@billwscott
Netflix
- Current Experience Chaos
- First we had a site, then we had devices.
- On 400 different devices
- How do we tame it?
- Netflix Owned Experience Across Devices
- Wanted a web-like design, development, a/b testing experience across all devices
- PS3 browser is Netfront, which is a clone of IE6. All the bugs of IE6 plus more. jQuery wouldn’t run on it.
- They decided to port webkit to the PS3.
- Then realized that they could provide this to manufacturers. If they had webkit, then they could design and develop for webkit across all devices.
- across TV, smartphone, tablet, browser.
- They have a single javascript bundle on the content delivery network, which they can change at any time, and update the experience across all the devices.
- Why do we want to own the experience?
- netflix is known for valuing UX. — you can’t do it if you don’t own it.
- We love server-driven, testable, dynamic UIs
- We like agile web better than rigid CE firmware process
- We value “learn fast/fail quickly”
- Any other path would lead to chaos
- Initial HTML5 Experience: PS3 – “Special”
- Content and navigation tied together.
- customers always self-report that they want movie discovery tools.
- Alternate HTML5 Experience: PS3 – “Plus”
- just a grid in which you move around, not ability to move categories or genres.
- Design Across Platforms
- We chose a portability layer – html5, css3, js
- But we don’t use progressive enhancement since we want the freedom to experience with different UX on different platforms. if we also add progressive enhancement, it gets too complicated.
- Design Principles – haven’t really changed in 1983
- Get Physical – making things feel real, direct, interact with them.
- Give them the illusion of physicality
- Granddaughter fell in love with the iPad – specifically something called spinart.
- Apple HIG: whenever possible, add an actual physical dimension to your interface.
- Original netflix player on roku: when you pause it, there is a filmstrip that you can flip through.
- the iBook has pages that turn.
- But on the Kindle, they have an anti-pattern – broken metaphor. They have “location”. It’s an implementation, but it’s not a user’s mental model.
- “Books have pages”
- We can break the metaphor with magic.
- “back to the original page”, “you are here” you can go anywhere. “pages left in the chapter”.
- Apple breaks this with iCal. They give you the illusion of pages — using depth and visual indicators, but then they break the metaphor by not having the ability to flick pages.
- The brain cannot see a change happening to an element that has not yet been stored.
- example: flipping between two similar photos, one has the airplane engine edited out. when the two frames have a flash between them, we can’t see it. when there is no flash, we all spot it immediately.
- “Plus” experience won. Reduces page transitions.
- Lots of UX examples of Twitter app on iPad vs Mac app vs. browser. Can’t capture them all.
- Questions
- Q: How do you determine the winner when you try different theories?
- We care most about retention. But people don’t quit the service immediately because a button style changed.
- The proxy for retention is consumption… do they watch movies? add them to their queue.