Nokia Asha UX clinic September 2013
Jan Krebber @krebbixux
Senior User Experience Consultant
Overview
2 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
• QuickStocks
• Space S...
QuickStocks
Structure.
4 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
Truncated name makes the app look
unprofessional before it is even started.
5 © Nokia 2013 Nokia Asha UX clinic September ...
Use a square launcher icon for WebApps.
6 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @kr...
Do not rely on red and green color coding.
7 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber ...
Ensure a good contrast also for non-
selected items.
8 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Ja...
Clean sweep 1: Move version number to the
bottom, Search into top bar.
9 © Nokia 2013 Nokia Asha UX clinic September 2013....
Clean sweep 2: Move buttons to a different
list.
10 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan K...
First and last item should not have “move
up” and “move down”.
11 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 20...
Clean sweep 3: Access history setting by
tapping the graphics.
12 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 20...
Instead of pop-up lists, use lists in a new
view to avoid scrolling.
13 © Nokia 2013 Nokia Asha UX clinic September 2013.p...
Give Search its own view and add a “back
path”.
14 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Kr...
Reminder: Map the hardware Back key to
in-view Back commands in WebApps.
15 © Nokia 2013 Nokia Asha UX clinic September 20...
Ads are well placed.
16 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
Even not a standard – expand/collapse
works very well.
17 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09...
Proposed
structure.
18 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
Current str...
Move power functions to a secondary level.
19 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber...
Space Survivor 2
Structure.
21 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
Be careful with abbreviations.
Not everybody knows “BGM”.
22 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18...
Do not start the app with game sound on.
23 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @...
Some items are too small for touch.
24 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebb...
It’s hard to read text against a moving
background.
25 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Ja...
Do not use all caps.
It is hard to read and you are shouting.
26 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 201...
HW back key should be the only way to
pause a game and to go back.
27 © Nokia 2013 Nokia Asha UX clinic September 2013.ppt...
The Exit query could be removed.
28 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
Buying and taking advantage of new ships
and weapons is not clear to people.
29 © Nokia 2013 Nokia Asha UX clinic Septembe...
Ship navigation is difficult and sluggish.
30 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber...
To make it more zippy do not paint after
each input, but aggregate input.
31 © Nokia 2013 Nokia Asha UX clinic September 2...
The game is easily closed by accident.
32 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @kr...
Make game control simple and robust.
33 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @kreb...
Help people to understand
your game or app.
34 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebbe...
General questions
How many values should I set in a picker?
One due to limited screen real estate.
36 © Nokia 2013 Nokia Asha UX clinic Sept...
UX offering
There are LCDUI and LWUIT UI style guides.
38 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber...
There are UI stencils for Inkscape in
addition to Adobe Illustrator.
39 © Nokia 2013 Nokia Asha UX clinic September 2013.p...
Asha UI component demo application is a
Java midlet suite for LCDUI.
40 © Nokia 2013 Nokia Asha UX clinic September 2013.p...
Literature and links
41 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
• UX Libra...
Take home messages
Move power functions to a secondary level.
43 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber...
Make game control simple and robust.
44 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @kreb...
Help people to understand
your game or app.
45 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebbe...
Special thanks to Ian and Joseph 
phantasia_shin@yahoo.com
ian.wong@miniansoftware.com
Thanks to Sanna Hiukka
Stratos Kalogirou and Attila Csipa.
Thanks .
Jan Krebber
ext-jan.krebber@nokia.com
@krebbixux
Upcoming SlideShare
Loading in …5
×

Nokia Asha UI Clinic September 2013

945 views
858 views

Published on

Do you want to increase the user ratings and reputation of one of your Series 40 apps and, in turn, increase your downloads or sales? This webinar will present helpful design tips based on real Series 40 applications. UX expert Jan Krebber of OCT03 will identify issues with the design of user interfaces and other real-world aspects of the user experience. Then he’ll propose specific ways to resolve them. To submit the UI of a Series 40 app for evaluation and use in future UI clinics, please send the app to webinar.experts@nokia.com. If your submission is selected, the evaluation will be free of charge, and Jan will discuss the results with you privately before we examine them in the webinar. (Professional reviews such as this typically cost around 1,000 euros.) This is a great opportunity to get ideas for improving your application. We have limited resources available for these free reviews, so we’ll accept requests on a first-come, first-served basis.

Published in: Technology, Business
1 Comment
0 Likes
Statistics
Notes
  • Excellent presentation and observations by Jan Krebber. In the September 19 webinar, he showed the apps live. Both app developers were present and answering questions along with Ilkka Salento, a web app expert from Nokia.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Be the first to like this

