Client Interaction Design: Mobile platform client UI design

Source: Internet
Author: User
Tags interface return client

Article Description: client UI Design for mobile phone platform competition.

1. The current mobile phone platform to contend

In order to occupy the commanding heights of mobile Internet, several big it giants are competing on the basis of mobile phone platform. Occupy the mobile platform is to occupy the user's mobile desktop, but also for their own mobile services to achieve the best position.

Microsoft launched Windows Phone 7, exposed Windows 8, Apple also opened iOS 5, Google's Android 3.0, Android 2.4, and so on, and everyone is trying to improve the platform experience. In addition, HP's Web OS, BlackBerry companies are also in the development and release of a new platform, but also caused the industry's great concern.

From the current market share and the future trend of development, the client adaptation, mainly to consider iOS, windows,android three system-oriented, other systems in the domestic still difficult to occupy the mainstream, here do not explain. Android mobile phone growth is the fastest, iOS mobile phone in the domestic occupancy is also growing fast, good news is also constantly, telecommunications, mobile are talking; Windows mainly look forward to the future cooperation with Nokia, the prospects are not small.

Therefore, in this article, the interactive features of these three main platforms are briefly introduced to help peers who are just engaged in client interaction design to understand their basic features faster and to facilitate clients that can develop a better experience.

2. Features and advantages of each platform

1 The hardware characteristics of the platform

A) The key to the platform

Mobile phone button is the system itself, the platform will be the function of the key to the system's client applications, he is also a natural integration with user operations.

Mobile phone buttons are generally divided into two categories, function keys and navigation keys. Function key is designated as a specific function, the user press, triggering the corresponding function, general and screen content is not very relevant, such as camera key, just start taking photos, in other clients basically invalid.

The other is the navigation key, has been given a specific logic rules, her operation and the screen has a logical mapping relationship, but the operation and the operation of the object separation, the user button, in the screen to get the corresponding feedback. If "Back" is mapped to return to the previous page, after clicking "Back", the contents of the screen are returned to the previous page.

The function key can start the function directly, its influence to the interaction is not very big. Navigation keys are an important part of interactive design. Major attention should be paid to the following points:

(1) The interactive navigation design of the client should support the operation of the platform navigation key. Whether or not you have virtual buttons on the screen instead of the buttons already available, you should also support the navigation logic of the system keys.

(2) The client uses the function key of the platform, and should support the operation of the function key. For example, if you need to adjust the volume in the client, you should support the system volume key to control it.

(3) All clients must be consistent in the operation of the key, do not use each other freely.

b) screen adaptation of the platform

Because different platforms are very open, different platform products for the size of the screen design is not the same, some have only a small size distribution, and some have a lot of different sizes, which brings a lot of problems and difficulties in adaptation. Screen adapter design See my previous blog post.

c) Other hardware supported by the platform: sensors, screen features, etc.

When the iphone was pushed out, it quickly swept the world and created an era of innovation (others say the iphone itself was not a revolution, but he created a revolution), and in addition to the design itself, the rational use of several sensors has made a contribution. Mainly include the acceleration of gravity sensors, gyroscopes, proximity sensors, electronic compass and so on. These sensors in different scenarios, creating a lot of unique experience, greatly enhance the mobile phone's accessibility.

Different platforms or mobile phones support different sensors, and in the design of interfaces, they also need to consider the popularity of their support on different platforms, as well as the relative substitution design that can be provided when they are not supported.

2 interface characteristics of the platform

A) application of the entry form

The application's startup portal refers to the interactive interface and operation form of the user's startup program. On different platforms, there is a big difference between the start-entry operation and the interface, which is the first impression of the platform features. At the same time, different platforms and mobile phone companies in order to make the brand image more prominent will also be here more fuss.

From the interaction features, the application's startup portal has the following characteristics and points of attention:

b) The basic structure of the page

The basic structure of the page determines the main style of the mobile phone interface, in order to show the difference and style of design in different platform, the layout of the interface is different. However, overall there is no real difference with iOS, mainly in a slightly different form.



Windows Phone7:

Android's handset makers have changed the interface of the native system, and different Android phones have different displays on the interface. In the design of the Android client itself, a lot of it was ported directly from iOS, leading to more differences. But in any case, the interface operation and navigation logic should conform to the characteristics of the platform itself.

In the design of the frame, I am inclined to put the most core operation on the bottom, user-friendly operation of a single hand. iOS design put the navigation button side in the upper left corner, away from the thumb of the operation area, is easy to cause the user to unload "machine", but also affect operational efficiency.

