The interactive design of the menu under different platforms should be like

Source: Internet
Author: User
Keywords Interaction design product design user experience
Tags .mall analysis cross design different directions display high

Menu interaction type:

Parallel structure

Linear structure (the menu hierarchy is spread in parallel along either x, y axis.)

Depth Structure (Menu hierarchy advances progressively along the z axis, with one screen displaying only one menu level.)

Cross structure

Menu using x, y, z any two axial combination

Cross, in-depth combination

Use the cross structure to show the main level, the vertical display of other menu levels.

Each platform analysis:

PC platform:

PC platform features:

- High resolution - can display a lot of information on the screen.

- close to people (30 ~ 60CM) - can use small fonts and small icons.

- Convenient and flexible keyboard and mouse - able to support complex, powerful interaction.

in conclusion:

The mouse and keyboard provide the perfect interactive support for the PC platform. Able to complex, powerful interactive design.

On the PC platform, common menu types are parallel and depth structures, as well as a combination of the two.

mobile platform:

Mobile platform features (mainly refers to the popular touch-screen tablet, tablet phone):

- high resolution - but in practice the width of the finger is used as a unit of operation and the text and icons to be operated are large enough to accommodate one finger.

- Close to people (30 ~ 60CM) - You can use the small font and small icon design display (do not need user action) content.

- Touch screen operation - can simulate the mouse click, drag, can not simulate the right, wheel operation. Able to more flexible interaction.

in conclusion:

Limited by resolution, too much information can not be displayed on one screen. So generally use depth structure or cross structure. For example, iphone and other tablet phones, the general use of depth structure; ipad and other tablet PCs, the general use of depth structure or linear structure.

TV platform:

TV platform features:

- Distance from people (2 ~ 3M) - Design, text, icons, etc. than other platforms.

- Operation and input as flexible as the keyboard and mouse - Avoid complicated, complex interaction

- High resolution (up to 1920 × 1080) - More information can be displayed on the screen

in conclusion:

TV screen resolution is high, but enough from the hardware to support the display of complex information. Limited to the operation and input methods, can not design complex interactions, mainly in depth structure and cross structure. Normal human behavior (usually 2 to 3 m from the TV screen) requires us to use larger fonts and icons as the content is presented.

Related Article

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.