Skip to main content

Principles & Tips for Designing the Great Mobile User Experience

Mobiles have fundamentally changed the way we live and shaped our everyday activities. With our mobile phones, we can not only access all kinds of content but also accept credit cards, order and purchase, sign digital documents and even lock our front door. These tasks have been simplified thanks to the existence of the smartphone. Mobile phones have many advantages and limitations as well. These strengths and limitations are important aspects of designing the mobile user experience.

1.Small screen


mobile UX design

Despite the mobile UX design trend with a larger screen, it is their small size that makes mobile phones so practical and portable. Compared to desktop or laptop screens, much less space is found on mobile phone screens. Therefore, the screen size is a real limitation of mobile devices. The content displayed on a 30-inch monitor above the fold must be distributed on a small 3-inch screen on five screens. Therefore, mobile users must accept higher interaction costs to access the same information, and rely on their short-term memory to return to information that is not on the screen. It is therefore not surprising that mobile content is twice as difficult to understand.

Whenever you present a new design element or new content on a mobile screen, other things are removed (or disappear under the fold). Consider the opportunity cost of each new item: what does it mean for the user when you remove item B and insert item A? Is element A more important than element B? When designing the mobile user experience, the prioritization of content and functions is crucial.

"Chrome" refers to the elements of the user interface, which are decisive for the use of a page or app. Users who come to a page to find needed information or to do a task can not be scared of the beauty of the buttons, bottom navigation or other design elements. Content should be always interesting in mobile UX design (both on the mobile phone and on the desktop). While content and Chrome can exist side by side on a desktop computer, designers on mobile devices often need to reduce the amount of Chrome to have more space for important content.

This does not mean that Chrome should disappear from mobile devices. It is very difficult to create a usable user interface without Chrome. However, the principle of designing the mobile user experience is that designers have to realize a high content-to-chrome ratio on the mobile screen.

2.Portable = Interruptible


portable


Mobile phones are portable: most fit easily into a handbag and we can take them anywhere. Since we use mobile phones in different contexts and situations, we are more likely to be interrupted while using such devices: an external event in the outside world might require our attention and force us to interrupt our activities on the small screen. The result is that the attention on a mobile device is often fragmented and meetings on mobile devices are short.

In order to design the mobile user experience better, designers should save contexts and make it easy for the user to restore connections to continue a broken task. The mobile app or website should always save the current situation and prepare for such interruptions. In addition, it should try to make the transition back to the app/website as seamless as possible so that the user does not have to repeat any work steps that he had already done before the interruption.

Designing for interrupts does not just mean saving the current state. It also means prioritizing important things and simplifying tasks and interactions. Because the attention is fragmented, you should show users the things they need as quickly as possible. The main content should always come before the details, a simple task can be completed quickly, which is crucial in designing the mobile user experience.

3.Single window


single window

Although some phone manufacturers are attempting to display multiple windows simultaneously on the screen, this type of usage becomes quickly impractical due to the limited size of mobile screens, even with modern phones with a larger screen. The majority of users only see a single window (and therefore a single app or website), the screen can also not be shared (as on a desktop computer) to simultaneously work with two different apps.

Restricting the individual window means that the design of the mobile UX should be independent: any mobile task should be easily done using a single app or a single site. Users should not leave the app (or website) to find information that the app needs but does not provide. Keep in mind that paper and pen can not be used frequently, even when they are available. If users need to transfer information from one app to another, you probably need to copy and paste them (or worse, keep them in memory, which increases the cognitive load), making the interaction more complex and error-prone. Apps and websites should be independent and need no external support, no matter whether they are physical or virtual.

The most important thing to keep in mind when designing the mobile user experience is to make sure it is both useful and intuitive. If the app is not useful, it has no practical value for the user and no one has any reason to use it. If the app is useful but requires a lot of time and efforts, people won’t bother learning how to use it. Good UI and UX designs address design problems.

Read more:

Comments

Popular posts from this blog

Top 15 UX/UI Designers You Should Follow to Flow Out Inspiration in 2018

As is known, design is a rather broad and hard-to-define term. There are a wealth of different responsibilities encompassed by the term designer and design-related roles which have been existing in a wide range of areas, varying from print (publications and magazine) to industrial design (furniture and cars). With new design roles emerging in the industry, job titles like UX/UI designers seem to be confusing for both experienced and uninitiated designers. Before diving deeper, let’s have a quick look on the difference between UX and UI terms. User Experience (UX) designis a concept that has many dimensions and primarily concerned with how the product will feel. To solve a specific user problem, a UX designer will explore many different approaches, as any given design problem doesn’t have one single right answer. By identifying verbal/non-verbal stumbling blocks, UX designers refine and iterate to make the “best” user experience. Here is how Laura Klein (the author of UX for Lean Start…

Professional UX Design Approaches for Building The Best Website

Building a website through UX design approaches is very much like painting or sculptural art, they all take patience, foresight, aesthetics ability, creativity and perception of details. Generally, the website you design represents your company, it needs to be stunning and breathtaking. If you look deeper into the aspects of website building, you can find some core UX features that outstanding websites share. By analyzing the top design trends, we may accurately trace out four major professional UX design methods for website building. 1. Streamlined Navigation By saying “Streamlined Navigation”, I do not only refer to the navigation bar but all others navigations on a larger scale. Not to mention the great ones, a standard website also needs to be of high usability. Besides that, the speed and accuracy of loading are of decisive significance as well. In professional UX principles, the typography should be carefully organized to ensure the best user experience. Links should be highly …

What? You Are Still Doing High-Fidelity Prototype Slowly?

Have you ever spent half a month designing a high-fidelity prototype, but it was denied within a few minutes? So much time and energy have been spent but in vain. I have met similar things so many times. However, such tragedy can be totally averted: the rapid low-fidelity prototype is a wise choice in prototype design.
1. What is a high-fidelity prototype and a low-fidelity prototype? Low-fidelity prototype: it only focuses on functions, structures and processes; it only provides the most simple frameworks and elements; it generally does not provide color, butexpresses itself in grayscale.

High-fidelity prototype: it provides more visual details; it is almost equivalent to a UI effect picture, and only needs to replace the actual data and materials in the development process.

2. Why make a low-fidelity prototype?
In product development, the goal of a prototype is to express its ideas, functions and content, in order to get feedback and improve the product. The most important challeng…