The UX of TV
Upcoming SlideShare
Loading in...5
×
 

The UX of TV

on

  • 43,167 views

Razorfish designers Kyle Outlaw & Ed Mansfield present the challenges and opportunities for user experience professionals in what is known as the "connected TV" space. ...

Razorfish designers Kyle Outlaw & Ed Mansfield present the challenges and opportunities for user experience professionals in what is known as the "connected TV" space.

First, they will aim to establish connected TV as a disruptive technology that is just in its beginning stages. They'll describe what connected TV is (and isn’t) and then get into some statistics on device, apps and online video usage in order to demonstrate – after many years of hype – that web-TV convergence is finally happening. They'll discuss the big players in this area such as Xbox, Google, Roku, Samsung, and the features they support in addition to some visions of what Apple might do in this space. And they'll summarize key trends to watch including new interfaces, social television and second screen viewing, among others.

Kyle & Ed will also discuss how UX professionals can prepare for this new frontier through cross-disciplinary knowledge sharing, investing in technology and partnerships, and most importantly by designing proof-of-concept prototypes. They'll conclude by talking about some key design considerations for connected TV, such as designing for the 10-foot experience, second screen and smartphone interaction, responsive design, apps versus TV-optimized websites, optimizing content for branded channels and more.

This talk is appropriate for anyone interested in learning about recent developments in the connected TV space, and wants to understand both the challenges and opportunities for user experience professionals.

Statistics

Views

Total Views
43,167
Views on SlideShare
39,570
Embed Views
3,597

Actions

Likes
144
Downloads
815
Comments
5

34 Embeds 3,597

http://arquiteturadeinformacao.com 2772
http://ustuff.tumblr.com 231
http://www.scoop.it 207
http://janks.tumblr.com 89
https://koutlaw.squarespace.com 45
https://twitter.com 26
http://simplyproject.wordpress.com 25
http://pinterest.com 21
http://www.etceter.com 19
http://knowledge.ridivi.com 18
http://www.adrockers.com.br 18
http://www.pinterest.com 18
http://www.emvbase.com 17
http://localhost 14
http://koutlaw.squarespace.com 12
https://www.rebelmouse.com 10
http://www.linkedin.com 9
http://www.ridivi.com 8
https://www.linkedin.com 5
http://demos.ridivi.com 4
http://digital-anthropologist.com 4
https://si0.twimg.com 4
http://www.entreprise-marketing.fr 4
http://fr.slideshare.net 3
https://twimg0-a.akamaihd.net 2
http://www.newsblur.com 2
http://127.0.0.1 2
http://www.creiden.com 2
http://yok.to 1
http://www.tumblr.com 1
http://www.doyoubuzz.com 1
http://alunosdocolegiouv10.blogspot.com 1
http://alunosdocolegiouv10.blogspot.com.br 1
http://www.blog.hashtagmachine.fr 1
More...

Accessibility

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
  • A regular television style remote is by far not the best user experience for TV today. See http://www.cnet.com/news/samsung-smart-remote-hands-on-with-the-best-tv-clicker-yet
    Are you sure you want to
    Your message goes here
    Processing…
  • @BrunoFlaven Thank you very much for the kind words Bruno! I enjoyed reading your article as well.
    Are you sure you want to
    Your message goes here
    Processing…
  • I believe in Social/Connected TV! Everybody watching what they want, when they want, sharing channels, movies, shows, live events... all this in real time with gestures or using their smartphones or tablets as second screens... it's already happening, and that's the way!
    Are you sure you want to
    Your message goes here
    Processing…
  • I found your presentation on connected TV very inspiring. I have written in French an article on your LeanUX approach and made 3 different libraries (OmniGraffle, Balsamiq and Axure) available for download to help people to wireframe application foe Google TV based on what you have explained. It has been a true call to action, thanks to both of you. http://bit.ly/WDjMkf
    Are you sure you want to
    Your message goes here
    Processing…
  • Great work, guys. This is really important stuff!
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

