跳至主要内容

Guidelines on How to Make a Great Mobile App Screen Design

Mobile application market keeps in an explosive growth rate with the arrival of the 4G network era. Which drives the rapid development of mobile app screen design. Meanwhile, the big market also has a great job prospect for designers. How to make their own products stand out in the mobile application market is the opportunity and as well as challenges for UI designers. In addition to the function itself to attract users, the APP interface design also occupies a large part of the factors.

Facing with the serious homogeneity on mobile app screen design and low competitiveness and other issues in the current mobile application market, how the app interface design trend will develop in the future to jump out of the cycle and find new opportunities? Fundamentally, the following points are worth considering:

UI design principles
Mobile interaction design rules
How to judge an APP is good or not

UI Design Principles

mobile app screen design

1. Consistency principle. The consistency principle of mobile phone APP is the visual structure, visual level, visual elements to achieve a unified design. That can help to reduce the user cognitive costs and deepen the impression of the product.

2. Be consistent with the design guidelines for mobile phone systems. A lot of interface design books have emphasized the consistency of the interface design principles. UI designers should also follow the Dos and Don'ts for iOS App UI Design and Android App UI design guide to ensure that the design conforms to the consistency of the operating system. For example, in the IOS System Human Machine Interaction Guide, it is noted that the default font for all IOS system versions is HelveticaNeue.

3. Keep the consistent on the visual structure. Usually, the APP visual structure mainly includes the status bar, navigation bar, main menu, and content area. The main menu usually appeared in the top of the interface, so we must follow this principle to put it at the top. The layout of the other pages keeps a good coordinate to arrange the other components in a proper proportion.

Mobile Interaction Design Rules

mobile interaction design rules

Interaction design rules also apply to the small screens. Before proceeding with the design, designers should take into account the following five major design elements:

1. Goal-driven Design. This allows you to customize the app working process and meet requirements for target users.

2. Usability. The usability principle is emphasized in many design books. It may look empty, but you have to guarantee your application is usable and will bring value to users.

3. Affordance & Signifiers. The signifier is an implication of affordance. With correct signifier, users can easily understand UI element. For example, underlined blue text reminds you it’s a hyperlink, and it can link to other pages when you click it.

4. Learn-ability. Users can instinctively know the function of this mobile app screen design, rather than through complex reasoning to clear the logic of each button, each jump between the pages of logic. Compliance with the instinctive design is the easiest to learn.

3. Feedback and response time.

One of the standards to judge an APP is good or not is from the visual effect. A good mobile app screen design will usually impressive users at the first sight. So the visual effect on the retention of users played a crucial role. As for how to conquer the user on functions, and how to judge the APP is good or not, you can refer to the 14 questions of Julie Zhuo to the product manager.

评论

此博客中的热门博文

Tips on How to Learn UI/UX Design for Beginners

The first thing to understand about  UX  is that it is not simply an exercise in creating a prototype. Many people approach UX entirely focused on prototype creation, but creating a prototype is only a narrow subset of what the discipline of UX has to offer. In this article, I’ll be covering the three cornerstones of becoming and being a UX professional: learning UX, practicing UX design , and cultivating your own UX connection. Part I. Tips on Learning UX 1. A list of classic books and resources for beginners:  Read my list of UX resources for beginners 2. The latest books for designers:  Great books for designers to read in 2016 Free UX & UI Books That Worth Your Reading 3. Listen to useful podcasts:  my blog post about my favorite UX podcasts 4. A list of  UX Design Blogs And Resources You Should Follow , some collections such as  UX — UI Readings  on Medium, and  Inspiration and helpful links for User Experien...

Need-to-Know Skills of UI Design for Mobile Devices

Have you meet some problems on user interface design for the mobile device? For example, small mobile screens? Bad user experience? In this article, I will cover some things you can do to learn practical user interface design ( UI design ). 1. UI design principle Don’t think the practical  UI design  principle does not apply to small mobile screens. Five elements of UI design you should take into consideration: 1). Goal-driven Design. This allows you to customize the app working process and meet requirements for target users. 2). Usability. It may look empty, but you have to guarantee your application is usable. Users don’t like to download a complex app from App Store. Usability makes your product useful and hopeful. 3). Affordance & Signifiers. The signifier is an implication of affordance.For example, underlined blue text reminds you it’s a hyperlink, and it can link to other pages when you click it. With correct signifier, users can easily ...

The 5 Best Free Wireframe Tools for Mobile Apps You Can’t Miss Out

The flourishing of various mobile devices stimulated the explosive growth of the mobile Apps. From the rapid development of the mobile market, we can see it’s an age of accelerating technology on mobile App design and development. One of the most important part during App development is building wireframes which can reasonably organize and simplify the content and elements. Low fidelity is the key feature of wireframes. It will present the design idea and App prototype of the product in a more intuitive and simple way. In addition to saving time, wireframes but also provide great advantages for designers focusing on product user experience. Here is a list of the 5  best free wireframe tools for mobile apps  in 2017. 1. Paper prototyping Pricing: free forever Pen & paper are the total free wireframing/prototyping tools, no matter from the point of time & capital cost, usability, learnability, as well as the practicability. Comparing with  other wirefra...