O slideshow foi denunciado.
Utilizamos seu perfil e dados de atividades no LinkedIn para personalizar e exibir anúncios mais relevantes. Altere suas preferências de anúncios quando desejar.

FirefoxOS - Bulgaria Web Summit

557 visualizações

Publicada em

FirefoxOS - The Beginning! What we learned? FirefoxOS - Today! What is our work process? The Tools We Use?

Publicada em: Design

FirefoxOS - Bulgaria Web Summit

  1. 1. Pavel Ivanov UX/UI Engineer at Mozilla Bulgaria Web Summit, 31.05.2014 at Inter Expo Center (Sofia, Bulgaria)
  2. 2. What is Firefox OS?
  3. 3. How we started the project?
  4. 4. “The Web is the Platform”
  5. 5. The first Gaia Interface ...
  6. 6. Work Weeks
  7. 7. UX/UI (Day 1)
  8. 8. UX/UI (Day 2)
  9. 9. Start Coding (day 3)
  10. 10. First Devices (Day 4)
  11. 11. More Devices :) (Day 5)
  12. 12. The Results
  13. 13. WORK TOGETHER ALL THE TIME (24/7)
  14. 14. Firefox OS | V1 Design
  15. 15. V1 Design Principles consumption focus / magazine feel content is king ease of use emphasis on color and circle forms
  16. 16. Font Face Fira Sans commissioned for readability on mobile
  17. 17. Dark media / entertainment Content Focus Light productivity differentiate productivity vs media theatre experience (content vs experience)
  18. 18. Icon Shape Unique circle shape for app icons and action icons
  19. 19. Value Selector Ease of use Value Selector full screen dialogs & value selectors
  20. 20. Home screen LockscreenLockscreenHomescreen
  21. 21. Contacts CalendarMessagesContacts
  22. 22. Music VideoMusicMusic
  23. 23. Keypad On CallIncoming CallCall Log
  24. 24. The Problems with FFOS v1
  25. 25. Problem 1 Performance
  26. 26. Problem 2 Performance
  27. 27. Problem N Performance
  28. 28. The Solution Improve the Web Standards Improve the Platform Improve the Work Process
  29. 29. Where we are Today?
  30. 30. Where we are Today?
  31. 31. Firefox OS | V2 Refresh
  32. 32. Design by Code Spacious Content Focus Emotion Through Motion Design Principles for v2
  33. 33. Design by Code
  34. 34. Design by Code flat, elegant design style less dependency on bitmaps easily scales across a larger portfolio of devices SVG iconography V2 RefreshV1
  35. 35. Home Screen MusicContactsHome Screen
  36. 36. Keypad On CallIncoming CallCall Log
  37. 37. V2 RefreshV1 Spacious larger controls
  38. 38. The Work Process v2
  39. 39. The Tools design, wire frames, code, build, automations, tests etc.
  40. 40. Questions?
  41. 41. Thank You :) I Support the Open Web <3

×