Best Design Practices for WeChat Mini Programs
In general, Mini Programs are designed for users to duck quickly into and out of them to do specific tasks. So your user interface should be simple and easy to understand instantly for occasional users.
Avoid anything that requires users to leave and return to your Mini Program. They should be able to accomplish all tasks in one quick session.
Be sure that key elements of your Mini Program – such as crucial images, content, menus and interfaces – do not require a user to be online.
Do not try to replicate the functionality of your native app. Instead, keep your Mini Program focused on offering your core features only, and direct users to download your native app for additional features. Depending on your app, you may also consider creating multiple Mini Programs that offer different sets of features.
For example, a traditional restaurant application and ordering app may offer restaurant search and reviews in one Mini Program, while confining the ordering features to a separate one.
In fact, if you reserve high-value tasks for your native app, it provides a strong incentive for users to download your native app and increase your DAU and organic reach. In this way, your Mini Program acts as an effective marketing tool for your core offering.
Do not deviate from established Mini Program and WeChat conventions. Consider simplifying your navigation to single level, in which users can move horizontally forward and backward. Your navigation should be obvious. Keep a back button in your app on the top bar, as the standard back button on the Android phone will cause the user to exit the Mini Program entirely, causing frustration for users who accidentally tap it to go back. Study other Mini Programs and try to emulate their style to avoid reinventing the wheel.
Test on as many different screen sizes and orientations as you can to make sure there are no content overflows. Also test on both iOS and Android devices.
Remember that users who don’t often upgrade their WeChat app and/or device operating systems may experience errors with your program. To avoid them getting a blank white screen (otherwise known as a WSOD – White Screen of Death), have a good error handling system in place. In the backend, you can select which WeChat version
Leverage the sharing abilities of your WeChat Mini Programs by including a well-composed sharing card and easy-to-see sharing options in the upper-right menu (where it normally appears). If you create additional value for users who share, it will incentivize and encourage users to spread your message and program. Take advantage of your ability to customize the Call To Action in these cards for each instance.
Add a pop-up notification to remind users to save the Mini Program to their favorites, so they can easily access it later. Users may forget to do this otherwise.
Add login walls only where they are truly needed. Users may exit your Mini Program immediately if the first thing they see is a prompt to log in before they can do anything else. A good rule of thumb is: If you don’t need user information, don’t ask for it.
Use a simple, minimal “skeleton screen” that loads instantly while a user is waiting for your Mini Program to load. Also consider add a loading bar that clearly shows the user how long they will need to wait. Both of these tools help reduce bounce rates for users with a slow connection.
Use the WeChat API to preload users’ information into forms, thus saving them time and increasing the value of the Mini Program.
AppInChina builds WeChat Mini Programs for our clients.