SlideShare a Scribd company logo
1 of 46
Download to read offline
Design tips for Series 40
game developers




1                 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Overview

Overview
• Series 40 full touch specific characteristics
• Navigation and settings
• In-game interaction
• Take home messages
• Exercises




2   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Series 40 full touch specific
           characteristics


3   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
This is an entry level phone.




4   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
The compact phone is equipped with a
3’’ screen and acceleration sensors.




5   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Navigation and settings




6   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
People want to start, pause and exit a
mobile game fast – with one tap.




7   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Allow people to skip the intro.




8   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Avoid scrolling and swiping to access
any feature.




9   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
10   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Example: Make it big.




11   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Split screens up into 2 screens when
necessary.
                                                                     Series 40 full touch




                                                E7 Symbian Belle
12   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Do not rely on icons only.




13   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Be consistent with icon metaphors –
text might solve the problem.




14   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
There is no focus in Series 40 touch
phones.




15   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Hide all non-touch related views and
check your help text about non-touch.




16   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Combine sound settings at the start
with other settings or calls-to-action.




17   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Settings should be persistent and
mute sound if the phone is silent.




18   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Always ensure a way back to the game.




19   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Use a virtual keyboard with QWERTY
layout, not with ABCDEF nor a tumbler.




20   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Drill down structure suits for most of
the games.




21   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Take care of your business drivers.




22   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
In-game interaction




23   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
A button is a button and a button is a
button.




24   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Make navigation and special function
buttons visible.




25   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
In portrait, one finger easily hides 1/3
of the relevant screen area.




26   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Resistive screens might have trouble
with multipoint gestures.




27   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Do drag and drop with an offset, since
you do not see the target otherwise.




     screen                                screen                                          screen




                                                                    people’s                        people’s
                                                                      view                            view
28    © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Dialogs must put everything else to
the background.




29   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
If levels take longer than seconds, find
a way to continue where terminated.




30   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Test it – on the device not only on the
workstation.




31   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Take home messages




32   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
33   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
People want to play – but not with your
menus.




34   © Nokia 2012 UX Basics.pptx v. 0.1 YYYY-MM-DD Jan Krebber
Adapt the interaction to the limited
screen real estate.




35   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
More on the topic:
Game design:
http://www.developer.nokia.com/Resources/Library/Design_and_UX/#!designing-different-
applications/game-design.html

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

UX 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

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

Wiki article to this webinar:
http://www.developer.nokia.com/Community/Wiki/Series_40_UI_game_design_tips_webinar
_%E2%80%93_companion_article


36   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Exercises




37   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Exercise: What is the minimum size of a
standard touch area and its margin?
- The answer should relate to size in cm and amount
of pixels in Series 40 full touch devices.




38   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Exercise: How would you catch up for a
too small touch area?
E.g. Your touch area is only 4 mm x 4 mm, with only
0,3 mm margin, what would you do to support
people playing with your game?




39   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Exercise: What does your application
do if people press the red end key?




40   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Exercise: The phone is muted, but the
user set ”sound on” during the last
game session.
How does your game behave now that
it is opened?




41   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Exercise: How would you change the
following UI component?




42   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Exercise: Where would you place your
in-app purchase access?




43   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Exercise: How does your game handle
the backlight timeout?
You find more information from here:
http://www.developer.nokia.com/Resources/Library
/Design_and_UX/#!designing-different-
applications/game-design/game-user-experience-
guidelines.html




44   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Thanks to:
- Anne Kivimaa
- Sanna Hiukka

45   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
Thanks 

ext-jan.krebber@nokia.com

46   © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber

More Related Content

More from 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
 
Nokia Asha webinar: Add VoIP services to your Nokia Asha apps
Nokia Asha webinar: Add VoIP services to your Nokia Asha appsNokia Asha webinar: Add VoIP services to your Nokia Asha apps
Nokia Asha webinar: Add VoIP services to your Nokia Asha apps
Microsoft Mobile Developer
 

More from Microsoft Mobile Developer (20)

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
 
Nokia Asha webinar: Add VoIP services to your Nokia Asha apps
Nokia Asha webinar: Add VoIP services to your Nokia Asha appsNokia Asha webinar: Add VoIP services to your Nokia Asha apps
Nokia Asha webinar: Add VoIP services to your Nokia Asha apps
 
