Guidelines for Perfect Mobile Design
Aditya Kumar | 23rd April 2020
While designing Mobile applications we should take care of the small things because those small things make a good User interface. I am sharing some of the basic mobile design aesthetics which we all should use for better results.
There are following points need to take care while mobile design:
Reach Area
Thumb Reaching Zone: How easy to reach our thumbs to tap areas on a mobile phone’s screen.
Hard to reach
Reaching this area requires uncomfortable finger movements and a lot of stretching
Okay to reach
Reaching this area requires some stretching. Can be hard for users with small hands
Easy to read
Reaching this area is very easy on nature and does not require stretching.
Platform Guidelines
We have to use the right design system for iOS and Android. Both iOS and Android have a different user base. Also never carry UI Elements from e platform another.
Apple’s Human Interface Guidelines
We are already aware of the In-depth information and UI resources to designing pixel-perfect applications to integrate seamlessly with the Apple platform
Guidelines Material Design
Material design is an adaptable system of guidelines, components, and tools that support the best practices of user interface designs for android.
Think device first
First, we have to be aware of the “unsafe areas” (notch, camera punch-hole, etc.)
Unsafe Area
Be careful when designing in these areas, you should not include menu or tab elements in there.
Safe Area
Everything within the “safe areas” will be visible on different device screens.
Font Type and Font Size
Every font can evoke different emotions and provide easy readability at the same time.
Typeface
We have to choose a typeface that works well in multiple sizes and weights to maintain readability and usability in every size
Font-Size
Use legible font size. The text should be at least 11 points so a user can read it at a typical viewing distance without zooming
Contrast
Use contrast checkers to prevent color problems, also use 60-30-10 rule which refers to an ideal proportion that is meant to reach a balance among colors
Call to Action (Buttons)
We have to design finger-friendly buttons because Mistaken taps often happen due to small touch controls
Create controls that measure a minimum of 10-12mm (40px) in order that they are often accurately tapped with a finger.
Read more: How To Enhance Your Website’s UX Design For Ultimate Conversion Rate?
iOS
Apple recommends a minimum target size of 44 pixels (px) wide 44px tall.
Android
Google recommends a minimum target size of 48 dp wide 48 dp tall
Long Scroll Problems
Keep screens as short as possible, using cards with a tap to extend feature or by breaking tasks into screens
Tab bars
Tab bars are very important for every app, We have to design clear and clean tab bars also name all tabs whenever possible for better user experience.
Gestures
Tap or swipe mobile gestures? It is very important to choose the right gestures because if sometimes using the wrong type of gesture can lead to a broken UX.
Tap Gesture
Select or submit
Activate
Toggle on/off
Cancel or escape
Enable or disable
Swipe Gesture
Scroll
Pan
Dismiss notifications
Refresh
Paging
Conclusion
In this blog, I have mentioned a few important rules for perfect mobile design to improve design skills. I hope you’ve learned something from this post and found useful tips for your design skills.