c) Main navigation features:

Navigation as one of the main interactive characteristics of a platform, there are large differences between different platforms. The logic of iOS is so tightly designed that all applications are self-contained and natural; In contrast, Android is a product of a hybrid of iOS and Android designers, and the navigation system in different applications is chaotic and less systematic; Windows Phone 7 's navigation is displayed on the interface, The title uses the Panorama form, is really the alternative, the self-contained system.

Here the main talk about the different platforms under the navigation keys, Title and tab, return logic, a few small points out of the program.

d) menu and Operation form

These are the most advanced mobile platforms at the present level, and are all based on the touch of the fingers of the direct interface. iOS offers only direct manipulation, and Android and win Phone 7 also add a few hard button buttons to work with, but the overall is direct operation. Several platforms have menu operation, but the form of display is different, but also in each other's reference.

Because the handset screen is small, a screen content often displays an object or the information Unit, the toolbar operation is precisely this unit carries on the operation. If you are manipulating objects within a unit, more design is to set the action object directly in the interface (such as the action button inside the screen).

e) Information Tips

The information prompts the way, each platform also is learning mutually. As the core design advantage of the Android system, information list is now being used by iOS5. At the same time, many Android phones and lock screen applications in the lock screen interface and the message to do more balance, so that users can process information faster, improve efficiency.

Each platform provides the form of a dialog box, only slightly different in terms of name, such as Alert,popup,dialog,raw notification, the main interaction is not different, is the basic operation of the dialog box. There are also some variations in feedback boxes, such as the fast disappearing feedback tips provided by the Android system, made lightweight and less disruptive to users.

The status bar message prompting mechanism provided by the Android system is a very innovative design for dealing with multiple application push information, which can be said to be the best design of the Android system. In any interface, users can quickly move down the status bar to exhale the information list, or they can move their fingers up and down. However, it is in the column that the update features are also seen on the recently seen iOS5. So, there are good features, different platforms will learn from each other.

iOS also has its innovative hints, is in the program icon to carry out a new message number of hints, which in the back of several platforms have applications, but on different platforms, the form of a slightly different, is the visual micro-innovation.

Windows Phone 7 provides a tile form of informational display, which is only different in style, and is not very significant in the nature of the design.

Specific can see Zhong Lei Bowen, "mobile phone system message notification design collation and analysis"

3. Mobile applications in the principle of multi-platform adaptation

The planning of a product will rarely be limited to a single platform and will be adapted across platforms. So how do you fit in?

There are two main points of view, the device-centric design or application-centric design; the equipment-centric designers believe that the application interface should be consistent with the design specifications of the equipment, so that users can quickly start, do not feel unfamiliar. Application-centric designers believe that the consistency of all platforms, while many multi-platform application development tools for developers to provide a platform for the portability of the interface, but the user experience is good, but it remains to be thought.

The following principles are followed in the multi-platform adaptation

1 The design specification of the client should be based on the platform specification

2 in many platforms, should maintain a unified brand identity, including logos, visual style, core function points and so on.

3 more with the characteristics of the platform integration, the use of features provided by the platform to reduce user input or other experience points of improvement. such as camera input, the use of sensors and so on.

The issues to be noted for each platform are:

1 mobile characteristics determine the strength and weakness of the mobile phone signal, how to deal with the design under the weak signal?

2 need to consider how to quickly restore interrupts in the case of a disconnected network?

3 How to design the problem of mobile phone push?

4 How to avoid the inherent limitations of the mobile phone, such as small screen, input inconvenient, power tight and so on?

5 How to improve the experience through the unique characteristics of the mobile phone, such as various types of sensors, voice prompts and so on?

4. PostScript

When I made an outline from March to write this several articles to now, but in just a few months time, each big company's mobile platform has introduced the new version, to the platform characteristic summary speed some cannot catch up with the platform renewal speed.

In essence, iOS is a groundbreaking design, but also caused the climax of the client, the other platform has not been off the traces of iOS, although the major companies are trying to innovate to form their own style, but is far from the creation, the degree of revolution.

In addition to these three major platforms, Blackberry,palm webOS is also in the release of new products, experience is not inferior to the three platforms, in the design of the client, it is worth more research one or two, perhaps the mainstream platform will be a bit of their copy, you are also for your new design to do knowledge reserves.

From the client interaction design, we have to do is how to play the characteristics of the platform design advantages, the client experience to do a good job, rather than to change the design characteristics of the platform. Therefore, do the client design designer, need to always pay attention to the platform characteristics of the update, this is your opportunity to enhance the client experience.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.