SlideShare uma empresa Scribd logo
UX CLINIC FOR SERIES 40
MARCH 2013


Jan Krebber
Senior User Experience Consultant
OCTO3

 1       © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Overview
                                                                    - Random Table
                                                                             - What we found
                                                                             - What we propose to add

                                                                    - Compass Research concept




2   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
RANDOM TABLE
 WHAT WE FOUND




3   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Random Table is a good example of how to
create a great app with LCDUI.




4   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Back/Exit on main view is disabled, but Exit
is duplicated as a list item.




5   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Back should move back in hierarchy.
           1                                          2                               3   4




6   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Help and About are usually found from
Options menu – preferably in all views.




7   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Keep the hierarchy flat where possible.
           1                                          2                               3




8   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
A dialogue is interrupting the flow.
                  Current solution                                                    Proposal




9   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
People must have enough time to read a
dialogue.




10   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
A shorter application name will avoid
truncation.




11   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Consider the red end key closing the
application immediately.




12   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Name views consistently and use short view
names.




13   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Avoid typos and inconsistent language with
copy edit and a style guide.




14   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
If there is only one text (input) field, set
focus on it automatically.
            1                                          2                               3   4




15   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
RANDOM TABLE
 WHAT WE PROPOSE TO ADD




16   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Statistics give a
better idea of the
performance than
just a table of
results.



17   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Consider gamification of the task.




18   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Additional modes for special training
purposes.




19   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
COMPASS RESEARCH
 CONCEPT




20   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Compass Research app is a powerful geo
solution for limited screen size.
Traverse                                                        Inverse

       C              y Axis                                                      y Axis



                                                    A                                            A
                                             x Axis                                          x Axis
                          B                                                           B




  21       © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
There are some main use cases.
  Those work with selected input values.
y Axis                                          y Axis                              y Axis                      y Axis         known
                                    C                                   C                                C
                                                                                                                                 find

                        A                                                                       ref                                A
                 x Axis                                                                         x Axis                         x Axis
  B                                                 B                                      B                      B

  Coordinates (A)                   Coordinates (B)                           Coordinates (B)                Coordinates (A)
  Coordinates (B)                   Angle (yBC)                               Angle (xBref)                  Coordinates (B)
  Angle (xBA)                       Distance (BC)                             Angle (refBC)                  Angle (ABC)
  Distance (AB)                     Coordinates (C)                           Distance (BC)                  Distance (BC)
                                                                              Coordinates (C)                Coordinates (C)
   22    © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Sometimes requires review of all values and
related outputs (results).




23   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Use descriptive text and
icons for a launchpad view.




24   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Correction might be
needed. Try to keep it
simple, e.g. with a button.




25   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
The design is based on splitting use cases
and a launchpad view.




26   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
TAKE HOME MESSAGES




27   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Simplify.




28   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Be consistent.




29   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Base the layout on use cases.




30   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
UX OFFERING FOR SERIES 40




31   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
There are LCDUI and LWUIT style guides –
and more.




32   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
The Nokia’s Series 40 stencils support
Inkscape.




33   © Nokia 2013 UX checklist for Series 40 full-touch apps.pptx v.2 2012-02-26 Jan Krebber
Series 40 UI component demo projects
showcase UI and code.




34   © Nokia 2013 UX checklist for Series 40 full-touch apps.pptx v.2 2012-02-26 Jan Krebber
We offer reviews for the UI clinics.




35   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
Series 40 UI design
• UX Library for Series 40 full touch:
  http://www.developer.nokia.com/Resources/Library/Full_Touch/

• LWUIT UX Overview:
  http://www.developer.nokia.com/Resources/Library/LWUIT/#!ux-
  overview.html

• UI Component Demos project:
  https://projects.developer.nokia.com/s40uivisualisation

• Web Apps UI visualisation project:
  https://projects.developer.nokia.com/webappsuivisualisation
36   © Nokia 2013 UX checklist for Series 40 full-touch apps.pptx v.2 2012-02-26 Jan Krebber
Further reading and links
• Random Math Table project
  https://projects.developer.nokia.com/RandomMathTable
• Random Math tabel in the store
  http://store.nokia.com/content/347006
