22 Basic principles of page layouts for app interface design

Source: Internet
Author: User

The mobile App page layout is the main design task when we design the app interface. The good and bad of an app, much depends on the rationality of the mobile app page layout.

The image below is the most primitive layout model of the app.

The page layout, as the name implies, is to arrange and design the text, graphics, or tables of the page. Excellent layout, need to take full account of the page information. That is to consider user needs, user behavior, but also to consider the purpose of information publishers, goals.

There are a number of principles and methods to cater to and guide user behavior, such as the following 22 basic principles:

1, the Company/organization icon (Logo) in all pages are in the same location.

2. All data content required by the user is displayed in the order of priority.

3. All important options are displayed on the homepage.

4. Important entries should always be displayed.

5. Important items to be displayed at the top of the page in the middle position.

6, the necessary information should always be displayed.

7, messages, prompts, notifications and other information appear on the screen easy to find places.

8. Make sure the home page looks like a home page (make the page different from other level two or three pages).

9, the length of the homepage should not be too long.

10, the app navigation as far as possible to use the bottom navigation way. The number of menus is 4-5 best.

11. The length of each app page should be appropriate.

12. Use the clickable "Content list" on the long page.

13, the special navigation page to short (avoid scrolling, so that users can browse to all the navigation information, there is a global view).

14, priority to use paging (rather than scrolling).

15, rolling screen should not be too much (the longest 4 full screen).

16, need to read carefully understand the text, you should use the scroll screen (and non-page).

17, provide the title for the framework.

18. Note the width of the plate in the home page.

19. Place the first-level navigation in the left panel.

20, avoid horizontal scrolling screen.

21. Whether there is enough space around the text area.

22, each article is reasonable classification in each logical area, and uses the title to divide each area clearly.

These app interface layout principles guarantee the most basic usability of the page in terms of layout. is very suitable for novice app design to master.

"App layout case appreciation and interpretation"

The above 22 page layout principle is related to the user's eye tracking research. Can be said to be based on the source.

Eye movement research is a kind of user research method which emerges with the rise of user experience and the progress of technology equipment. It is the eye movement technique and the research method two in one, through the eye Movement study observes the subject to the mobile application page The gaze track, assists completes the user experience design.

Through the eye movement research, not only can restore the subjects ' gaze track on each page, but also can analyze the subjects ' attention in the area by dividing the interest area.

The information provided by eye movement research is not just how people "see" things so simple, eye movement reflects the human brain's information processing process, the characteristics of the eye movement pattern and brain information processing are closely related.

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: info-contact@alibabacloud.com 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.