LUMIA APP LABS #18: INTRODUCING NOKIA IMAGING SDK 1.0
LUMIA APP LABS #18: INTRODUCING NOKIA IMAGING SDK 1.0LUMIA APP LABS #18: INTRODUCING NOKIA IMAGING SDK 1.0
LUMIA APP LABS #18: INTRODUCING NOKIA IMAGING SDK 1.0
 
Nokia Asha webinar: Developing location-based services for Nokia Asha phones ...
Nokia Asha webinar: Developing location-based services for Nokia Asha phones ...Nokia Asha webinar: Developing location-based services for Nokia Asha phones ...
Nokia Asha webinar: Developing location-based services for Nokia Asha phones ...
 

Recently uploaded

Dubai Call girls Service 0524076003 Call girls in Dubai
Dubai Call girls Service 0524076003 Call girls in DubaiDubai Call girls Service 0524076003 Call girls in Dubai
Dubai Call girls Service 0524076003 Call girls in Dubai
Monica Sydney
 
Pakistani Call girls in Deira 0567006274 Deira Call girls
Pakistani Call girls in Deira 0567006274 Deira Call girlsPakistani Call girls in Deira 0567006274 Deira Call girls
Pakistani Call girls in Deira 0567006274 Deira Call girls
Monica Sydney
 
Abortion pills in Saudi RIYADH (+919707899604 } Get Cytotec
Abortion pills in Saudi RIYADH (+919707899604 } Get CytotecAbortion pills in Saudi RIYADH (+919707899604 } Get Cytotec
Abortion pills in Saudi RIYADH (+919707899604 } Get Cytotec
Abortion pills in Riyadh +966572737505 get cytotec
 

Recently uploaded (20)

Dubai Call girls Service 0524076003 Call girls in Dubai
Dubai Call girls Service 0524076003 Call girls in DubaiDubai Call girls Service 0524076003 Call girls in Dubai
Dubai Call girls Service 0524076003 Call girls in Dubai
 
Call Girls In Gorakhpur Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
Call Girls In Gorakhpur Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...Call Girls In Gorakhpur Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
Call Girls In Gorakhpur Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
 
Vip Call Girls Bhubaneswar 🐱‍🏍 9777949614 Independent Escorts Service Bhubane...
Vip Call Girls Bhubaneswar 🐱‍🏍 9777949614 Independent Escorts Service Bhubane...Vip Call Girls Bhubaneswar 🐱‍🏍 9777949614 Independent Escorts Service Bhubane...
Vip Call Girls Bhubaneswar 🐱‍🏍 9777949614 Independent Escorts Service Bhubane...
 
Osmanabad Call Girls Book Night 4k to 12k ️[8617370543] Escorts Girls Service
Osmanabad Call Girls Book Night 4k to 12k ️[8617370543] Escorts Girls ServiceOsmanabad Call Girls Book Night 4k to 12k ️[8617370543] Escorts Girls Service
Osmanabad Call Girls Book Night 4k to 12k ️[8617370543] Escorts Girls Service
 
Call girls Service Bellary - 9332606886 Rs 3000 Free Pickup & Drop Services 2...
Call girls Service Bellary - 9332606886 Rs 3000 Free Pickup & Drop Services 2...Call girls Service Bellary - 9332606886 Rs 3000 Free Pickup & Drop Services 2...
Call girls Service Bellary - 9332606886 Rs 3000 Free Pickup & Drop Services 2...
 
Thane Female Escorts-✔9833754194-Kalyan Reasonalble Escorts-Kurla Independent...
Thane Female Escorts-✔9833754194-Kalyan Reasonalble Escorts-Kurla Independent...Thane Female Escorts-✔9833754194-Kalyan Reasonalble Escorts-Kurla Independent...
Thane Female Escorts-✔9833754194-Kalyan Reasonalble Escorts-Kurla Independent...
 
Foreigner Call Girls Mahim WhatsApp +91-9833363713, Full Night Service
Foreigner Call Girls Mahim WhatsApp +91-9833363713, Full Night ServiceForeigner Call Girls Mahim WhatsApp +91-9833363713, Full Night Service
Foreigner Call Girls Mahim WhatsApp +91-9833363713, Full Night Service
 