• Mobile Design Pattern Gallery. Theresa Neil (2012).
• Designing Mobile Interfaces. Steven Hoober and Eric Berkman
  (2011).
• nngroup.com (Jacob Nielsen’s blog)
• http://snook.ca/technical/colour_contrast/colour.html
  (contrast checker)
37   © Nokia 2013 UX checklist for Series 40 full-touch apps.pptx v.2 2012-02-26 Jan Krebber
THANKS TO:
RON HARDY, COMPASS RESEARCH, INC.
GIRISH PADIA
SANNA HIUKKA
ANNE KIVIMAA



38   © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
THANKS 



ext-jan.krebber@nokia.com
#krebbixux



 39     © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber

Mais conteúdo relacionado

Mais de Microsoft Mobile Developer

Push notifications on Nokia X
Push notifications on Nokia XPush notifications on Nokia X
Push notifications on Nokia X
Microsoft Mobile Developer
 
DIY Nokia Asha app usability studies
DIY Nokia Asha app usability studiesDIY Nokia Asha app usability studies
DIY Nokia Asha app usability studies
Microsoft Mobile Developer
 
Lessons learned from Nokia X UI reviews
Lessons learned from Nokia X UI reviewsLessons learned from Nokia X UI reviews
Lessons learned from Nokia X UI reviews
Microsoft Mobile Developer
 
Location based services for Nokia X and Nokia Asha using Geo2tag
Location based services for Nokia X and Nokia Asha using Geo2tagLocation based services for Nokia X and Nokia Asha using Geo2tag
Location based services for Nokia X and Nokia Asha using Geo2tag
Microsoft Mobile Developer
 
HERE Maps for the Nokia X platform
HERE Maps for the Nokia X platformHERE Maps for the Nokia X platform
HERE Maps for the Nokia X platform
Microsoft Mobile Developer
 
Nokia In-App Payment - UX considerations
Nokia In-App Payment - UX considerationsNokia In-App Payment - UX considerations
Nokia In-App Payment - UX considerations
Microsoft Mobile Developer
 
Introduction to Nokia Asha SDK 1.2 (beta)
Introduction to Nokia Asha SDK 1.2 (beta)Introduction to Nokia Asha SDK 1.2 (beta)
Introduction to Nokia Asha SDK 1.2 (beta)
Microsoft Mobile Developer
 
UX considerations when porting to Nokia X
UX considerations when porting to Nokia XUX considerations when porting to Nokia X
UX considerations when porting to Nokia X
Microsoft Mobile Developer
 
Kids' games and educational app design
Kids' games and educational app designKids' games and educational app design
Kids' games and educational app design
Microsoft Mobile Developer
 
Nokia X: opportunities for developers
Nokia X: opportunities for developersNokia X: opportunities for developers
Nokia X: opportunities for developers
Microsoft Mobile Developer
 
Lumia App Labs: Nokia Imaging SDK 1.1
Lumia App Labs: Nokia Imaging SDK 1.1Lumia App Labs: Nokia Imaging SDK 1.1
Lumia App Labs: Nokia Imaging SDK 1.1
Microsoft Mobile Developer
 
Intro to Nokia X software platform and tools
Intro to Nokia X software platform and toolsIntro to Nokia X software platform and tools
Intro to Nokia X software platform and tools
Microsoft Mobile Developer
 
Lumia App Labs: Lessons learned from 50 windows phone 8 design consultations
Lumia App Labs: Lessons learned from 50 windows phone 8 design consultationsLumia App Labs: Lessons learned from 50 windows phone 8 design consultations
Lumia App Labs: Lessons learned from 50 windows phone 8 design consultations
Microsoft Mobile Developer
 
Windows Phone 8 speech: parliamo con la nostra app
Windows Phone 8 speech: parliamo con la nostra appWindows Phone 8 speech: parliamo con la nostra app
Windows Phone 8 speech: parliamo con la nostra app
Microsoft Mobile Developer
 
La pubblicazione di un'applicazione sullo store
La pubblicazione di un'applicazione sullo storeLa pubblicazione di un'applicazione sullo store
La pubblicazione di un'applicazione sullo store
Microsoft Mobile Developer
 
