Soini - Designing Ui For Maemo 5

  • 5,217 views
Uploaded on

Maemo Summit 2009 Presentation …

Maemo Summit 2009 Presentation

"Designing UI for the Maemo 5"
by Mox Soini

Abstract:
How to make the applications work together as an integrated whole?

This talk will discuss the UI Design of the Maemo 5 product as an "application portfolio". Design patterns as well as application specific designs are presented, and the reasoning for the design decisions.

Design of the pre-installed applications in the Maemo 5 product is discussed, highlighting the UI flows, common user experience solutions and power user features. Throughout the application walk-through, the structure and "look and feel" of the applications is categorized, resulting in a conceptual design tool for 3rd party application designers and developers.

More in: Design
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
5,217
On Slideshare
0
From Embeds
0
Number of Embeds
3

Actions

Shares
Downloads
0
Comments
0
Likes
15

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Designing UI for Maemo 5 Mox Soini
  • 2. Design Process
  • 3. Goal What ideas are kept, What ideas are dropped
  • 4. Cannot extrapolate, it’s like hand-drawn curve
  • 5. Changes happen at varying speed
  • 6. Final result is often Unexpected
  • 7. Maemo 5
  • 8. Easily understandable with Soul Simple – not too neutral Positive surprises Clean Delights
  • 9. Reduced set of UI elements • The key in defining finger usability • The key in attaining UI consistency • Accelerate the design and development time (reduced complexity) • Avoiding customization where possible
  • 10. Compared to past • The UNIX philosophy – “do one thing and do it well". • Finger usage – Larger size of UI elements • Removal of focus • Avoid dimming • Only few menu items UP ED h N it EA w at! • No tabs in dialogs ’S CL ow ss f IT – N % le 50
  • 11. UI Flow
  • 12. Navigation Structure – Line
  • 13. Accounts Folders Messages Viewer Email
  • 14. Navigation Structure – Summary
  • 15. Music Video Summary Internet Radio Media Player
  • 16. Navigation Structure – T-Bone
  • 17. Month Week Event Agenda Calendar
  • 18. UI priorities Main views Viewing content Navigation via content View menus Manipulating content Edit dialogs Edit Mode Views Power use / shortcuts for content Multiple selection Context Sensitive Menus
  • 19. Viewing content Manipulating content Power use / shortcuts for content
  • 20. There’s NO app for that It’s a plugin!
  • 21. VOIP services IM services Sharing services Plugins Media filters Media formats OpenMax
  • 22. Contact list Profile Alarms Bluetooth 3G / Wlan networking Integration Metadata Location Music / Video File Choosers playing Camera
  • 23. Keep in mind • Simplicity • Focus on key use cases • Fluent and seamless • Not cramming all in the same place • Each view has it’s own purpose
  • 24. Thanks! Designing UI for Maemo 5 – Mox Soini Hildon 2.2 UI Style Guide Hildon 2.2 Widget UI Specification Fremantle Master Layout Guide http://bit.ly/13P9Ou http://bit.ly/3o8ttP http://bit.ly/MhCb4