Get the App
SLTechnology News&Howtos  ›  Development  › 

What are the normative problems in the design of Mini Program

Shulou Source: shulou.com Published: 2022-06-01 05:16:37 10月04日 Update

This article introduces the relevant knowledge of "what are the specification problems of Mini programs design". In the operation process of actual cases, many people will encounter such difficulties. Next, let Xiaobian lead you to learn how to deal with these situations! I hope you can read carefully and learn something!

Mini programs design area

The menu of Mini programs is fixed in the upper right corner of "All Pages" of Mini programs, and the space in this area shall be reserved when designing the interface.

Nav Bar Design

1. Mini programs menu fixed style

WeChat provides two color schemes, light and dark, so as to better integrate into various styles of pages. Attention should be paid to keep the menu of Mini programs clear and identifiable.

2. Interaction considerations

If you want to place interactive elements near the menu of Mini programs, consider whether there are interactive conflicts and try to avoid the possibility of accidental touch. It is suggested that the self-navigation style designed by developers should be different from the menu style of WeChat official Mini programs to distinguish them.

3. Search box common forms of expression

Tool Bar Design

1. Mini programs design specification

The top tab tab color can be customized and will generally follow the design style of the App to ensure visual uniformity between the two platforms.

2. Common forms of expression: color background bar, slide up hide, borrow separation, icon display, card shadow, etc.

Tab Bar Design

1. Mini programs design specification

WeChat provides the bottom label style of Mini programs. It is suggested that the number of labels should be 2-4. You can also select or remove the bottom tab bar function according to product needs.

2. Common forms of expression

Startup page icon_Except for brand Logo, other elements of startup page are uniformly provided by WeChat and cannot be changed. Designers only need to provide Logo with 2 times and 3 times size.

load style

1. Mini programs design specification

Global Load is the load icon to the left of the name of the Mini programs. The modal loading style will cover the entire page. Since it is impossible to clearly inform the specific loading location or content, it may cause user anxiety. It is recommended to use it with caution.

2. Common loading styles

It is necessary to inform the user of the specific loading position shape to reduce user anxiety.

Mini programs should be designed to be friendly, efficient, and consistent. Each page should have a clear focus, clearly telling users where they are and where they can go, ensuring that users can navigate the page without getting lost.

"What are the specification problems of Mini programs design" is introduced here. Thank you for reading. If you want to know more about industry-related knowledge, you can pay attention to the website. Xiaobian will output more high-quality practical articles for everyone!

Tags: Design style program program user menu page tag location content icon common suggestion form problem anxiety element bottom more knowledge Apple Docker Huawei Linux macOS MariaDB Microsoft MySQL NVidia OPPO Reno Linux Shulou Technology MySQL Shulou Tech Info OPPO Reno