Il pattern mvvm come strutturare al meglio il vostro progetto
Il pattern mvvm come strutturare al meglio il vostro progettoIl pattern mvvm come strutturare al meglio il vostro progetto
Il pattern mvvm come strutturare al meglio il vostro progetto
Microsoft Mobile Developer
 
Lens app trasformare il telefono in una fotocamera
Lens app trasformare il telefono in una fotocameraLens app trasformare il telefono in una fotocamera
Lens app trasformare il telefono in una fotocamera
Microsoft Mobile Developer
 
NFC, Bluetooth e comunicazione tra app
NFC, Bluetooth e comunicazione tra appNFC, Bluetooth e comunicazione tra app
NFC, Bluetooth e comunicazione tra app
Microsoft Mobile Developer
 
Nokia Asha webinar: Developing health-care applications for Nokia Asha phones
Nokia Asha webinar: Developing health-care applications for Nokia Asha phonesNokia Asha webinar: Developing health-care applications for Nokia Asha phones
Nokia Asha webinar: Developing health-care applications for Nokia Asha phones
Microsoft Mobile Developer
 
Connettersi al Cloud Azure Mobile Services
Connettersi al Cloud Azure Mobile ServicesConnettersi al Cloud Azure Mobile Services
Connettersi al Cloud Azure Mobile Services
Microsoft Mobile Developer
 

Mais de Microsoft Mobile Developer (20)

Push notifications on Nokia X
Push notifications on Nokia XPush notifications on Nokia X
Push notifications on Nokia X
 
DIY Nokia Asha app usability studies
DIY Nokia Asha app usability studiesDIY Nokia Asha app usability studies
DIY Nokia Asha app usability studies
 
Lessons learned from Nokia X UI reviews
Lessons learned from Nokia X UI reviewsLessons learned from Nokia X UI reviews
Lessons learned from Nokia X UI reviews
 
Location based services for Nokia X and Nokia Asha using Geo2tag
Location based services for Nokia X and Nokia Asha using Geo2tagLocation based services for Nokia X and Nokia Asha using Geo2tag
Location based services for Nokia X and Nokia Asha using Geo2tag
 
HERE Maps for the Nokia X platform
HERE Maps for the Nokia X platformHERE Maps for the Nokia X platform
HERE Maps for the Nokia X platform
 
Nokia In-App Payment - UX considerations
Nokia In-App Payment - UX considerationsNokia In-App Payment - UX considerations
Nokia In-App Payment - UX considerations
 
Introduction to Nokia Asha SDK 1.2 (beta)
Introduction to Nokia Asha SDK 1.2 (beta)Introduction to Nokia Asha SDK 1.2 (beta)
Introduction to Nokia Asha SDK 1.2 (beta)
 
UX considerations when porting to Nokia X
UX considerations when porting to Nokia XUX considerations when porting to Nokia X
UX considerations when porting to Nokia X
 
Kids' games and educational app design
Kids' games and educational app designKids' games and educational app design
Kids' games and educational app design
 
Nokia X: opportunities for developers
Nokia X: opportunities for developersNokia X: opportunities for developers
Nokia X: opportunities for developers
 
Lumia App Labs: Nokia Imaging SDK 1.1
Lumia App Labs: Nokia Imaging SDK 1.1Lumia App Labs: Nokia Imaging SDK 1.1
Lumia App Labs: Nokia Imaging SDK 1.1
 
Intro to Nokia X software platform and tools
Intro to Nokia X software platform and toolsIntro to Nokia X software platform and tools
Intro to Nokia X software platform and tools
 
Lumia App Labs: Lessons learned from 50 windows phone 8 design consultations
Lumia App Labs: Lessons learned from 50 windows phone 8 design consultationsLumia App Labs: Lessons learned from 50 windows phone 8 design consultations
Lumia App Labs: Lessons learned from 50 windows phone 8 design consultations
 
Windows Phone 8 speech: parliamo con la nostra app
Windows Phone 8 speech: parliamo con la nostra appWindows Phone 8 speech: parliamo con la nostra app
Windows Phone 8 speech: parliamo con la nostra app
 
