increase your nokia store success with user centric design of series 40 apps

Increase Your Nokia Store Success with User-centric Design of Series 40 Apps

2 © Nokia 2012 Increase_Your_Nokia_Store_Success_with_User-centric_Design_of_Series_40_Apps.pptx v.01 2012-08-22 Jan Krebber

Before we start: learn to step back and observe the whole thing.

Overview

Overview• Why do I need a good UX? • Idea generation• From ideas to goals• From goals to flows• From flows to views• From views to tested views • Take home messages• Exercises

Why do I need a good UX?

A good UI will increase your reputation.

A good UI will allow you to make money out of your work.

An easy-to-work-with UI is necessary to create a helpful app.

Start with usability and it will save you time – easily a 100 times.

Effort to change a usabillity problem

Project time

With good UX, your architecture is more stable and your code is cleaner.

Your rating must be 4 or more stars – otherwise it is just a proof of concept.

Idea generation

An idea is often a combination of world knowledge and special knowledge.

Prepare your idea for an elevator pitch.

From ideas to goals

Which primary goal do people have when utilizing your idea?

What is needed to reach the goal?

Hands on: MyKahvi

Hands on: Write down all the goals – with somebody else.

Hands on: Write down all the goals – with somebody else.Goals written by Mark Goals written by Georg Goals written by Jingna

Obey the mobile mindset.

- Bored- Microtasking- Local

Josh Clark

Identify users and context of use?

Set the business drivers.

Prioritize the goals – with somebody else.

Hands on: Introduce and group goals.

Hands on: Vote for groups (vote per person = groups/2).

Hands on: Prioritize by votes.

From goals to flows

Base your designs on flows.

Panta rhei.

Heraclitus

Hands on: Create a flow-end based on a goal.

Hands on: Start point can be the splash screen.

Hands on: Fill the necessary steps in between.

Hands on: Create flows for all goals.

From flows to views

Hands on: Sort the flows.

Hands on: Group flow steps to views.

Hands on: Find a navigation structure.

Drill down- Non-touch- Touch & Type

Categories (tabs)- Full touch

Hands on: Prioritize functions and information.

Hands on: Compose your view.

From views to tested views

Test early – test often.Fail fast – fail cheap.

Improve your app.

Take home messages

Do not design all alone.

Base your designs on flows.

Panta rhei.

Heraclitus

Last advice: Test earlier. Test more often.

Series 40 Full Touch UI Design

Library: http://www.developer.nokia.com/Resources/Library/Full_Touch/

Checklist: http://www.developer.nokia.com/Resources/Library/Full_Touch/#!ux-checklist.html

Icon Creation: http://www.developer.nokia.com/Resources/Library/Full_Touch/#!icon-creation.html

UI Components: http://www.developer.nokia.com/Resources/Library/Full_Touch/#!ui-components.html

UI Components Demos App: https://projects.developer.nokia.com/s40uivisualisation

Basics: http://www.developer.nokia.com/Resources/Library/Design_and_UX/

Asha Touch Competition 2012Q3:http://www.developer.nokia.com/Community/Wiki/Asha_Touch_Competition_2012Q3

Wiki article to this webinar: http://www.developer.nokia.com/Community/Wiki/index.php?title=Webinar_Series_40_UI_Concept_Design

Exercises

Exercise: When do you choose a tumbler instead of a list?Do not restrict this problem to Series 40 Full Touch LCDUI or Nokia UI.

Exercise: What are the differences between radio buttons and check boxes? When to use them?

Panta rhei.

Heraclitus

Exercise: Check ”panta rhei” from www.wikipedia.org and other sources.

Exercise: Compose a view.

- Business driver is to sell e-tickets for a soccer game within an entire soccer league

- In the previous view, the user has chosen this certain game. For this game she wants to buy tickets

- Only Series 40 full touch- No category bar, standard header bar and Back button - View items [amount of votes, max 8]

- Buy tickets (link) [6]- More information about the stadium (info) [1]- Show how many tickets have been bought for this game by this user (info) [8]- Display the e-tickets (link) [6]- Show start time (info) [7]- More information about the soccer teams (link) [1]- Show stadium name (info) [5]- Show who is playing (info) [8]- Navigate me to the stadium (link) [4]- Show stadium address (info) [2]- Show images of the stadium (link) [3]- Show emblems of soccer clubs (info) [8]

Thanks to: - Tuulikki Lepola- Anne Kivimaa- Sanna Hiukka

Thanks

ext-jan.krebber@nokia.com

increase your nokia store success with user centric design of series 40 apps

apps1 nokia

jingna20 nokia

nokia storesuccess

goals14 nokia

mykahvi17 nokia

flows28 nokia

idea generation11 nokia

local josh clark21 nokia

Technology

architecture-centric software...

siebel customer-centric enterprise warehouse installation...

deep dive into nokia asha ui design: designing apps

seamless smartphone control from jvc...

presentasi moodus for nokia lumia apps olympiad

a formula for creating patient-centric mobile health apps

barcamp uzbekistan may2011: nokia apps

desenvolvimento de games & apps para nokia series 40 parte...

contextual multimodal interfaces and device-centric ... hci...

create user-centric, custom mobile apps with the sap...

content-centric apps for mobile devices by john fait

how to develop cool apps for nokia asha smartphones

porting j2me apps to nokia x using j2me android bridge

promote your apps with nokia marketing in a box

lumia app labs: optimising your nokia lumia apps for...

effectively using nokia web tools 2.0 templates for series...

an empirical analysis of mobile apps’ popularity … ·...

desenvolvimento de games & apps para nokia series 40 parte...

developing apps on maemo with nokia web runtime

making a city smarter by enriching local people-centric apps...