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

Firefox for Windows 8 Touch — the present and the future

E032a0ec2e16be0fde49754e089e7569?s=47 Yuan Wang
April 16, 2013

Firefox for Windows 8 Touch — the present and the future

This is a lightning talk I gave on Mozilla 2013 UX Summit. The talk focuses on the background of this Windows 8 project, and design rationale of Firefox for Windows 8 Touch

E032a0ec2e16be0fde49754e089e7569?s=128

Yuan Wang

April 16, 2013
Tweet

Transcript

  1. Firefox for Windows 8 the present and the future Yuan

    Wang, Firefox UX Team Mozilla UX London Summit, April 2013
  2. Before Windows 8 ships After Windows 8 ships http://lockshot.wordpress.com/2012/10/30/windows-eu-ballot-screen-technical-glitch/

  3. We have to find our own way to build as

    a 3rd party browser
  4. Windows 8 design language

  5. None
  6. Good luck making it flat!

  7. Embrace Windows 8 new touch gestures 1

  8. Top area for navigation Bottom area for commands Full-screen browsing

    buttons
  9. Top area for navigation Bottom area for commands Full-screen browsing

    buttons
  10. Use finger for what they are good at

  11. Use finger for what they are good at

  12. Use finger for what they are good at Keep interactions

    reversible
  13. Design for touch but remember the mouse 2

  14. An option to always show tabs

  15. An option to always show tabs

  16. Reevaluate what is essential and what you can take out

    3
  17. A simplified setting panel One level, flat hierarchy Page 1

    Page 2
  18. Selected Texts Selected Texts and Image Image Links Links Images

    Selected Text Links Copy Search Bing for “...” Copy Search Bing for “...” Select all Save to picture library Copy image Copy image location Open image in new tab Copy Search Bing for "..." Open link in new tab Copy link Bookmark link Save to picture library Copy image Copy image location Open link in new tab Copy link Open link in new tab Copy link Bookmark link Texts Images Links Mostly frequently used actions Least frequently used actions Legend Maximum 5 actions in every context menu Grouped by objects
  19.  Mozilla - Home of the Prioritize for the most

    common use case Design from constraints
  20.  Mozilla - Home of the Prioritize for the most

    common use case Design from constraints
  21. Top Sites Bookmarks Yuan Wang / Pinterest Hulu The Verge

    Co. Design The Designer Fund Home | SFJAZZ Klout | The standard of Influ... Sosh :: San Francisco Top Sites Bookmarks History Synced Tabs Top Sites Bookmarks Yuan Wang / Pinterest Hulu The Verge Co. Design The Designer Fund Home | SFJAZZ Klout | The standard of Influ... Sosh :: San Francisco We didn’t get right the first time
  22. Understand the guidelines, but don’t be afraid to break them

    4
  23. Reflect Firefox personality and branding 5

  24. Balances power and simplicity Takes care of you Makes sense

    of the web - Adapt lightweight Win8 style - Australis - Awesome search - “Share” charm - Do Not Track Finely crafted - High resolution
  25. Embrace Windows 8 new touch gestures Design for touch but

    remember the mouse Reevaluate what is essential and what you can take out Understand the style guide, but don’t be afraid to break them Reflect Firefox personality and branding 1 2 3 4 5
  26. Iterate + Collaborate

  27. Help us test Firefox for Windows 8! Thank you