The UX of TV The UX of TV Presentation Transcript

  • THE UX OF TVA NEW FRONTIER FORUSABILITY PROFESSIONALSNYC UXPA AUGUST 21, 2012 © 2012 Razorfish. All rights reserved
  • Who we areKyle Outlaw Ed MansfieldXD at Razorfish Sr. IA at RazorfishPast: R/GA, WorldNow, Modem Media Past: ChaseSpecialties: mobile, tablet, social, online video Specialties: mobile, tablet, financial services,Clients: AXE, Citibank, Ralph Lauren, Victoria automotiveSecret, Kraft, Morgan Stanley Clients: Ford, XM Radio, Merrill Lynch,Twitter: @koutlaw Morgan Stanley, JP Morgan Twitter: @elmansfield © 2012 Razorfish. All rights reserved 1
  • Let’s face it. Despite ourlove for TV, the experience is broken. © 2012 Razorfish. All rights reserved 2
  • For Example:• Too many remotes• 1000 channels and nothing on• Clunky channel guides• Lack of device compatibility• Constant interruptions• And the list goes on… Image Source: Gizmodo © 2012 Razorfish. All rights reserved 3
  • OUR MOBILE DEVICES NOT TOO LONG AGO… Image Source: Wikipedia © 2012 Razorfish. All rights reserved 4
  • WHAT A DIFFERENCE A FEW YEARS MAKES © 2012 Razorfish. All rights reserved 5
  • “Well, you just end up with a table full of remotes, acluster full of boxes, a bunch of different UIs -- and thatsthe situation we have today. The only way thats evergonna change is if you can really go back to squareone and tear up the set-top box and redesign it fromscratch with a consistent UI across all these differentfunctions and get it to the consumer in a way thattheyre willing to pay for it.”–Steve Jobs, Patron Saint of User Experience PractitionersSource: AOL: © 2012 Razorfish. All rights reserved 6
  • Our TVs are much too complicated.It doesn’t have to be that way. © 2012 Razorfish. All rights reserved 7
  • Who will change it?We will. TV is the next big problemfor UX to solve. © 2012 Razorfish. All rights reserved 8
  • But How?By knowing what’s going on … and getting the skillsin the connected TV to do it.landscape…This is what we want to talk about today. © 2012 Razorfish. All rights reserved 9
  • IN THIS PRESENTATION WE’LL COVER 1. THE RISE OF CONNECTED TV Definition, Stats/Trends 2. THE WAR FOR YOUR LIVING ROOM Key Players, An Elephant in the Living Room 3. IMPLICATIONS FOR UX Challenges and Opportunities 4. LET’S DO THIS Prototyping and Evangelization 5. KEY TAKEAWAYS Recap and Reference Materials © 2012 Razorfish. All rights reserved 10
  • 1. THE RISE OF CONNECTED TELEVISION © 2012 Razorfish. All rights reserved
  • What is Connected TV?It’s a term used to describe the integration of theinternet and web features into TV sets andset-top boxes, as well as the convergence betweencomputers and these television sets or set-top boxes.Source: Wikipedia © 2012 Razorfish. All rights reserved 12
  • Also known as:• Smart TV• Cloud TV• Hybrid TV © 2012 Razorfish. All rights reserved 13
  • But why should we care? © 2012 Razorfish. All rights reserved 14
  • Connected TV is already here.It’s just not very evenly distributed.Source: William Gibson – “the future is already here it is just unevenlydistributed.” © 2012 Razorfish. All rights reserved 15
  • Millions already have this capability in their homes.227 million have access through game consoles. 96.56 million 67.2 million 63.9 million Source: Nintendo (June 2012); Microsoft (April 2012); Sony (March 2012) © 2012 Razorfish. All rights reserved 16
  • 90% 80%Connected TV sales are 70%growing with 91 million units 60%projected for 2012. 50% 40% 30% 20% 10% 0% 2012 2014 2016Source: Global Flat-panel TV and Connected TV Forecast - Kantideep Thota