La pubblicazione di un'applicazione sullo store
La pubblicazione di un'applicazione sullo storeLa pubblicazione di un'applicazione sullo store
La pubblicazione di un'applicazione sullo store
 
Il pattern mvvm come strutturare al meglio il vostro progetto
Il pattern mvvm come strutturare al meglio il vostro progettoIl pattern mvvm come strutturare al meglio il vostro progetto
Il pattern mvvm come strutturare al meglio il vostro progetto
 
Lens app trasformare il telefono in una fotocamera
Lens app trasformare il telefono in una fotocameraLens app trasformare il telefono in una fotocamera
Lens app trasformare il telefono in una fotocamera
 
NFC, Bluetooth e comunicazione tra app
NFC, Bluetooth e comunicazione tra appNFC, Bluetooth e comunicazione tra app
NFC, Bluetooth e comunicazione tra app
 
Nokia Asha webinar: Developing health-care applications for Nokia Asha phones
Nokia Asha webinar: Developing health-care applications for Nokia Asha phonesNokia Asha webinar: Developing health-care applications for Nokia Asha phones
Nokia Asha webinar: Developing health-care applications for Nokia Asha phones
 
Connettersi al Cloud Azure Mobile Services
Connettersi al Cloud Azure Mobile ServicesConnettersi al Cloud Azure Mobile Services
Connettersi al Cloud Azure Mobile Services
 

Último

Taking AI to the Next Level in Manufacturing.pdf
Taking AI to the Next Level in Manufacturing.pdfTaking AI to the Next Level in Manufacturing.pdf
Taking AI to the Next Level in Manufacturing.pdf
ssuserfac0301
 
Recommendation System using RAG Architecture
Recommendation System using RAG ArchitectureRecommendation System using RAG Architecture
Recommendation System using RAG Architecture
fredae14
 
OpenID AuthZEN Interop Read Out - Authorization
OpenID AuthZEN Interop Read Out - AuthorizationOpenID AuthZEN Interop Read Out - Authorization
OpenID AuthZEN Interop Read Out - Authorization
David Brossard
 
TrustArc Webinar - 2024 Global Privacy Survey
TrustArc Webinar - 2024 Global Privacy SurveyTrustArc Webinar - 2024 Global Privacy Survey
TrustArc Webinar - 2024 Global Privacy Survey
TrustArc
 
“Building and Scaling AI Applications with the Nx AI Manager,” a Presentation...
“Building and Scaling AI Applications with the Nx AI Manager,” a Presentation...“Building and Scaling AI Applications with the Nx AI Manager,” a Presentation...
“Building and Scaling AI Applications with the Nx AI Manager,” a Presentation...
Edge AI and Vision Alliance
 
Nordic Marketo Engage User Group_June 13_ 2024.pptx
Nordic Marketo Engage User Group_June 13_ 2024.pptxNordic Marketo Engage User Group_June 13_ 2024.pptx
Nordic Marketo Engage User Group_June 13_ 2024.pptx
MichaelKnudsen27
 
Best 20 SEO Techniques To Improve Website Visibility In SERP
Best 20 SEO Techniques To Improve Website Visibility In SERPBest 20 SEO Techniques To Improve Website Visibility In SERP
Best 20 SEO Techniques To Improve Website Visibility In SERP
Pixlogix Infotech
 
Unlock the Future of Search with MongoDB Atlas_ Vector Search Unleashed.pdf
Unlock the Future of Search with MongoDB Atlas_ Vector Search Unleashed.pdfUnlock the Future of Search with MongoDB Atlas_ Vector Search Unleashed.pdf
Unlock the Future of Search with MongoDB Atlas_ Vector Search Unleashed.pdf
Malak Abu Hammad
 
Deep Dive: AI-Powered Marketing to Get More Leads and Customers with HyperGro...
Deep Dive: AI-Powered Marketing to Get More Leads and Customers with HyperGro...Deep Dive: AI-Powered Marketing to Get More Leads and Customers with HyperGro...
Deep Dive: AI-Powered Marketing to Get More Leads and Customers with HyperGro...
saastr
 