Call Girls in Perumbavoor / 9332606886 Genuine Call girls with real Photos an...
Call Girls in Perumbavoor / 9332606886 Genuine Call girls with real Photos an...Call Girls in Perumbavoor / 9332606886 Genuine Call girls with real Photos an...
Call Girls in Perumbavoor / 9332606886 Genuine Call girls with real Photos an...
 
High Profile Escort in Dubai 0524076003 Dubai Escorts
High Profile Escort in Dubai 0524076003 Dubai EscortsHigh Profile Escort in Dubai 0524076003 Dubai Escorts
High Profile Escort in Dubai 0524076003 Dubai Escorts
 
Bhubaneswar🌹Call Girls Kalpana Mesuem ❤Komal 9777949614 💟 Full Trusted CALL ...
Bhubaneswar🌹Call Girls Kalpana Mesuem  ❤Komal 9777949614 💟 Full Trusted CALL ...Bhubaneswar🌹Call Girls Kalpana Mesuem  ❤Komal 9777949614 💟 Full Trusted CALL ...
Bhubaneswar🌹Call Girls Kalpana Mesuem ❤Komal 9777949614 💟 Full Trusted CALL ...
 
Call Girls Bhubaneswar 9777949614 call me Independent Escort Service Bhubaneswar
Call Girls Bhubaneswar 9777949614 call me Independent Escort Service BhubaneswarCall Girls Bhubaneswar 9777949614 call me Independent Escort Service Bhubaneswar
Call Girls Bhubaneswar 9777949614 call me Independent Escort Service Bhubaneswar
 
Call Girls in Ernakulam - 9332606886 Our call girls are sure to provide you w...
Call Girls in Ernakulam - 9332606886 Our call girls are sure to provide you w...Call Girls in Ernakulam - 9332606886 Our call girls are sure to provide you w...
Call Girls in Ernakulam - 9332606886 Our call girls are sure to provide you w...
 
Hire 💕 8617370543 Kushinagar Call Girls Service Call Girls Agency
Hire 💕 8617370543 Kushinagar Call Girls Service Call Girls AgencyHire 💕 8617370543 Kushinagar Call Girls Service Call Girls Agency
Hire 💕 8617370543 Kushinagar Call Girls Service Call Girls Agency
 
Pakistani Call girls in Ajman 0505086370 Ajman Call girls
Pakistani Call girls in Ajman 0505086370 Ajman Call girlsPakistani Call girls in Ajman 0505086370 Ajman Call girls
Pakistani Call girls in Ajman 0505086370 Ajman Call girls
 
Call Girls Rajnandgaon / 9332606886 Genuine Call girls with real Photos and N...
Call Girls Rajnandgaon / 9332606886 Genuine Call girls with real Photos and N...Call Girls Rajnandgaon / 9332606886 Genuine Call girls with real Photos and N...
Call Girls Rajnandgaon / 9332606886 Genuine Call girls with real Photos and N...
 
Prayagraj College Girls Escorts 8250092165 Short 1500 Night 6000 Best call g...
Prayagraj College Girls Escorts  8250092165 Short 1500 Night 6000 Best call g...Prayagraj College Girls Escorts  8250092165 Short 1500 Night 6000 Best call g...
Prayagraj College Girls Escorts 8250092165 Short 1500 Night 6000 Best call g...
 
Pakistani Call girls in Deira 0567006274 Deira Call girls
Pakistani Call girls in Deira 0567006274 Deira Call girlsPakistani Call girls in Deira 0567006274 Deira Call girls
Pakistani Call girls in Deira 0567006274 Deira Call girls
 
Abortion pills in Saudi RIYADH (+919707899604 } Get Cytotec
Abortion pills in Saudi RIYADH (+919707899604 } Get CytotecAbortion pills in Saudi RIYADH (+919707899604 } Get Cytotec
Abortion pills in Saudi RIYADH (+919707899604 } Get Cytotec
 
Turbhe Female Escorts 09167354423 Turbhe Escorts,Call Girls In Turbhe
Turbhe Female Escorts 09167354423  Turbhe Escorts,Call Girls In TurbheTurbhe Female Escorts 09167354423  Turbhe Escorts,Call Girls In Turbhe
Turbhe Female Escorts 09167354423 Turbhe Escorts,Call Girls In Turbhe
 
