Windows 8 phone ui guidelines

Have you ever wondered how much detail goes into designing a desktop or mobile interface? These user interface guidelines will give you insight into how the top tech companies design. By adopting a systematic approach to design, these companies are able to deliver a stable and consistent user experience on all their devices.

Apple Human Interface Guidelines. Java Look and Feel Design Guidelines.


  • joikuspot premium cracked nokia e71.
  • UX/UI Guidelines for Windows Phone 8.
  • Understanding the Windows 8 user interfaces | Gizmo's Freeware!
  • Metro (design language).

Android User Interface Guidelines. Palm User Interface Guidelines. Author and founder of UX Movement. Creating a better digital world for mankind by teaching and evangelizing best practices, standards, and techniques in user experience design.

Thanks for this. Your email address will not be published. Leave this field empty. They should fit in with the look and feel of other items in the Start menu.

A window to the world

Avoid using relative time stamps or dates eg. This is a static statement and will become inaccurate as time progresses. Instead, use an absolute date or time eg. The user should always be taken off to Internet Explorer on the device. Single buttons should be left aligned and multiple buttons centre aligned.

25 Best Mobile App Design Guideline images | Design guidelines, Mobile app design, App design

If this happens, either replace the image, or apply a semi-transparent black or grey layer over the image. If brand guidelines insist on a different case, then ensure that the use of the case is consistent across the app. Custom typefaces can be used for page titles or panorama section titles. Segoe WP should be used everywhere else. WXGA assets have the highest quality, and they automatically scale to work well for other resolutions.

Multi - resolution apps for Windows Phone 8. Users recognize certain icons to mean certain things, either because they are used elsewhere in the device or because they are commonly associated with something else. For example:. Do not repurpose existing icons. This includes its behavior when implementing secondary tiles please refer to section 4.

How to Design UI for the iPhone X - Adobe XD CC 2018 Tutorial

They are designed to allow quick and easy access to content and are generally not used as an entry point for exploration. For example, a pinned album from music and video will play the album when tapped. The tile serves as a specific purpose — go to the album and play it. Tapping on one of these tiles takes the user into the contact card pivot where they can see all the information and tasks related to that specific contact.

Please do not repurpose existing icons. When a user launches an application by tapping on a secondary tile, pressing the hardware back button should exit the application i. The behavior of the hardware back button should not be altered in any way.

Characters in the Doom...

This effect is available from the Silverlight for Windows Phone Toolkit. Indeterminate progress bar. Never use angry or mechanical tones in the application.

Popular Tags

These are just recommendations from different cases studies that are usually application specific. So, feel free to do what is right for your application taking into consideration some success factions like:. Once you have the basics down and have begun to piece together the visuals for your application, refer to the guidelines in this article. They will help you avoid some of the most common mistakes that I have seen when reviewing designs or during building my own apps.


  • samsung galaxy s3 perfume case.
  • How to design a Windows 8 Metro style app starting from an e?
  • jailbreak nokia lumia 520 download.

Really Awesome! I was just wondering about one thing. You should show "John Smith" in big font with smaller "name" underneath. Content over chrome and all that stuff. Thanks for the great guide! Some of the pictures though, for instance this one media. Any chance of getting that fixed? Cato it opens well on my side, could you check and let me know. Also Kym you are right is about content over chrome. Dina Helmy — Seems that it was either Chrome or the proxy Chrome is passing through at work that caused the issue.

Sorry for the trouble, and keep the great blog posts coming! This is great article. I do have one suggestion. This is awesome piece of an article, it reminds me from a dummy WP developer to be able now implement the guidelines in my application. Dina, can you provide more useful links about UX guidelines for Windows Phone 8? I can't find any other article so objective as this.

Backgrounds - Backgrounds are discouraged.

Understanding the Windows 8 user interfaces

Instead, use any accent colors on the text foreground Layouts - Use text size and color to establish list item hierarchy. Enhancements - List enhancements should not be used unless they are distinct from one another, such as in a menu. Scrollable Content -If you have scrollable content on your page, you should put 95px bottom padding at the end of your content.

For example, here is a simple page that is slightly higher than the visible area: - if the user scrolls to the end of the page, the rubber band effect will come into view and the content will be pulled slightly above the bottom. Gesture Competition - Controls that provide a horizontally scrollable area or take a horizontal swipe gesture are not permitted in the pivot control as the horizontal swipe gesture is reserved for changing pivot pages.

Application Bar - Common actions such as refresh, search and settings should be placed in an application bar. Scrollable Panes - Panorama panes should either scroll vertically or horizontally. Not both. Navigation - Floating buttons should be avoided. Interactive Content - Minimize the use interactive content on the panorama forms, search boxes etc.

Number of Panes - A maximum of five panes are recommended. Background - Panorama controls should have a background.

Learning to speak Metro

Title - The panorama title should be animated. Section Titles - The font size should be larger than the corresponding content. Exceptions to this include: - Panoramas - where guidance Error! Reference source not found may apply. Back Buttons - Back buttons are not permitted anywhere in Windows Phone.

Home Buttons - Home buttons should be avoided as they can prove problematic to the Windows Phone navigation model. Exceptions - Where the user is being taken to a single page for authentication such as with Facebook or Twitter , and no Xauth or similar API is available for the authentication controls to be implemented in Silverlight controls, the authentication can be performed in an embedded web browser control in the application.

Look and Feel - Icons should respect the Windows Phone design style look and feel — simple, one color, and two dimensional. Move backwards through the back stack. Hardware Back Button When a user launches an application by tapping on a secondary tile, pressing the hardware back button should exit the application i.