Source: Global Smart TV Market (2011 – 2016) CriticalCapability, Use Case Analysis & Forecast By Accessories, Platforms, Middleware, Application & Geography - MarketsAndMarkets.com © 2012 Razorfish. All rights reserved 17
  • Consumer activities while watching TVSecond screen viewing isthe new normal. 80% of USadults mobile multi-taskwhile watching TV. Source: Yahoo! and Razorfish survey
Source: Ericsson presents TV & Video Consumer Trend Report 2011 - Ericsson © 2012 Razorfish. All rights reserved 18
  • Cord-cutting is on the rise. Cable isnot. 2.65 million Americans cut thecord in 2008-2011.Source: HBO Here are those cord-cutting stats you asked for – Rebecca Greenfield © 2012 Razorfish. All rights reserved 19
  • Our appetite for live on-demand streaming content isbreaking records. June 2010 April 2011 August 2012 1.6 million viewers 2.4 million viewers 3.2 million viewers Source: Viewers opted for the Web over TV to watch Curiositys landing – CBS News © 2012 Razorfish. All rights reserved 20
  • 40% of Americans live-streamed.Live-stream viewers were also2x more likely to watchprimetime coverage on TV.Source: Apple and the iPhone TV: one day all televisions will be this way – Computerworld
Source: Olympics PlatformsScore – Variety © 2012 Razorfish. All rights reserved 21
  • This has all caught the attention ofsome big players… © 2012 Razorfish. All rights reserved 22
  • 2. THE WAR FOR YOUR LIVING ROOM © 2012 Razorfish. All rights reserved
  • The Next Technology War“As the Consumer Electronics Show continued in LasVegas, at least one theme became clear: The nextbig technology war is for your living room.”- Hayley Tsukayama, Washington Post © 2012 Razorfish. All rights reserved 24
  • MEET SOME OF THE CONTENDERS © 2012 Razorfish. All rights reserved 25
  • THE TV SET MANUFACTURERS © 2012 Razorfish. All rights reserved 26
  • THE GAME CONSOLE MAKERS © 2012 Razorfish. All rights reserved 27
  • THE SET TOP BOX MANUFACTURERS © 2012 Razorfish. All rights reserved 28
  • THE CONTENT PROVIDERS © 2012 Razorfish. All rights reserved 29
  • THE CABLE AND SATELLITE PROVIDERS © 2012 Razorfish. All rights reserved 30
  • There is an elephant in the living room.Where’s Apple in all of this? © 2012 Razorfish. All rights reserved 31
  • “I finally cracked it.”Source: Steve Jobs – Walter Isaacson © 2012 Razorfish. All rights reserved 32
  • THE MYTHICAL ITV Image Source: ADR Studio © 2012 Razorfish. All rights reserved 33
  • Or maybe just an iBox?Source: Apple in talks to use Apple TV as cable box, report says - Hayley TsukayamaImage Source: ADR Studio © 2012 Razorfish. All rights reserved 34
  • Above all the hope is that Apple will bring some muchneeded standardization…For now we have a very fragmented television ecosystem to contendwith. © 2012 Razorfish. All rights reserved 35
  • 3. IMPLICATIONS FOR UX © 2012 Razorfish. All rights reserved
  • What does all this mean forusability professionals? Tobegin with we’ll need tocontend with the 10 footexperience. Image Source: Wikipedia © 2012 Razorfish. All rights reserved 37
  • What is the 10 ft experience?It’s a software user interface designed for display on alarge television with interaction using a regular television-style remote control.Source: Wikipedia © 2012 Razorfish. All rights reserved 38
  • While there are similarities with mobile, and tabletdesign, the 10 foot experience is an altogetherdifferent beast. Let’s talk about the challengesand opportunities. © 2012 Razorfish. All rights reserved 39
  • First, the challenges… © 2012 Razorfish. All rights reserved 40
  • 1. CONSIDER THE USER’S ENVIRONMENTImage Source: MorgueFile © 2012 Razorfish. All rights reserved 41
  • 2. UNDERSTAND THE PHYSICAL CONSTRAINTSImage Source: Wikipedia © 2012 Razorfish. All rights reserved 42
  • 3. KNOW THE DISPLAY RULESImage Source: Wikipedia © 2012 Razorfish. All rights reserved 43
  • 4. EVALUATE THE CONTENTImage Source: Wikipedia © 2012 Razorfish. All rights reserved 44
  • 5. IDENTIFY THE INTERACTION METHODSImage Source: Wikipedia © 2012 Razorfish. All rights reserved 45
  • Now let’s talk about the opportunitiesand advanced capabilities. © 2012 Razorfish. All rights reserved 46
  • 1. NEW INTERFACES © 2012 Razorfish. All rights reserved 47
  • 2. SOCIAL TV AND COMMUNITY VIEWING © 2012 Razorfish. All rights reserved 48
  • 3. SUPER-NICHE AND ORIGINAL PROGRAMMING © 2012 Razorfish. All rights reserved 49
  • 4. APPS AND GAMES © 2012 Razorfish. All rights reserved 50
  • 5. RECOGNITION AND PERSONALIZATIONSource: Razorfish Emerging Experiences © 2012 Razorfish. All rights reserved 51
  • 4. LET’S DO THIS © 2012 Razorfish. All rights reserved
  • For most of us, connected TVremains unchartered territory.How do we get started? © 2012 Razorfish. All rights reserved 53
  • A Call to Action for UX• Evangelize it• Share knowledge across disciplines• Demo key services and devices with partners• Upgrade our TVs sets or set top boxes © 2012 Razorfish. All rights reserved 54
  • Last but not least, the best way is tolearn by doing.We can create prototypes. © 2012 Razorfish. All rights reserved 55
  • Advantages to prototyping• Give project visibility and buy-in within customer and developer organizations• Encourage early participation and involvement• See the design in its intended context• Provide immediate observation of user performance and consequences of design decisions Source: UX For the Masses - Neil Turner Source: Advantages of and cautions about using prototype - Rex Hartson; Pardha S. Pyla © 2012 Razorfish. All rights reserved 56
  • Inspired by Lean UX• Concept• Prototype• Validate internally• Test internally• Learn from user behavior• IterateSource: Lean UX: Getting out of the Deliverables Business - Jeff Gothelf © 2012 Razorfish. All rights reserved 57
  • Key ingredients• Sketch pad and pen or pencil• Wire framing software• Photoshop• HTML editor• FTP client• Browser-enabled set top box• Wide-screen TV monitor• Video content © 2012 Razorfish. All rights reserved 58
  • HypothesisWe believe that employees will use a TV-optimizedweb site view, share, comment on and help curateagency case studies, interviews, and demos. © 2012 Razorfish. All rights reserved 59
  • 1. SKETCHING © 2012 Razorfish. All rights reserved 60
  • 2. WIREFRAMES © 2012 Razorfish. All rights reserved 61
  • 2. PHOTOSHOP AND EXPORT IMAGES © 2012 Razorfish. All rights reserved 62
  • 3. ADJUST THE CODE FOR TV DISPLAY © 2012 Razorfish. All rights reserved 63
  • 4. UPLOAD IT © 2012 Razorfish. All rights reserved 64
  • 5. TEST IT ON PC © 2012 Razorfish. All rights reserved 65
  • 5. TESTING ON CONNECTED TVS © 2012 Razorfish. All rights reserved 66
  • 5. TESTING ON CONNECTED TVS © 2012 Razorfish. All rights reserved 67
  • 5. TESTING ON CONNECTED TVS © 2012 Razorfish. All rights reserved 68
  • KEY SCREENS © 2012 Razorfish. All rights reserved 69
  • KEY SCREENS © 2012 Razorfish. All rights reserved 70
  • Some things we are learning:• Keyboards and TVs don’t mix well• Hierarchy needs to be as flat as possible• Everything needs to be 3X larger• With text display less is more• Browser behavior varies widely across devices © 2012 Razorfish. All rights reserved 71
  • 5. SUMMARY © 2012 Razorfish. All rights reserved
  • Key Takeaways• TV is the next big problem for UX to solve• Connected TV is here already but it remains a fragmented ecosystem in need of standardization• Know the challenges with designing for TV• Understand the opportunities and new capabilities• Evangelize internally and with clients• Embrace the prototype © 2012 Razorfish. All rights reserved 73
  • We are in the very early days of thereinvention of television.We need to insert ourselves intothe process at the very beginning. © 2012 Razorfish. All rights reserved 74
  • In closing…“When you’re young, you look at television andthink, There’s a conspiracy. The networks haveconspired to dumb us down. But when you get a littleolder, you realize that’s not true. The networks are inbusiness to give people exactly what they want.That’s a far more depressing thought. Conspiracy isoptimistic…We can have a revolution!”–Steve Jobs © 2012 Razorfish. All rights reserved 75
  • THANK YOU! © 2012 Razorfish. All rights reserved
  • APPENDIXUser Experience and design for connected TVRe-thinking User Interface Design, Jim Mischelhttp://blog.smartbear.com/software-quality/bid/167284/Re-Thinking-User-Interface-Design-for-the-TVPlatformSamsung User Experience Guidelines, Samsung Developers Forumhttp://www.samsungdforum.com/Guide/View/Developer_Documentation/User_Experience_Guideline_1.5Google TV design patterns, Google Developers, Google Developershttps://developers.google.com/tv/android/docs/gtv_android_patternsOpera design guidelines for Wii, Dev.Operahttp://dev.opera.com/articles/view/creating-web-content-for-tv/Make your website TV friendly with our 10 great tips, Sam Nurmihttp://royal.pingdom.com/2012/03/14/make-your-website-tv-friendly-with-our-10-great-tips/Make your website TV friendly with our 10 great tips, Sam Nurmihttp://royal.pingdom.com/2012/03/14/make-your-website-tv-friendly-with-our-10-great-tips/ © 2012 Razorfish. All rights reserved 77
  • APPENDIXUX and TVThe Shift From Watching TV to Experiencing TV, Richard MacManushttp://www.readwriteweb.com/archives/the_shift_from_watching_tv_to_experiencing_tv.phpDesigning for Context: The Multiscreen Ecosystem, Avi Itzkovitchhttp://uxmag.com/articles/designing-for-context-the-multiscreen-ecosystemPrototypingLean UX: Getting Out of the Deliverables Business, Jeff Gothelfhttp://uxdesign.smashingmagazine.com/2011/03/07/lean-ux-getting-out-of-the-deliverables-business/ © 2012 Razorfish. All rights reserved 78
  • APPENDIXApple TVApple in talks to use Apple TV as cable box, report says, Hayley Tsukayamahttp://www.washingtonpost.com/business/technology/apple-in-talks-to-use-apple-tv-as-cable-box-reportsays/2012/08/16/f5ad15d6-e796-11e1-8487-64e4b2a79ba8_story.htmlHere Are Apples Plans To Make TV A Thousand Times Better, Jay Yarowhttp://www.businessinsider.com/heres-how-apple-is-telling-cable-companies-it-will-make-apple-tv-work-2012-8Apple, Microsoft, Google and the sad state of TV, Janko Roettgershttp://gigaom.com/video/apple-tv-set-top-box/Apple “iBox”: The Classic Concept and Renderings of Apple iTV, Farhathttp://hitechanalogy.com/apple-ibox-classic-concept-renderings-apple-itv-artist-2/Apples New Front in the Battle for TV, Jessiva E. Vascellaro and Shalini Ramachandranhttp://online.wsj.com/articleSB10000872396390444233104577591713616924328.html © 2012 Razorfish. All rights reserved 79
  • APPENDIXApple TVMore Apple TV Hints, Directly From Steve Jobs, Evan Niuhttp://m.aol.com/dailyfinance/default/articleStory.do?category=main&url=http://www.dailyfinance.com/2012/06/15/more-apple-tv-hints-directly-from-steve-jobs/&icid=dsk_df_newsOne on One: Walter Isaacson, Biographer of Steve Jobs, Nick Biltonhttp://bits.blogs.nytimes.com/2011/11/18/one-on-one-walter-isaacson-biographer-of-steve-jobs/ © 2012 Razorfish. All rights reserved 80
  • MORE REFERENCEBodymetrics and KinectHow Bodymetrics and Razorfish are out to Change Retail, Shareen Pathakhttp://creativity-online.com/news/how-bodymetrics-and-razorfish-are-out-to-change-retail/233471Cord cuttingHBO, Here Are Those Cord-Cutting Stats You Asked For, Rebecca Greenfieldhttp://www.theatlanticwire.com/technology/2012/08/hbo-here-are-those-cord-cutting-stats-you-asked/55292/ © 2012 Razorfish. All rights reserved 81
  • APPENDIXConnected TV BlogsLost Remotehttp://lostremote.comTechcrunchhttp://techcrunch.comMashablehttp://www.mashable.comGigaOmhttp://gigaom.comVenturebeathttp://venturebeat.com © 2012 Razorfish. All rights reserved 82
  • APPENDIXLinkedin GroupsConnected TVhttp://www.linkedin.com/groups?gid=2553526&trk=group-nameEmerging TVhttp://www.linkedin.com/groups/Emerging-TV-4543560?gid=4543560&trk=group-nameUX TVhttp://www.linkedin.com/groups/UX-TV-3773977?gid=3773977&trk=group-nameSmart UXhttp://www.linkedin.com/search-fe/group_search?pplSearchOrigin=GLHD&keywords=Smart+tvSocial TVhttp://www.linkedin.com/groups/Social-TV-next-generation-media-2188349?gid=2188349&trk=groupname © 2012 Razorfish. All rights reserved 83
  • APPENDIXImage CreditsSlide 2: Scrap Television Graveyard – thesuccesshttp://www.morguefile.com/archive/display/738604Slide 3: How Grandma Sees the Remote – Roz Chasthttp://gizmodo.com/357331/how-grandma-sees-the-remoteSlide 4: Mobile Phone Evolution – Anders K. Larsenhttp://upload.wikimedia.org/wikipedia/commons/d/d6/Mobile_phone_evolution.jpgSlides 32, 33: iTV concept designs – ADR StudioADR Studio, http://www.Adr-studio.it/Slide 36: Screenshot of XBMC Media Center home screen using default PM3.HDskinhttp://en.wikipedia.org/wiki/File:Screenshot000.pngSlide 40: Modern HDTV Stand – bredahttp://www.morguefile.com/archive/display/641764 © 2012 Razorfish. All rights reserved 84
  • APPENDIXImage CreditsSlide 40: Modern HDTV Stand – bredahttp://www.morguefile.com/archive/display/641764Slide 42: SMPTE Color Bars – Denelson83http://en.wikipedia.org/wiki/File:SMPTE_Color_Bars.svgSlide 44: PlayStation 3 BD Remote (with and without PlayTV overlay) –Alphathonhttp://en.wikipedia.org/wiki/File:PS3_BD_Remote.png © 2012 Razorfish. All rights reserved 85
  • APPENDIXSpecial ThanksSpecial thanks to Tiffany Milano @TiffanyMilano for her research assistance. © 2012 Razorfish. All rights reserved 86