Product managers must be aware of the interaction design differences on the three major mobile platforms

IOS, Android, and WindowsPhone are currently the three mainstream platforms on the mobile Internet. I have also participated in the design of these three platforms. In the design process, due to the different features of the three platforms, role switching is often required and the change of mind is constantly involved. Maybe new users and Outsiders think there is no difference between iOS and Android. Some even use Android to directly copy the iOS design. Some may still find the WindowsPhone platform magical, but they cannot find out how to do it. Today I have summarized the differences in interaction design between the three platforms. During the interaction design process, you must pay attention to the following issues:

1. Differences in Layout

IOS classic "tab bar"

In iOS applications, if you want to switch between different modules or different columns on the page, you will often use the "tab bar" control. This classic design has been used since the early days of iOS,

Most iOS applications are designed in this way. Of course, ios itself is very inclusive, and drawer navigation is also popular recently. However, the tab bar has always been the most popular and preferred way to be recognized by users:

Android provides two View Control Modes

After Android was standardized, Android proposed two view control methods. One is to add a touch button directly under the title of the navigation bar. After clicking this button, a menu for switching the topic will pop up.

(Positions marked in figure 2)

(For example, after clicking a calendar application, you can switch between different views)

In addition, a view control bar is directly added under the navigation bar, which is similar to the tab bar of iOS, but is only placed on it. It also supports gesture slide switching:

(2 in the figure below)

WindowsPhone Innovation

WindowsPhone is very different from the two platforms above, because WindowsPhone's unique MetroUI advocates returning to the traditional reading experience and browsing the content on mobile phones like newspapers and magazines, focus more on and content rather than modification. Therefore, WindowsPhone provides a feeling like reading a magazine.

WindowsPhone's View control is expanded in a way called "panoramic view ".

In fact, the content of the four views is on one page and loaded simultaneously on one page. By default, only the content on the first screen is displayed on the user's mobile phone, and the content behind the screen is pulled out by sliding ~

This kind of view method is innovative and easy to read. I have to say that the browsing experience is much better. However, note the following:

1) because these three columns are in the same page view, do not put too much content; otherwise, loading will slow down and affect efficiency;

2) The layout and vision in the interactive design process are highly demanding. (You have to think about how the Layout looks good in advance)

In addition, WindowsPhone also provides a pivot method. The tab bar of pivot and iOS is not very different, but it is completely switched by sliding:

(Pivot layout)

Ii. Differences in navigation Logic

We all know that iOS does not have a solid return button, and all returns are completed through the back button in the navigation bar.

In the navigation logic of iOS, we can clearly see that the entire program is a one-page switch, just like a slide. The return button switches to the previous page. Therefore, iOS return controls the page.

However, Android and WindowsPhone are not like this. Android and WindowsPhone have physical return buttons. Clicking physical return buttons not only controls a page, but also includes operations in the previous step, for example:

Go to page A and click the text box to bring up the keyboard. Click the return button to hide the keyboard.

Therefore, the return logic of Android and WindowsPhone is determined by the time stream, not just the page. the return button controls the action.

Specifically, the return logic of WindowsPhone is not limited to applications, but also affects applications. That is to say, you are currently on the desktop, and click back again to enter the application you opened last time.

In addition, in Android4.0, an upward concept is proposed, that is, a small arrow in front of the navigation bar title. Click this arrow to return to the previous level on the page:

3. Differences between applications

As we all know, iOS is a closed system, while Android is an open system. Every app in iOS is a small room, And every app is doing its own thing in its own room, so there is no interaction between each other. Android is a big office area. Although each application has its own station, it can communicate with each other or borrow something, while WindowsPhone follows the same way as iOS. When iOS6 is reached, applications can jump to each other directly. However, if you jump out, you will not be back. That is to say, you are the person in the room, it is not associated with the previous room.

This difference means that the permissions of iOS and WindowsPhone applications become very low. As an application, you cannot modify some system attributes (unless it is jailbroken) or modify the content of other applications. An Android application can not only control some operations of the system, but also control other applications to perform some specific operations.

This difference makes application design on Android more likely. As a designer, you can design many good functions based on this feature, such as system beautification or system optimization and anti-virus, intercept calls and other functions, but iOS and WindowsPhone cannot.

However, this makes the Android system face severe security issues, so various optimizations and anti-virus software on Android are very popular.

Iv. Differences between multiple tasks

The difference between multitasking is described in one sentence: iOS and WindowsPhone are both fake multitasking, while Android is real multitasking.

If the app you designed has been downloaded, iOS and WindowsPhone will be suspended after being switched to the background, while Android will not pause. You can also design some functions that are secretly running in the background!

5. Difference in resolution

Do you know how many resolutions are available for Android?

Adaptation has always been a headache for Android. As a front-end, it is often necessary to adjust the effects of different resolutions to ensure that the interface will not be distorted or blurred. The resolution issue not only affects the visual aspect, but also has a great impact on the interactive design. Because the screen proportions of these mobile phones are often different, you need to consider the layout of your interface under different aspect ratios.

Therefore, when designing Android, you cannot overwrite the interface layout. You should try to ensure that every control is floating, and you can evaluate the effects of various odd la S.

IOS and WindowsPhone will be much better. IOS resolution is divided into 320x480,640x960,640x1136, WindowsPhone resolution is divided into 480x800,720x1280,768x1280. Although it looks quite a lot, the proportion of the interface is basically unchanged. Therefore, the layout on the interaction is not very significant. visual designers can also use scripts to narrow down the la S and simply solve the problem.

Vi. Differences in Design Style

The design style is the unique personality of the three clients. The design style not only affects the visual design layer, but also plays an important role in interactive design. Especially when considering the dynamic effects and quasi-materialized interactions, pay attention to them.

IOS's design style tends to be quasi-materialized. This quasi-materialized style is not only used to visually make small-button widgets for many quasi-things, you can also add interesting content for interaction.

For example, like the latest path, when you enter the store, the sun visor will have a collapsed effect, and the small card will swing according to gravity sensing. If the interaction can reflect the design style of the platform, it will undoubtedly favor users and increase the product details.

The Android platform is simpler. When the overall layout and interaction form are similar to those of iOS, try to be concise and present a sci-fi style. The Android platform should use less quasi-materialized animation effects as far as possible, because the Android system is relatively poor in rendering the animation effect. If it is too complex, it may make the Interface Very card.

I strongly recommend a fuubo application. It is a very innovative product that conforms to the Android Holo style and handles interactions.

The WindowsPhone platform is quite different. The concept of MetroUI requires designers to consider how to present content and use Smooth transition animations. It also puts forward some tests to the designer's layout and plane design. Therefore, it is recommended that the interaction designer read the WindowsPhone Interface Design Guidelines and accumulate some visual interface feelings on the WindowsPhone interface. Otherwise, the visual designer may blame you !~