Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Firefox on TV


Published on

Proposed: Firefox on TV

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Firefox on TV

  1. 1. FIREFOX on TVFirefoxUX | ZhenshuoFang | 20130412
  2. 2. 1. Design Values2. Web vs. TV3. Design Concepts• Core UX• Hub UX• Social UXTABLEOFCONTENTS
  4. 4. FirefoxUX | 4Related Firefox Design ValuesPlays well with othersExuberantFinely craftedHigh user-performance
  5. 5. WEBVSTV2
  6. 6. FirefoxUX | 6• Vertical• Tab & link based• Text oriented• Mouse controlWeb• Horizontal• Screen & channel based• Visual oriented• Remote controlTVWEBVSTVThe Display
  7. 7. FirefoxUX | 7Web TVWEBVSTVThe Experience• Active• Lean forward experience• Passive• Lean back experience10 ft
  8. 8. FirefoxUX | 8WEBVSTVThe ContentWeb TV• Content generation• Mostly texts• Different types of contents(Photos, videos, tables, etc)• Content consumption• Mostly videos and photos• Less variation of content types
  9. 9. FirefoxUX | 9WEBVSTVThe TaskWeb TV• Continuous browsing(reading, writing, etc)• Typing• Lightweight browsing(quick search, SNS update, etc)• Less typing
  10. 10. FirefoxUX | 10WEBVSTVThe UserWeb TV• Mostly one user• Own multiple devices• User is more focused• More than one user• Multiple devices, some are shared• User is more distracted
  11. 11. FirefoxUX | 11WEBVSTVThe EmotionWeb TV• Individual• More serious• Social• More relaxed
  12. 12. FirefoxUX | 12WEBVSTVDesign Principles• Simplicity comes first• Visual appealing is key• Minimize typing• Keep in mind the 10ft environment• Respect user’s existing mental model• Social and fun experience
  14. 14. FirefoxUX | 14Core UX Hub UX Social UXConnect TV with the Internet TV as a hub of all devices Design a social TV experienceDESIGNCONCEPTSThree Themes
  15. 15. FirefoxUX | 15Core UXConnect TV with the InternetDESIGNCONCEPTSCore UX• TV optimized display• TV optimized navigation• Get my Firefox everywhere• Task oriented UI
  16. 16. FirefoxUX |• Maximize content area:Fullscreen by defaultGet rid of web noise (Ads, comments, etc)• Better readability:Bigger everything (fonts, padding, etc)Fluid transition (smooth scrolling, animation, sound feedback, etc)16DESIGNCONCEPTSTV Optimized DisplayFullscreen on TV by default Reader mode on TV
  17. 17. FirefoxUX |• Simple navigationEverything is 1 or 2 navigation awayShortcut for common command• Chromeless UIContextual/floating control UINo navigation bar, cursor or tabsVoice and gesture control• Pair a typing device17DESIGNCONCEPTSTV Optimized NavigationPair a typing deviceContextual control UI
  18. 18. FirefoxUX |• Sync relevant TV contentBookmarks, history, password, themes, etc• Awesome bar suggestions based on TV context• New Start page on TV18DESIGNCONCEPTSGet my Firefox everywherestart page on TV
  19. 19. FirefoxUX |• Sidebar for lightweight browsingQuick search something while watching a showSocial network sidebar• Private browsing mode• TV based search engines (wiki earch field, IMBD search field, etc)19DESIGNCONCEPTSTask Oriented UISearch sidebar
  20. 20. FirefoxUX | 20Hub UXTV as a hub of all devicesDESIGNCONCEPTSHub UX• Multiscreening• Better control with mobile
  21. 21. FirefoxUX |• Mirrored displaySend a page or link from phone to TV• Location based SyncDisconnect when leaving the room• Lightweight pairingShare locallyDisplay photo on TV without uploading it to web21DESIGNCONCEPTSMultiscreeningSend photo to TV
  22. 22. FirefoxUX |• Display content on TV, but control on mobile22DESIGNCONCEPTSBetter control with mobileControl TV using mobile
  23. 23. FirefoxUX | 23Social UXDesign a social TV experienceDESIGNCONCEPTSThree Themes• Sharing• Multiple users
  24. 24. FirefoxUX |• Parental control and notifications from TV to mobile• TV share to TVChat, web RTC, co-watching a show, etcCreate and share TV channel or playlist24DESIGNCONCEPTSSharingTV share to TV
  25. 25. FirefoxUX |• Karaoke browsing or co-browsing experienceCollaborate playlist for TVAdd to queue from multiple sources• Multi-devices paired with TV for gaming25DESIGNCONCEPTSDesign a social experienceMultiple devices for gamingShared queue for video playing