Mobile

10 Mobile App Prototyping Best Practices that Result in a Stellar Finished Product

September 11, 2015

Prototyping is an integral part of the product development process. No matter how amazing an app designer is, the first design is hardly ever the winner. Designers should always get user feedback to create outstanding products. By far, prototyping has proven to be both an efficient and effective way to do so.

Using our expertise on mobile apps, we put together a list of 10 prototyping best practices. The following will be useful for all. From from mobile app designers and developers, to business owners. By following these best practices, all your hard work is bound to result in a stellar finished product.

1. Make it Fast

Young boy running in the fields with city and sun as backdrop. The first of all mobile prototyping best practices is to make it fast.

Remember that the purpose of a prototype is to gain understanding to a problem. It is not to solve a problem. You have to keep that in mind and not get tempted to build an entire product. The code is never ready to ship.

Always define beforehand which features and ideas you would like to have tested. Then, limit the time you spend on making a prototype. Send it off for feedback as soon as it is good enough to be understood. Not spending too much time on it is one of the most important of mobile prototyping best practices.

2. Ditch the Details

Colors, fancy typography, and other visuals details make an app dazzle. But these design details are not all that important for prototypes. A key to implementing mobile prototyping best practices is to think in terms of the bare minimum.

Ditch the details. Or use them sparingly. After all, you are testing ideas, not determining whether an icon needs to be 10dp to the right. Once the essentials are in place, the design details can follow.

3. Prioritize Your Features

Overhead shot of man using mobile smartphone. When prototyping, always prioritize your features. Zone in on the key features.

When building a mobile app, we all get excited when thinking about new features. It is easy to caught up in the thrill of having come up with something cool. Hold your horses and consult the mobile prototyping best practices. Because your app prototype should not incorporate a dozen key features to begin with.

You have to prioritize and decide which features are quintessential to your app. Your best features have to suit your target users’ needs, not your personal preferences. Think of it like a business pitch. If you had to describe your mobile app in 60 seconds, which features would you highlight?

4. Pareto’s Rule (80/20 Rule)

Pareto’s rule states that approximately 80 percent of the effects come from 20 percent of the causes. For obvious reasons, it is also called the 80/20 rule. A common usage of the rule is in the business context. Executives often pipe, “80 percent of profits come from 20 percent of your customers.”

Adapted as one of the mobile prototyping best practices, the concept does not differ by much. 80 percent of an app’s wonder comes from 20 percent of its features. Or, 80 percent of an app’s beauty comes from 20 percent of its design.

That is not to say that you can slack off and make only 20 percent effort for your mobile app. Following Pareto’s rule helps you to prioritize and optimize. It serves as a great reminder for why you should always break it down to the essentials when prototyping.

5. Use Real Content in Prototypes

Blocks of letters and numbers jumbled up. One of the mobile app prototyping best practices is to avoid placeholder copy that is not meaningful to the user.

Placeholder copy or “Lorem ipsum” does not work. Even on a mobile app prototype, it is not meaningful. Lorem ipsums will not give you an adequate representation of how content will fit on a device. It will not help you to understand how content works, which is so important for the success of your app.

Content is a large part of our mobile app experience. Although underrated, copy makes up most of content. It is the textual medium through which we interact with an app. Imagine sending off an app prototype with only placeholder copy. How is anyone supposed to get what the app actually does?

Use real content as one of the mobile prototyping best practices. If you do not have the final approved copy, create an approximate of the actual content. Bare bones as your app prototype might be, imbue it with meaning by using real content.

6. Map Out User Flows

It is important to acknowledge the limitation that you are not the user. Build your mobile app for your users and not just for yourself. You can do so by conducting user research and understanding your community of users.

Creating and mapping out user flows is one of the mobile prototyping best practices to keep in mind. Based on who your users are, picture the possible scenarios they might go through using your app. Map out the various flows. Pay special attention to where friction might arise. Identify possible shortcuts and redundancies.

7. Limit a Single Function to Each View

Focused photo of mobile user taking picture with iphone. A mobile app prototype should limit a single function to each view to avoid distraction.

Mobile apps are not websites. You cannot throw a bunch of content on it and expect the user to find the action button by some miracle. Modern day users are just distracted. Mobile users? Even more so. As such, the general nature of mobile apps is a lot simpler its purpose much more singular.

One of the recommended mobile prototyping best practices is to limit a single function to each view. Especially so early on in the prototyping process. This would compel you to hone in on the primary, most important function of each view.

8. Include Ancillary Screens

Views that present features and design details are unique to a mobile app. Designing them offers greater space to be innovative and creative. On the other hand, nobody actually looks forward to designing an error or loading view. It is common to dismiss them as mundane and uninteresting.

But yet, ancillary screens are integral to the user experience of a mobile app. They are views that communicate errors or allow users to configure settings. Be sure to include ancillary screens in your mobile app prototypes. Avoid the minutiae as per the other mobile prototyping best practices.

9. Test on Real Devices

Mobile devices are not just containers that display and execute your mobile app. Designing for mobile is designing for ergonomics. There is plenty to take into account that cannot be simulated. One such is the manipulation of the user interface by a human hand which involves the touch senses.

Your prototypes should be testable on real devices. Not just in your development environment or device simulator. This allows you to better evaluate how well users can interact with the app’s content. Through that, you discover usability issues and device constraints.

10. Accept Negative Feedback

A woman covering face with crossed hands. Learning to accept negative feedback is one of the important prototyping best practices.

Learning how to accept negative feedback is one of the more important lessons of all mobile prototyping best practices. When receiving negative feedback, stay calm and do not get upset. Remember that prototypes are to test ideas. They are meant to be swapped out and discarded.

This is also why you should follow the first of mobile prototyping best practices and make prototyping fast. If you spend too long on a prototype, you are bound to get attached to it. It would be tougher to accept negative feedback.

At times, the negative feedback you receive may have nothing to do with what you are testing. In this case, evaluate the criticism to see if it truly reflects a potential problem for users. Although most people know how to define ‘prototype’, few truly understand what it entails. They expect to see a rather complete and functional mobile app, not just the bare bones version. To avoid this, always be clear about what they have to test. Explain the purpose of the prototype and be thorough. Let them know that the prototype will evolve.

Using the Right Prototyping Tool

Following these mobile prototyping best practices will set you on the path to creating an amazing app. It is just as useful to choose the right prototyping tool for your needs. Proto.io is a powerful and easy to use tool for building rapid prototypes, no coding required. As you iterate, you can add design elements and polish up the prototype to make it more realistic.  Have a look at the stunning prototypes created by the community at Spaces by Proto.io. You can import any one of those and start prototyping your mobile app today.

Author