No Downloads
Views
Total views
945
On SlideShare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
24
Comments
1
Likes
0
Embeds 0
No embeds

No notes for slide

Nokia Asha UI Clinic September 2013

  1. 1. Nokia Asha UX clinic September 2013 Jan Krebber @krebbixux Senior User Experience Consultant
  2. 2. Overview 2 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux • QuickStocks • Space Survivor 2 • General questions • UX offering • Take home messages
  3. 3. QuickStocks
  4. 4. Structure. 4 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  5. 5. Truncated name makes the app look unprofessional before it is even started. 5 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  6. 6. Use a square launcher icon for WebApps. 6 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  7. 7. Do not rely on red and green color coding. 7 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  8. 8. Ensure a good contrast also for non- selected items. 8 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux www.snook.ca
  9. 9. Clean sweep 1: Move version number to the bottom, Search into top bar. 9 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  10. 10. Clean sweep 2: Move buttons to a different list. 10 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  11. 11. First and last item should not have “move up” and “move down”. 11 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  12. 12. Clean sweep 3: Access history setting by tapping the graphics. 12 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  13. 13. Instead of pop-up lists, use lists in a new view to avoid scrolling. 13 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  14. 14. Give Search its own view and add a “back path”. 14 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  15. 15. Reminder: Map the hardware Back key to in-view Back commands in WebApps. 15 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  16. 16. Ads are well placed. 16 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  17. 17. Even not a standard – expand/collapse works very well. 17 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  18. 18. Proposed structure. 18 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux Current structure
  19. 19. Move power functions to a secondary level. 19 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  20. 20. Space Survivor 2
  21. 21. Structure. 21 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  22. 22. Be careful with abbreviations. Not everybody knows “BGM”. 22 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  23. 23. Do not start the app with game sound on. 23 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  24. 24. Some items are too small for touch. 24 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  25. 25. It’s hard to read text against a moving background. 25 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  26. 26. Do not use all caps. It is hard to read and you are shouting. 26 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  27. 27. HW back key should be the only way to pause a game and to go back. 27 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  28. 28. The Exit query could be removed. 28 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  29. 29. Buying and taking advantage of new ships and weapons is not clear to people. 29 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  30. 30. Ship navigation is difficult and sluggish. 30 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  31. 31. To make it more zippy do not paint after each input, but aggregate input. 31 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux - http://stackoverflow.com/questions/1120 4577/how-to-implement-idle-task-in-java- swing - http://developer.nokia.com/Resources/Lib rary/Java/#!code-examples/mobile- sensors-cottage360/cottage360java.html
  32. 32. The game is easily closed by accident. 32 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  33. 33. Make game control simple and robust. 33 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  34. 34. Help people to understand your game or app. 34 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  35. 35. General questions
  36. 36. How many values should I set in a picker? One due to limited screen real estate. 36 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  37. 37. UX offering
  38. 38. There are LCDUI and LWUIT UI style guides. 38 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  39. 39. There are UI stencils for Inkscape in addition to Adobe Illustrator. 39 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  40. 40. Asha UI component demo application is a Java midlet suite for LCDUI. 40 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  41. 41. Literature and links 41 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux • UX Library for Nokia Asha: • http://www.developer.nokia.com/Resources/Library/Asha_UI/#!index.html • Nokia Asha Web app UX guidelines: • http://www.developer.nokia.com/Resources/Library/Nokia_Asha_web_apps_library/#!design-library.html • Nokia Asha UI component demos: • https://projects.developer.nokia.com/asha_ui_component_demos • QuickStocks: http://store.ovi.com/content/345857 • Space Survivor 2: http://store.ovi.com/content/356732 • Touch input 1: http://stackoverflow.com/questions/11204577/how-to-implement-idle-task-in-java- swing • Touch input 2: http://developer.nokia.com/Resources/Library/Java/#!code-examples/mobile-sensors- cottage360/cottage360java.html
  42. 42. Take home messages
  43. 43. Move power functions to a secondary level. 43 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  44. 44. Make game control simple and robust. 44 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  45. 45. Help people to understand your game or app. 45 © Nokia 2013 Nokia Asha UX clinic September 2013.pptx 2013-18-09 Jan Krebber @krebbixux
  46. 46. Special thanks to Ian and Joseph  phantasia_shin@yahoo.com ian.wong@miniansoftware.com
  47. 47. Thanks to Sanna Hiukka Stratos Kalogirou and Attila Csipa.
  48. 48. Thanks . Jan Krebber ext-jan.krebber@nokia.com @krebbixux

×