Design principle of small screen interface for mobile phone

1997, it is a spring, an old man in the South China Sea drew a circle, this circle is painted in our big Shenzhen! The circle of people is comrade Xiaoping.

2014, or this spring, the popularity of mobile devices has become a http://www.aliyun.com/zixun/aggregation/6298.html "> The development of the Internet again, we have a variety of small screen painting one after another circle, Today, the user's mobile experience has no intention of getting better because more and more web sites are already being designed for mobile devices, and designers know what's better for small screens. However, there are still many hurdles to performing task operations on the phone.

Dear Friends of the Base division if you are troubled by this, please pay attention to the following moves:

First of all, even if the 4G download time problem persists, then users hate the need to download a large number of websites because they need to pay for it, and once again, even experienced mobile users, they have no difference from the average person when they access the full web site via mobile. This means that users still have a high failure in the entire mobile experience.

If viewed from the equipment, the current market major mobile devices can be divided into: functional mobile phones, smartphones, full-screen mobile phones.

(Note: Functional mobile phone: is the basic function has, does not have the function expansion or the rare expansion of the handset, its biggest difference is the smartphone. Functional mobile phone general standby time for the president, more stable.

Smart Mobile: Refers to the same as a personal computer, with an independent operating system, independent operation space, can be installed by the user's own software, games, navigation and other third-party providers to provide the program, and through the mobile communication network to achieve wireless network access to such a class of mobile phones collectively.

Full Screen mobile phone: Also can be called touch screen mobile phone, the biggest feature is its oversized screen, using touch screen technology, the technology applied to the mobile phone screen above an intelligent mobile phone. Is the most popular mobile phone class. ）

To achieve higher user performance, you should design a different experience for each type of mobile device: the smaller the screen, the less functionality, and the simpler the design should be.

When designing for mobile devices, focus on two points:

1. Content and navigation is clear enough, users do not have to spend the cost of learning.

2. Design for small screen and slow download speed.

These two points explain why all mobile Web sites must be made according to the characteristics of the target site.

The space of the inch gold--mobile screen is so small, you so waste space your mother know?

Figure II shows a way to show more news, this is the actual use of people. Figure A compared to more user-step operation, although good-looking but flashy. Why do users prefer ordinary and somewhat uninteresting designs in their daily use? This is because the design allows the user to see more content at a glance.

The second case is the successful waste of the ipad's screen space, which allows most of the weather information to be densely packed at the bottom, while most of the screen space is decorated with a pure picture, so the default design is tedious.

The same data if there are two different rendering is a bit redundant, usually the designers do not know which is more suitable for users, so give two solutions, let users choose for themselves. Using two interfaces for data, the only logical scenario is that the two data need to be emphasized in two different directions.

The group's interface has a list view and a map view, which allows users to view different directions, including detailed information and prices, while the map shows the location of the restaurant.

There are two displays in the ibooks, but you will find that one interface is obviously superior to the other. It turns out that the list interface makes it easier for users to identify books and authors, or to make quick searches with titles, which are sorted alphabetically by letter and not in the bookshelf. The existence of a large number of books, through the book cover quickly find the possibility of the lower end.

A virtual design element is a command that provides information about the content of the screen, or the operation of the content, like a user. These virtual elements are usually provided by the underlying system. For example, the PC side of his virtual element is a variety of PC instructions such as taskbar, System Tray area. The menu bar, toolbar, and so on in the Software PS tool.

The cost of using these virtual elements on the mobile side is obvious, they take up space, and the area that compresses the content.

You'll find these virtual elements in figure one that make the content less effective, but also as the system's own elements stack up, the accumulated virtual elements usually occupy half the screen space. It is also dangerous if we hide these elements temporarily, because the user is often ignored for invisible parts. What's to be done?!!!

In fact, as long as you treat them kindly, they will return you with a better gesture:

1. Consider the simpler and more effective design of these virtual elements

2. Provide consistency from beginning to finish, let the user remember you these virtual operations are in hiding state, and his operation can repeat this pattern continuously. 3. Contextual hints and incremental exposures reduce the complexity of concealment through the spread of content.

The path is hidden from the early days of the menu, and long-term use fosters a user's awareness of the virtual element. And you need to repeat that in the process.

Reader default state tool is hidden, users can understand the page through the text scattered, click on the screen to exhale tools.

Just imagine that if you have the space to use well, but the waiting time is very long, users will not forgive you. Therefore, when designing for mobile devices, it is critical to minimize the cost of interactive processes.

1. Let the operation streamline words, the need to download less interface the better. For example, if the content is already stored on the phone, it does not need to download information from the server.

2. Load only the information that is needed, that is, the value information that is useful to the user.

3. Do not misuse pictures. The more pictures, the slower the download speed. PS: Perhaps this is one of the reasons why flattening is prevalent at the mobile end.

4. Provide feedback to users. For example, your download to what kind of state, need to let users have a knowledge, so although not completely solve their interrupt operation, but can slightly alleviate.

Solve the above problem is not to be able to retain users, improve the success rate? Not also ~ ~

Please look at the last resort!

One of the most important principles of mobile applications is to avoid allowing users to register in the first step. Because the initial users of such products did not establish a perception and goodwill, in the initial requirements of the user registration is wrong. It's important to keep in mind that the user has a low level of commitment to your application at the beginning. Unless you're really awesome and popular, it's worth registering.

Let's take a look at a couple of cases here: