Unnecessary feedback, cluttered UIs and bad design language: all habits to avoid when prototyping mobile apps. Learn how to avoid these and more here.
Prototyping your mobile app design before code has become a popular definition process. Why? Among the many advantages, prototypes, mockups and wireframes help you detect and solve flaws in your design early on. But what happens when things go wrong at the prototyping stage of the app definition process? Here we’ll explore 6 mobile app prototyping mistakes and how to avoid them by making your prototyping strategy more effective.
1. Don’t get caught in an endless feedback loop with disinterested parties
Feedback is important. But when the progress of your app is hanging in the balance, bouncing between a slew of not-so-well-informed-individuals, sometimes you need to put your foot down. Effective feedback in web and mobile design is imperative, but receiving input from everyone can be such a headache.
Our advice? Get actionable feedback. Actionable feedback is extremely important in app design. Because of the interactive nature of mobile apps, it’s essential that we observe people using our app, trying to complete the work flow. So how do you go about getting actionable feedback? Test on device. If you can view and test your app prototype on the actual device, you’ll have a much better idea of what looks and works well, and so will your users. With Justinmind, you can simulate your prototypes on web and mobile, and you can even auto-fit your content to really visualize how each design will be seen on each device!
Once you have feedback, put it to good use. Analyze your user results in order to ultimately improve the user experience of the app. Try using a prototyping tool that allows users to review your prototype, as well as make changes to it directly.
2. Don’t try to do it all
When we don’t fully understand what the user wants, we tend to make life more complicated by trying to offer them everything. Be it by cluttering too many elements into the UI or adding unnecessary steps to perform a task, we often go overboard in mobile app creation.
How can we avoid this? By keeping things simple. This doesn’t necessarily mean using a minimalist UI style – although you can. What we’re referring to here is the idea that the user should be able to quickly and easily get to grips with your app, and be bale to perform the app’s main tasks in just a few, simple steps. The best way to go about creating such an app is to keep interaction simple. Forget extra taps and unnecessary swipes. Guide visitors through your app by making links and menus faster to scan. Find the most direct journey from A to B. For example, consider the colors you use and the imagery. Depending on the design style you’re working with, for instance flat or material design, you could try to use colors that provide solid contrast. In this way, the user will be more aware of Calls To Action and the visual hierarchy of elements. The most important thing is to not clutter the interface, as this will only overwhelm the user. And remember, mobile screens are much smaller than desktop screens – so design accordingly.
When testing things out in your prototypes, it’s great when you can keep things consistent. With Justinmind, you can use templates and masters in order to keep things consistent, as well as saving yourself unnecessary rework and repetition of basic UI elements. Why repeat actions unnecessarily?
3. Don’t forget about mobile design language
As we strive to improve mobile experiences, sometimes we forget to consider the bigger picture. Most apps will need to be designed for multiple mobile operation systems: Android, iOS, and Windows. A lot of the time we’re focusing on individual devices when we should be thinking more about the behavior and interaction of each mobile operating system. As Anthony Handley puts it: “Apple, Google and Microsoft have invested heavily in their respective design languages.”
But how do you design for multiple OSS? Well, start by reading up on UI guidelines for Android and iOS. And when you start prototyping your app, try to use pre-built UI kits to where possible to save you time. The great thing about mobile prototyping is that you can create, customize and share UI assets, or widget libraries, to make your prototypes as realistic and functional as possible, and maximize the user experience from the beginning. With Justinmind, you can build life-like iOS, Android and Windows mobile device replicas with our extensive widget libraries. With the atomic elements we’ve used to build each component, you can even customize them to make them as personalized as you like.
4. Don’t use the wrong tools
Whether you’re designing for iOS, Android or Windows, there is a plethora of great and not so great tools at your disposal. The trick is to separate the wheat from the chaff and find the right tools for you, and for your mobile app. For example, read reviews and test out tools: many prototyping tools offer free trials so that you can give them a test drive.
Consider whether your prototyping tool is integrated with your design tools, such as Photoshop or Illustrator. Also have a think about how you’re going to perform user testing and whether you can save time by connecting the process directly with your prototyping tool. User testing is so important in mobile app design — after all, we’re using these devices all.the.time.
5. Don’t skimp on the fidelity ladder
When designing your app, remember that the optimal level of fidelity is the minimum amount of fidelity needed to get the job done.
- Low-fidelity design involves sketches and static mobile wireframes that allow you to iterate and present all features and content in a quick and disposable manner.
- With medium fidelity mockups you are building up your designs from concept to working design phase. Your mockup will have visual input and functionality, but it’s still relatively simple to create multiple iterations.
- With hi-fi mobile prototypes, your design is going to look and feel close to the finished product both in terms of the look of the interface and the interaction. It will take more time to iterate and refine the mobile User Interface design.
When designing a mobile app, it’s important to be able to present user testers with a realistic model. According to Creative Bloq, actual device testing is important in order to “conceptualise the final product while allowing for in-depth and valuable user trials.” In this respect, high-fidelity prototyping is a must for mobile app design. But don’t neglect the value of starting with paper and basic wireframes, where you can really get stuck into your initial ideas!
6. Don’t ignore the user!
It seems we’re really focused on creating intuitive apps with all the bells and whistles, when really all the user wants it to understand your app and complete their task. We need to present information in an easily understandable way to new visitors and offer feedback to the user to keep them informed.
A great way of offering feedback to the user as they view and interact with your app is by using micro-interactions, such as calls to action and educative animations. According to the first usability heuristic principle coined by Jakob Nielsen: “The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.” Users expect to receive feedback in the form of immediate responses to their interactions with apps.
With Justinmind, you can add interaction to your mobile prototypes, such as gestures, swipes and taps. These events allow the user to communicate with the app. By adding micro-interactions to this, the user can receive the app’s response. For example, you could display a graphic in the background, highlight the interactive element, or play a sound in the user interface to inform the user that their interaction has been recognized. Moreover, scenarios are a great way of helping you to map out the user flow and see where the user interaction could be improved. By simulating scenarios, you can actually preview them in real-time. They’re a pre-requisite to testing out your app prototype with real users.