Salesforce Integration for Bonterra Impact Management (fka Social Solutions A...
Salesforce Integration for Bonterra Impact Management (fka Social Solutions A...Salesforce Integration for Bonterra Impact Management (fka Social Solutions A...
Salesforce Integration for Bonterra Impact Management (fka Social Solutions A...
Jeffrey Haguewood
 
20240609 QFM020 Irresponsible AI Reading List May 2024
20240609 QFM020 Irresponsible AI Reading List May 202420240609 QFM020 Irresponsible AI Reading List May 2024
20240609 QFM020 Irresponsible AI Reading List May 2024
Matthew Sinclair
 
Your One-Stop Shop for Python Success: Top 10 US Python Development Providers
Your One-Stop Shop for Python Success: Top 10 US Python Development ProvidersYour One-Stop Shop for Python Success: Top 10 US Python Development Providers
Your One-Stop Shop for Python Success: Top 10 US Python Development Providers
akankshawande
 
Choosing The Best AWS Service For Your Website + API.pptx
Choosing The Best AWS Service For Your Website + API.pptxChoosing The Best AWS Service For Your Website + API.pptx
Choosing The Best AWS Service For Your Website + API.pptx
Brandon Minnick, MBA
 
Fueling AI with Great Data with Airbyte Webinar
Fueling AI with Great Data with Airbyte WebinarFueling AI with Great Data with Airbyte Webinar
Fueling AI with Great Data with Airbyte Webinar
Zilliz
 
HCL Notes and Domino License Cost Reduction in the World of DLAU
HCL Notes and Domino License Cost Reduction in the World of DLAUHCL Notes and Domino License Cost Reduction in the World of DLAU
HCL Notes and Domino License Cost Reduction in the World of DLAU
panagenda
 
Main news related to the CCS TSI 2023 (2023/1695)
Main news related to the CCS TSI 2023 (2023/1695)Main news related to the CCS TSI 2023 (2023/1695)
Main news related to the CCS TSI 2023 (2023/1695)
Jakub Marek
 
Webinar: Designing a schema for a Data Warehouse
Webinar: Designing a schema for a Data WarehouseWebinar: Designing a schema for a Data Warehouse
Webinar: Designing a schema for a Data Warehouse
Federico Razzoli
 
GenAI Pilot Implementation in the organizations
GenAI Pilot Implementation in the organizationsGenAI Pilot Implementation in the organizations
GenAI Pilot Implementation in the organizations
kumardaparthi1024
 
Mariano G Tinti - Decoding SpaceX
Mariano G Tinti - Decoding SpaceXMariano G Tinti - Decoding SpaceX
Mariano G Tinti - Decoding SpaceX
Mariano Tinti
 
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
Speck&Tech
 

Último (20)

Taking AI to the Next Level in Manufacturing.pdf
Taking AI to the Next Level in Manufacturing.pdfTaking AI to the Next Level in Manufacturing.pdf
Taking AI to the Next Level in Manufacturing.pdf
 
Recommendation System using RAG Architecture
Recommendation System using RAG ArchitectureRecommendation System using RAG Architecture
Recommendation System using RAG Architecture
 
OpenID AuthZEN Interop Read Out - Authorization
OpenID AuthZEN Interop Read Out - AuthorizationOpenID AuthZEN Interop Read Out - Authorization
OpenID AuthZEN Interop Read Out - Authorization
 
TrustArc Webinar - 2024 Global Privacy Survey
TrustArc Webinar - 2024 Global Privacy SurveyTrustArc Webinar - 2024 Global Privacy Survey
TrustArc Webinar - 2024 Global Privacy Survey
 
“Building and Scaling AI Applications with the Nx AI Manager,” a Presentation...
“Building and Scaling AI Applications with the Nx AI Manager,” a Presentation...“Building and Scaling AI Applications with the Nx AI Manager,” a Presentation...
“Building and Scaling AI Applications with the Nx AI Manager,” a Presentation...
 
Nordic Marketo Engage User Group_June 13_ 2024.pptx
Nordic Marketo Engage User Group_June 13_ 2024.pptxNordic Marketo Engage User Group_June 13_ 2024.pptx
Nordic Marketo Engage User Group_June 13_ 2024.pptx
 
Best 20 SEO Techniques To Improve Website Visibility In SERP
Best 20 SEO Techniques To Improve Website Visibility In SERPBest 20 SEO Techniques To Improve Website Visibility In SERP
Best 20 SEO Techniques To Improve Website Visibility In SERP
 
Unlock the Future of Search with MongoDB Atlas_ Vector Search Unleashed.pdf
Unlock the Future of Search with MongoDB Atlas_ Vector Search Unleashed.pdfUnlock the Future of Search with MongoDB Atlas_ Vector Search Unleashed.pdf
Unlock the Future of Search with MongoDB Atlas_ Vector Search Unleashed.pdf
 
Deep Dive: AI-Powered Marketing to Get More Leads and Customers with HyperGro...
Deep Dive: AI-Powered Marketing to Get More Leads and Customers with HyperGro...Deep Dive: AI-Powered Marketing to Get More Leads and Customers with HyperGro...
Deep Dive: AI-Powered Marketing to Get More Leads and Customers with HyperGro...
 
Salesforce Integration for Bonterra Impact Management (fka Social Solutions A...
Salesforce Integration for Bonterra Impact Management (fka Social Solutions A...Salesforce Integration for Bonterra Impact Management (fka Social Solutions A...
Salesforce Integration for Bonterra Impact Management (fka Social Solutions A...
 
20240609 QFM020 Irresponsible AI Reading List May 2024
20240609 QFM020 Irresponsible AI Reading List May 202420240609 QFM020 Irresponsible AI Reading List May 2024
20240609 QFM020 Irresponsible AI Reading List May 2024
 
Your One-Stop Shop for Python Success: Top 10 US Python Development Providers
Your One-Stop Shop for Python Success: Top 10 US Python Development ProvidersYour One-Stop Shop for Python Success: Top 10 US Python Development Providers
Your One-Stop Shop for Python Success: Top 10 US Python Development Providers
 
Choosing The Best AWS Service For Your Website + API.pptx
Choosing The Best AWS Service For Your Website + API.pptxChoosing The Best AWS Service For Your Website + API.pptx
Choosing The Best AWS Service For Your Website + API.pptx
 
Fueling AI with Great Data with Airbyte Webinar
Fueling AI with Great Data with Airbyte WebinarFueling AI with Great Data with Airbyte Webinar
Fueling AI with Great Data with Airbyte Webinar
 
HCL Notes and Domino License Cost Reduction in the World of DLAU
HCL Notes and Domino License Cost Reduction in the World of DLAUHCL Notes and Domino License Cost Reduction in the World of DLAU
HCL Notes and Domino License Cost Reduction in the World of DLAU
 
Main news related to the CCS TSI 2023 (2023/1695)
Main news related to the CCS TSI 2023 (2023/1695)Main news related to the CCS TSI 2023 (2023/1695)
Main news related to the CCS TSI 2023 (2023/1695)
 
Webinar: Designing a schema for a Data Warehouse
Webinar: Designing a schema for a Data WarehouseWebinar: Designing a schema for a Data Warehouse
Webinar: Designing a schema for a Data Warehouse
 
GenAI Pilot Implementation in the organizations
GenAI Pilot Implementation in the organizationsGenAI Pilot Implementation in the organizations
GenAI Pilot Implementation in the organizations
 
Mariano G Tinti - Decoding SpaceX
Mariano G Tinti - Decoding SpaceXMariano G Tinti - Decoding SpaceX
Mariano G Tinti - Decoding SpaceX
 
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
Cosa hanno in comune un mattoncino Lego e la backdoor XZ?
 

UI Clinic - Series 40 full touch, March 2013

  • 1. UX CLINIC FOR SERIES 40 MARCH 2013 Jan Krebber Senior User Experience Consultant OCTO3 1 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 2. Overview - Random Table - What we found - What we propose to add - Compass Research concept 2 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 3. RANDOM TABLE WHAT WE FOUND 3 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 4. Random Table is a good example of how to create a great app with LCDUI. 4 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 5. Back/Exit on main view is disabled, but Exit is duplicated as a list item. 5 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 6. Back should move back in hierarchy. 1 2 3 4 6 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 7. Help and About are usually found from Options menu – preferably in all views. 7 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 8. Keep the hierarchy flat where possible. 1 2 3 8 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 9. A dialogue is interrupting the flow. Current solution Proposal 9 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 10. People must have enough time to read a dialogue. 10 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 11. A shorter application name will avoid truncation. 11 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 12. Consider the red end key closing the application immediately. 12 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 13. Name views consistently and use short view names. 13 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 14. Avoid typos and inconsistent language with copy edit and a style guide. 14 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 15. If there is only one text (input) field, set focus on it automatically. 1 2 3 4 15 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 16. RANDOM TABLE WHAT WE PROPOSE TO ADD 16 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 17. Statistics give a better idea of the performance than just a table of results. 17 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 18. Consider gamification of the task. 18 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 19. Additional modes for special training purposes. 19 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 20. COMPASS RESEARCH CONCEPT 20 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 21. Compass Research app is a powerful geo solution for limited screen size. Traverse Inverse C y Axis y Axis A A x Axis x Axis B B 21 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 22. There are some main use cases. Those work with selected input values. y Axis y Axis y Axis y Axis known C C C find A ref A x Axis x Axis x Axis B B B B Coordinates (A) Coordinates (B) Coordinates (B) Coordinates (A) Coordinates (B) Angle (yBC) Angle (xBref) Coordinates (B) Angle (xBA) Distance (BC) Angle (refBC) Angle (ABC) Distance (AB) Coordinates (C) Distance (BC) Distance (BC) Coordinates (C) Coordinates (C) 22 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 23. Sometimes requires review of all values and related outputs (results). 23 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 24. Use descriptive text and icons for a launchpad view. 24 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 25. Correction might be needed. Try to keep it simple, e.g. with a button. 25 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 26. The design is based on splitting use cases and a launchpad view. 26 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 27. TAKE HOME MESSAGES 27 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 28. Simplify. 28 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 29. Be consistent. 29 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 30. Base the layout on use cases. 30 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 31. UX OFFERING FOR SERIES 40 31 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 32. There are LCDUI and LWUIT style guides – and more. 32 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 33. The Nokia’s Series 40 stencils support Inkscape. 33 © Nokia 2013 UX checklist for Series 40 full-touch apps.pptx v.2 2012-02-26 Jan Krebber
  • 34. Series 40 UI component demo projects showcase UI and code. 34 © Nokia 2013 UX checklist for Series 40 full-touch apps.pptx v.2 2012-02-26 Jan Krebber
  • 35. We offer reviews for the UI clinics. 35 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 36. Series 40 UI design • UX Library for Series 40 full touch: http://www.developer.nokia.com/Resources/Library/Full_Touch/ • LWUIT UX Overview: http://www.developer.nokia.com/Resources/Library/LWUIT/#!ux- overview.html • UI Component Demos project: https://projects.developer.nokia.com/s40uivisualisation • Web Apps UI visualisation project: https://projects.developer.nokia.com/webappsuivisualisation 36 © Nokia 2013 UX checklist for Series 40 full-touch apps.pptx v.2 2012-02-26 Jan Krebber
  • 37. Further reading and links • Random Math Table project https://projects.developer.nokia.com/RandomMathTable • Random Math tabel in the store http://store.nokia.com/content/347006 • Mobile Design Pattern Gallery. Theresa Neil (2012). • Designing Mobile Interfaces. Steven Hoober and Eric Berkman (2011). • nngroup.com (Jacob Nielsen’s blog) • http://snook.ca/technical/colour_contrast/colour.html (contrast checker) 37 © Nokia 2013 UX checklist for Series 40 full-touch apps.pptx v.2 2012-02-26 Jan Krebber
  • 38. THANKS TO: RON HARDY, COMPASS RESEARCH, INC. GIRISH PADIA SANNA HIUKKA ANNE KIVIMAA 38 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber
  • 39. THANKS  ext-jan.krebber@nokia.com #krebbixux 39 © Nokia 2013 UX clinic for Series 40 March 2013.pptx v.1 2013-03-26 Jan Krebber