Call 8617370543 Sangli Call girls with real photos and phone numbers
Call 8617370543 Sangli Call girls with real photos and phone numbersCall 8617370543 Sangli Call girls with real photos and phone numbers
Call 8617370543 Sangli Call girls with real photos and phone numbers
 

Design tips for Series 40 game developers

  • 1. Design tips for Series 40 game developers 1 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 2. Overview Overview • Series 40 full touch specific characteristics • Navigation and settings • In-game interaction • Take home messages • Exercises 2 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 3. Series 40 full touch specific characteristics 3 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 4. This is an entry level phone. 4 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 5. The compact phone is equipped with a 3’’ screen and acceleration sensors. 5 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 6. Navigation and settings 6 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 7. People want to start, pause and exit a mobile game fast – with one tap. 7 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 8. Allow people to skip the intro. 8 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 9. Avoid scrolling and swiping to access any feature. 9 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 10. 10 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 11. Example: Make it big. 11 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 12. Split screens up into 2 screens when necessary. Series 40 full touch E7 Symbian Belle 12 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 13. Do not rely on icons only. 13 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 14. Be consistent with icon metaphors – text might solve the problem. 14 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 15. There is no focus in Series 40 touch phones. 15 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 16. Hide all non-touch related views and check your help text about non-touch. 16 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 17. Combine sound settings at the start with other settings or calls-to-action. 17 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 18. Settings should be persistent and mute sound if the phone is silent. 18 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 19. Always ensure a way back to the game. 19 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 20. Use a virtual keyboard with QWERTY layout, not with ABCDEF nor a tumbler. 20 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 21. Drill down structure suits for most of the games. 21 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 22. Take care of your business drivers. 22 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 23. In-game interaction 23 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 24. A button is a button and a button is a button. 24 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 25. Make navigation and special function buttons visible. 25 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 26. In portrait, one finger easily hides 1/3 of the relevant screen area. 26 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 27. Resistive screens might have trouble with multipoint gestures. 27 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 28. Do drag and drop with an offset, since you do not see the target otherwise. screen screen screen people’s people’s view view 28 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 29. Dialogs must put everything else to the background. 29 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 30. If levels take longer than seconds, find a way to continue where terminated. 30 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 31. Test it – on the device not only on the workstation. 31 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 32. Take home messages 32 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 33. 33 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 34. People want to play – but not with your menus. 34 © Nokia 2012 UX Basics.pptx v. 0.1 YYYY-MM-DD Jan Krebber
  • 35. Adapt the interaction to the limited screen real estate. 35 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 36. More on the topic: Game design: http://www.developer.nokia.com/Resources/Library/Design_and_UX/#!designing-different- applications/game-design.html UX Library: http://www.developer.nokia.com/Resources/Library/Full_Touch/ UX 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 UX Basics: http://www.developer.nokia.com/Resources/Library/Design_and_UX/ Wiki article to this webinar: http://www.developer.nokia.com/Community/Wiki/Series_40_UI_game_design_tips_webinar _%E2%80%93_companion_article 36 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 37. Exercises 37 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 38. Exercise: What is the minimum size of a standard touch area and its margin? - The answer should relate to size in cm and amount of pixels in Series 40 full touch devices. 38 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 39. Exercise: How would you catch up for a too small touch area? E.g. Your touch area is only 4 mm x 4 mm, with only 0,3 mm margin, what would you do to support people playing with your game? 39 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 40. Exercise: What does your application do if people press the red end key? 40 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 41. Exercise: The phone is muted, but the user set ”sound on” during the last game session. How does your game behave now that it is opened? 41 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 42. Exercise: How would you change the following UI component? 42 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 43. Exercise: Where would you place your in-app purchase access? 43 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 44. Exercise: How does your game handle the backlight timeout? You find more information from here: http://www.developer.nokia.com/Resources/Library /Design_and_UX/#!designing-different- applications/game-design/game-user-experience- guidelines.html 44 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 45. Thanks to: - Anne Kivimaa - Sanna Hiukka 45 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber
  • 46. Thanks  ext-jan.krebber@nokia.com 46 © Nokia 2012 Design_tips_for_Series_40_game_developers.pptx 2012-09-13 Jan Krebber