Presentation is loading. Please wait.

Presentation is loading. Please wait.

Nokia Dominik Röck, Sonja Wihan.  This is a presentation about Nokia guidelines  Dominik Röck, k0rodo00  Sonja Wihan, k0wiso00.

Similar presentations


Presentation on theme: "Nokia Dominik Röck, Sonja Wihan.  This is a presentation about Nokia guidelines  Dominik Röck, k0rodo00  Sonja Wihan, k0wiso00."— Presentation transcript:

1 Nokia Dominik Röck, Sonja Wihan

2  This is a presentation about Nokia guidelines  Dominik Röck, k0rodo00  Sonja Wihan, k0wiso00

3  Describe the style guide  This document gives an overview of the Nokia Symbian^3 (S^3) user interface and describes its essential parts, giving examples of how to use the interface elements.  The document can be used as an introduction to the style or as reference material. It provides background material to help user interface designers make decisions about their products

4  Model of navigation is based on states  Arranged as hierarchical trees  New features, new flexibility: Tabs S^3 key and menu Direct navigation between sibling folders Links to applications and documents  Navigation using links  One-way shortcuts (no direct path back)

5  Navigating in applications  Traditional hierarchical tree structure  Moving forward from one state By opening an available item By selecting an option from a menu  Back returns to previous level  Exit function -> closing the application

6  Navigation using tabs  UI allows combining several pages to a single state  Switching by tapping in the Navipage by pressing the arrow key left / right

7  Hierarchical application structures  UI offers direct access to a sibling folder  Shortcut  Arrow left and right accomplish this

8  No exact font / color defined in the style guide (maybe because it’s theme related)  But:  It tells when you should use e.g. primary / secondary font  Primary font E.g. Used for informing of an empty list  Secondary font E.g. Used for providing further information  Single color E.g. Used for item status graphics

9  EXAMPLE:  Item property graphic –color  Heading –secondary font  Main text - primary font  Item status graphics - single color

10  List item types (examples) - Single-line item with a graphic - Single-line item with a large graphic - Two-line item with a number - Two-line item with a large graphic

11  The following toolbar button types can be used: - Command button offering direct action (functions/view access) like Send or New contact - Mode toggle button can be used for switching between several modes as in Flash - On/Off button can be used for active/inactive type of functions such as Loudspeaker or Font italics Toolbar button states: example of On/Off type of button

12  Notes (feedback components) - confirmation note - information note - error note - wait and progress notes - soft notification

13  The recommended grid layout is 3x4 (nHD portrait) and 6x2 (nHD landscape), 12 icons in all

14 When moving with the navigation keys in a list or a grid, one item in it is always in focus (highlighting)

15  Help application (containing information about the system, the functions it offers, and advice on getting the most out of it)  arranged in a hierarchical fashion so that they can be navigated in the usual way  can be obtained by selecting the Help item from the Options menu within applications  Wizards

16  The S^3 UI can rotate between the portrait and landscape layout.


Download ppt "Nokia Dominik Röck, Sonja Wihan.  This is a presentation about Nokia guidelines  Dominik Röck, k0rodo00  Sonja Wihan, k0wiso00."

Similar presentations


Ads by Google