Introduction to the new Nokia Asha UI

2,527 views

Published on

This webinar gets you started with the new Nokia Asha UI, whether you’re a seasoned pro or new to Nokia app development. UX expert Jan Krebber of OCT03 demonstrates the cornerstone concepts of the new Nokia Asha UI and shows you how to apply them to your app designs. He also contrasts the most important aspects of the new Nokia Asha UI design with concepts of the earlier Series 40 Developer Platform and gives you the latest information on new UI tools to help you optimise your designs.

Find out more about:
* developing for Nokia Asha: http://www.developer.nokia.com/Develop/asha
* UX guidelines for Java apps: http://www.developer.nokia.com/Resources/Library/Asha_UI/
* UX guidelines for web apps: http://www.developer.nokia.com/Resources/Library/Nokia_Asha_web_apps_library/
* component demos: https://projects.developer.nokia.com/asha_ui_component_demos

Check out the current webinar schedule here: http://www.developer.nokia.com/webinars

Published in: Technology, Business
3 Comments
2 Likes
Statistics
Notes
  • After Jan presented the prepared material was presented, which brought to light many good points, a discussion ensued regarding navigation options and various ways to handle User Orientation within an application, with Kevin Sharp and Jan Krebber both offering useful alternatives and considerations. Stratos Kalogirou . answered many questions in the chat window regarding Push Notification timing considerations and methods, Navigation or termination using hardware Back key versus immediate termination caused by swiping from the left or right of the screen edge. Also, how to add Help and About screen to an application was discussed.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • August 28 session was very informative. After the excellent prepared material was presented by Jan, Kevin and Jan discussed various navigation methods, including breadcrumbing, and whether it was needed. Category bar usage was discussed Stratos answered questions regarding Push Notifications, addition of Help and About to an application, A URL was given: http://developer.nokia.com/Resources/Library/Java/#!developers-guides/ui-graphics-and-interaction/high-level-ui-components/command.html which returned a 404 file not found error during the session. However, the URL worked later. This might be due to my not being signed in during the first attempt and having signed into Nokia developer site before the second attempt to link.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Webinar recording of 16 May session with full chat commentary if available here: http://forumnokia.adobeconnect.com/p3weu5zopai/
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total views
2,527
On SlideShare
0
From Embeds
0
Number of Embeds
9
Actions
Shares
0
Downloads
128
Comments
3
Likes
2
Embeds 0
No embeds

No notes for slide

Introduction to the new Nokia Asha UI

  1. 1. Introduction to the new Nokia Asha UI Jan Krebber Senior User Experience Consultant
  2. 2. Overview 2 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux • UI design changes • From Series 40 non-touch to Nokia Asha UI • UX offering • Take home messages
  3. 3. UI design changes
  4. 4. 4 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux The visualization changed, but the APIs remain compatible.
  5. 5. The screen is optimized for mobility, convenience and effectiveness. 5 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  6. 6. Consider thumb usage. Make touch areas large enough. 6 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  7. 7. Back-stepping is done via a dedicated hardware Back/Exit key. 7 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  8. 8. The Swipe is reserved. 8 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  9. 9. Use 25 px margin for gestures to be Swipe- safe. 9 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  10. 10. Push notification lets people listen to your service if there is something new. 10 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux Your service Nokia server
  11. 11. Category bar can have tabs or actions. Do not mix them. 11 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  12. 12. Indicating selected items has been simplified. 12 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  13. 13. The popup list has been simplified as well. Replace it with a list if necessary. 13 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  14. 14. Square Fastlane icon is cut for you into Home’s icon. 14 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  15. 15. Make sure custom components work with the light background. 15 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  16. 16. Textual guidelines are simplified. 16 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  17. 17. From Series 40 non-touch to Nokia Asha UI
  18. 18. Remove focus when porting from Series 40 non-touch. 18 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  19. 19. No focus in a list (1). Highlight only in a picker (2). 19 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  20. 20. Example: List no focus – Picker highlight. 20 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  21. 21. Split non-touch Options menu into Options menu and Long-press menu. 21 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  22. 22. Long-press menu items must be repeated in later views. 22 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  23. 23. UX offering
  24. 24. There are LCDUI and LWUIT UI style guides. 24 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  25. 25. There are UI stencils for Inkscape in addition to Adobe Illustrator. 25 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  26. 26. Asha UI component demo application is a Java midlet suite for LCDUI. 26 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  27. 27. Literature and links 27 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 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_As ha_web_apps_library/#!design-library.html • Nokia Asha UI component demos: • https://projects.developer.nokia.com/asha_ui_component_de mos
  28. 28. Take home messages
  29. 29. 29 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux The visualization changed, but the APIs remain compatible.
  30. 30. Back-stepping is done via a dedicated hardware Back/Exit key. 30 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  31. 31. Category bar can have tabs or actions. Do not mix them. 31 © Nokia 2013 Introduction to the new Nokia Asha UI.pptx 2013-08-28 Jan Krebber @krebbixux
  32. 32. Thanks to Sanna Hiukka and Stratos Kalogirou.
  33. 33. Thanks . Jan Krebber ext-jan.krebber@nokia.com @krebbixux

×