Symbian Design Guidelines (downloadable)
These updated guidelines discuss how to design mobile applications that will have a fresh look that fits nicely with current and upcoming native look and feel of the Symbian platform. If you are creating requirements, designing user experiences, or building software for Symbian, these design guidelines are for you. The update includes information on fonts, effects and transitions, and branding. The updated library has also iconography guidelines and a UX checklist, and discusses the most common pitfalls when designing for the Symbian platform. The standalone package includes an Eclipse-based viewer that provides you with a search function. Extract the zip file to any folder on your computer, and click eclipse.exe to access the library.
Symbian Design Guidelines
These updated guidelines discuss how to design mobile applications that will have a fresh look that fits nicely with current and upcoming native look and feel of the Symbian platform. If you are creating requirements, designing user experiences, or building software for Symbian, these design guidelines are for you. The update includes information on fonts, effects and transitions, and branding. The updated library has also iconography guidelines and a UX checklist, and discusses the most common pitfalls when designing for the Symbian platform.
Designing for Windows Phone 7
This Design and User Experience Library section provides design guidelines and other design related information for Windows Phone 7 (WP7).
Design and User Experience Library (downloadable)
The Design and User Experience Library gathers all essential aspects of design and usability into one. The updated library includes different kinds of guidelines, material about theme design, graphics design, and game design, as well as the basics of usability. The library has been updated with information about designing for Windows Phone 7.
Design and User Experience Library (online)
The Design and User Experience Library gathers all essential aspects of design and usability into one. The updated library includes different kinds of guidelines, material about theme design, graphics design, and game design, as well as the basics of usability. The library has been updated with information about designing for Windows Phone 7.
Series 40 Visual Design Stencils
The Series 40 visual design stencils are a collection of customisable user interface components. The stencils can be used to create quick mockups or more refined concepts for presentations to stakeholders.
Symbian UI Patterns
The UI patterns library section designates common language (terms, phrases and structures) to reduce misunderstandings. Using patterns avoids reinventing the wheel, and results in products that are more predictable for users. As is the case with other types of guidance, the patterns describe successful methods, techniques, and arrangements that are recommended to be followed. The patterns are here to guide design and development, not to enforce a style, and are subject to continuous evolution.
Symbian Visual Design Stencils v1.1
Symbian visual design stencils are a collection of realistic user interface views and components. The stencils can be used to create mockups which are close to the final visual result. With this set you can create more refined concepts for presentations to stakeholders. The set contains Nokia fonts and drawing files representing the Qt Quick Components for Symbian. The visual design stencils are available for Adobe Illustrator CS5, Adobe Fireworks CS5 and Inkscape version 0.48 or above. The stencils come in dark and light themes. Both versions are available in the same package.
Designing for Symbian
This library section discusses how to design fresh-looking mobile applications that fit nicely with the native look and feel of the Symbian platform. Developers who are designing user experiences and building applications for Symbian will benefit from these guidelines. We recommend you to follow these guidelines for all S^3, Symbian Anna, and Symbian Belle applications.
Creating Icons for Nokia Phones
All Nokia platforms have specific iconography styles. The one mandatory visual element, constant across all of the platforms, is the surround background shape for the application launcher icon. The internal objects however are fully customisable. This article explains the various platform-specific distinctions in the launcher icons and helps you create clear and unique icons for you applications.
Designing for Series 40
This library section provides touch UI considerations for the Series 40 Touch and Type platform. The section includes interaction guidelines, layout guidelines, information on lists and forms, and iconography guidelines.
Symbian UI Components and Stencils
This library sections lists the UI components that are the basic Qt Quick building blocks of the Symbian OS. To achieve the Symbian UI style, follow the guidelines for each component presented in this library section.
Designing for MeeGo 1.2 Harmattan
This library section explains the navigation and layout principles of the Nokia N9 and gives instructions on how to create launcher icons for applications targeted for the Nokia N9. The Nokia N9 uses a simple gesture-based navigation style which enables maximised screen real estate – you don’t need to have a visible button for every action. For example, swiping from any edge of the screen moves the current application to the background and takes the user to the home screen. When designing applications for Nokia N9, you should consider the structure of the application and avoid the use of interactions that could potentially conflict with the Swipe principle (i.e. interactions requiring users to drag or swipe from the edge of the screen).
UX Checklist for Series 40
This checklist distils the primary style guidelines from the Series 40 Touch and Type UI Style Guide and Series 40 Web Apps UX Guidelines. The selected topics are considered the most important UI style issues to take into account when creating Java applications or web apps for Series 40. The checklist includes links to related web and Java resources for easier access.
Series 40 Web Apps UI Graphics Toolkit v1.1
This file contains Adobe Illustrator CS5, Adobe Fireworks CS5, and Inkscape compatible examples of the recommended UI graphics for use in version 1.5 Series 40 web apps. These graphics and their uses are described in the Series 40 Web Apps UX Guidelines. The graphic include buttons, icons, form elements, and input fields.
Series 40 Web Apps UX Guidelines v1.1
This updated guide provides developers and designers with the key information required to create Series 40 web apps version 1.5 that offer users outstanding UX through consistent look and feel as well as functional behaviour.
UI migration from N9 to updated Symbian style
This library section compares similar UI elements and interaction patterns in Meego 1.2 Harmattan and the updated Symbian style and provides links to the design guidelines and code development help. Note that even though the ElementNames seem identical, the components are in many cases different.
UI migration from native S^3 to Qt Quick components
This library section compares the native Avkon style, used for creating native S^3 applications, and Qt Quick components 1.0 for Symbian. The documentation contains information about name changes and images and interaction descriptions for comparing the changes in look and feel. Links to UI guidelines and code documentation for further reference are also provided.
UX Checklist for MeeGo 1.2 Harmattan
This checklist distils primary style guidelines from the Nokia N9 UX Guidelines. The selected topics are considered the most important UI style issues to take into account when creating applications. The checklist includes links to the related Qt Quick resources for easier access.
UX Checklist for Symbian v1.1
This checklist distils primary style guidelines from Symbian design guidelines. The selected topics are considered the most important UI style issues to take into account when creating applications. The updated checklist includes links to the related Qt Quick resources for easier access.
Design process in a nutshell
The Design process in a nutshell section of the Design and User Experience Library suggests some fairly straightforward ways to put UX into your development process without compromising your time to market. These quick, down-and-dirty insights and tips can help you figure out your own approach to user-centered design.
Designing for MeeGo 1.2 Harmattan
The Designing for MeeGo 1.2 Harmattan section of the Design and User Experience Library explains the essentials of the platform UI style and points you to more detailed documentation.
Designing for Series 40 Touch and Type
The Designing for Series 40 Touch and Type section of the Design and User Experience Library explains the essentials of the platform UI style and points you to more detailed documentation.
Designing for Symbian
The Designing for Symbian section of the Design and User Experience Library explains the essentials of the platform UI style and points you to more detailed documentation.
Designing for different markets
The Designing for different markets section of the Design and User Experience Library discusses the trends of mobile applications in China, Europe, India, and the United States.
Game design
The Game design section of the Design and User Experience Library concentrates on the mobile aspect of game design and gives some general game user experience guidelines.
Interaction design
The Interaction design section of the Design and User Experience Library gives tips and tricks for planning how the application will actually work and how the user will navigate in the application to get the most of it. Here you can learn about wireframes and UI prototypes, and to best take advantage of them in the development work.
Symbian iconography guidelines
The Symbian iconography guidelines section of the Design and User Experience Library gives you a full toolkit for creating icons for your Symbian application. Besides guidelines, the toolkit includes icon templates, the Symbian icon colour palette, and ready-made icons that you can use.
Visual Design
The Visual design section of the Design and User Experience Library gives insight on how creating visual design for mobile devices differs from designing for desktop. Some things to keep in mind are performance, scaling to multiple (small!) screen sizes, and possibly limited set of fonts available, for example.
Mobile Web Templates for Mobile Phones - Examples
The mobile web template examples for mobile phones display a normal content page, a list, a form, and a table created using the Mobile Web Templates for Mobile Phones. You can use the shortened URL http://tinyurl.com/mwtmpe to view the examples in you mobile phone browser.
Mobile Web Templates for Smartphones - Examples
The mobile web template examples for smartphones displays a content page, forms, lists, a button, navigation models, tables, and utility components created using the Mobile Web Templates for Smartphones. You can use the shortened URL http://tinyurl.com/mwtse to view the examples in you smartphone browser.
Series 40 Touch and Type UI Style Guide
This document provides an overview of the Series 40 6th Edition, Feature Pack 1 Touch and Type UI, by describing its essential components. The style guide is intended to be compact and easy-to-read, to that end the guide describes the differences between the Touch and Type UI and Compact UI. For information on the Compact UI, see the Series 40 UI Style Guide.
User Experience Test Plan for End User Feedback
This test plan is meant to be used for gathering general end user feedback for mobile applications.
Series 40 UI Style Guide v5.0
Get an overview of the Series 40 user interface and learn its essential parts. This document is targeted for anybody who needs a general overview of UI design principles for designing well-integrated, consistent, and usable Series 40 mobile services and applications. Updates in v5.0 include: Resolution 320 x 240 and QWERTY keypad support, and minor changes throughout the document to reflect the latest Series 40 changes.
Web Design Guidelines for the Nokia N900 v1.1
This document contains information and guidelines for web developers who want to ensure that their pages work well with the Nokia N900 with Maemo 5 OS. In version 1.1 of the document, information about portrait orientation has been added.
Flowella Tutorial
This document provides a tutorial on installing and using Flowella. In addition, it describes the features of Flowella in detail
Graphic Optimisation
This document contains graphic optimisation tips for mobile design and development. It covers optimising the use of graphics in the browser, in native applications, within Flash Lite, and within themes.
Personas 101 - Using Personas to Craft a Superior User Experience
A persona is a character involved with your product or service. Creating and using personas during the design and development process can help your product in many ways, and reminds you that you are designing for real people.
Flash Lite: Transitions
This document describes how to create certain transition effects in Flash Lite 3.x for applications compatible with the Nokia 5800 XpressMusic.
Fremantle Master Layout Guide v1.1
This document introduces the exact layout and graphics of Fremantle. It discusses all layout-related topics, including margins, dialogues, text editors, and colours. For detailed instructions on how to use the colours in a logical manner, refer to the Hildon 2.2 Widget UI Specification.
Maemo 5 Desktop Widget UI Guidelines v1.1
This document explains how to build consistent and user-friendly desktop widgets following the design philosophy, interaction model, and visual look-and-feel of Maemo 5. This document is complemented by the Fremantle Master Layout Guide and the Hildon 2.2 UI Style Guide containing visual guidance and references, as well as by the Hildon 2.2 Widget UI Specification containing interaction and technical background information.
Hildon 2.2 UI Style Guide
This document gives an overview of the Hildon 2.2 UI style for Maemo 5. It explains the user interface principles and provides guidelines and recommendations to ensure that all user interfaces designed for the platform offer a similar and consistent user experience.
Hildon 2.2 Widget UI Specification
This document specifies the Hildon 2.2 widgets, following the Hildon 2.2 UI Style. For more detailed information on the UI style, refer to the Hildon 2.2 UI Style Guide. The exact layout and graphics are defined in the Fremantle Master Layout Guide.
Redesigning from Maemo 4 to Maemo 5
This document describes how to redesign a Maemo 4 application for Maemo 5, that is, the Hildon 2.2 UI Style. The Modest email client is used as an example application. For detailed information on the UI Style, see the Hildon 2.2 UI Style Guide. For detailed information on the Hildon toolkit widgets, refer to the Hildon 2.2 Widget UI Specification. The exact layout and graphics are defined in the Fremantle Master Layout Guide.
Guide to Flash Lite Components
The purpose of this document is to describe a generic process for creating, using, and customising Flash Lite User Interface and Data components (that is, S60 Platform Services). This guide focuses on the methodology and processes as a whole, rather than the implementation details and practices of individual components. The document is targeted at intermediate users of Flash and ActionScript from Adobe. This document is closely related to Flash Lite Components.
Advertising in Mobile Devices
Advertising is often the most useful way to profit from mobile applications or Web sites. This article provides guidelines for effective, user-friendly mobile advertising. The guidelines are divided into three subcategories: General, Placement, Content and Context, and Taking care of the user.
