Mobile

Why You Should Always Choose Mobile Prototyping

And Never Settle For App UI Mockups

January 8, 2016

Most designers start their careers by learning graphic design or designing for the web. Although there are overlaps, switching to mobile app design is not always a walk in the park. Mobile app design requires an intimate knowledge of user experience and interaction design. It demands for us to abandon thinking about design in the form of static images.

Going from graphic design to mobile app UI design requires a learning process and a switch of mentality.
Going from graphic design to mobile app UI design requires a learning process and a switch of mentality.

The mobile era has not only transformed the way the way we think about design but also how we approach it. We alter our design work flows according to the ever evolving best practices of mobile app user interface design. We come up with new ideas that become conventions overnight. Then, before we know it, they have crept their way to obsolescence. These are, indeed, exciting times to be a mobile app designer.

As designers, we have to engage in constant innovation and learning. We also have to be on the lookout for ideas that add true value to the design workflow. Mobile prototyping is one such that has been identified by many as crucial to the design process. If you are not quite convinced, here are five reasons why you should never settle for mobile app UI mockups. When it comes to mobile app design, always opt for prototypes instead.

1. When Seeing Is Understanding: Why Tell When You Can Show?

Show and tell is a concept we are all familiar with. In many countries, it is a common classroom activity to teach public speaking skills. Students bring an item to show the class and tell them about it.

When applied to the design world, UI mockups are app designers’ choice items of show and tell. A mockup is a pixel perfect rendition of a design idea. Using tools such as Photoshop, designers create mockups to convey the look and feel of a product. But yet, when it comes to how a product actually works, designers resort to a lot of telling.

What is wrong with that? Think about this. If you are to explain football to someone, would you give them a picture of a ball then proceed to tell them how to kick it?

Football table game is more effective in explaining football than just describing it with words. Likewise, mobile prototyping allows designers to show rather than tell.
Football table game is more effective in explaining football than just describing it with words. Likewise, mobile prototyping allows designers to show rather than tell.

Because of the excessive need to tell, mobile app UI mockups are just not the best solution. A mobile app requires a much greater degree of show rather than tell. Designing for mobile is designing for motion. A mobile app is not a canvas on which you arrange elements in the best way. It is interactivity incorporated.

Never settle for app UI mockups when it comes to designing for mobile. They do not offer any way to show the interactions needed to enable a mobile app to actually work. There can be no real understanding of what the product even does. A mobile app UI mockup is superficially good-looking. Still and lifeless. Beautiful and non-functional.

When you choose interactive app prototypes over UI mockups, you will know that seeing is understanding. Mobile prototyping allows you to show a realistic approximation of the app, interactions included. Mobile prototypes let you show, rather than tell, how an app works.

2. Avoid The Failure To Communicate

In the old days, people listened to sport games on the radio. The way that talented sports commentators described the game was unique. Through their words, we imagined the exact events of every moment on the field. We felt the surge of excitement and the crash of disappointment. Their voices carried emotions and embodied power. They made the hearts of many fans beat in sync. They fueled the imagination.

Most of us are not cut out to be sports commentators. We are not trained to spin words into magic. A design review is not a sports game either. Clients and developers simply do not know design well enough to imagine.

A vintage radio through which sports games were broadcasted. Designers, however, are not always talented commentators and that’s why mobile prototyping is important.
A vintage radio through which sports games were broadcasted. Designers, however, are not always talented commentators and that’s why mobile prototyping is important.

So if you have to tell them to use their imagination, it is a failure to communicate. It is just not going to work. “Imagine that when clicked, this button expands into the top bar in a fluid movement over 100 milliseconds“. Comments such as this only create more confusion. People have a hard time visualizing motion based on static images.

3. Streamline and Speed Up The Development Process

For designers and developers, mobile prototyping cuts down a great deal of back-and-forth between them. By incorporating mobile prototyping into their workflow, designers can focus on the work they should be doing best. That is, creating better user experiences. Working with interactive app prototypes compels designers to hone in on the interactivity of an app.

If you settle for mobile app UI mockups, brace yourself for email rampage. After handing off designs to developers, they might ask for clarification on the details. Or on the notes you left. Or point out technical limitations. Then, because your design is not doable, they might just deviate from it.

If the final product is not quite what the client imagined, things can get costly to fix. Depending on the extent of the changes, the three-way back-and-forth is a waste of time. From designer to client, back to designer, then to developer… It is like restarting the process again. Why go through the hassle if you can avoid it by opting for mobile prototyping instead?

With mobile app prototypes, developers know from the start what needs to be done. They can determine right away if a feature is doable. If not, they can immediately request for design changes. Clients have a clear idea of what the final product will be like. What mobile prototyping offers you is to streamline and speed up the app development process.

4. Weed Out The Problems As Soon As Possible

It is less costly and much easier to fix problems by changing design rather than code. The thing with mobile apps is that many problems are not noticeable on first sight. You have to use and test the app on actual mobile devices to uncover problems in the design.

Mobile prototyping is a good way to weed out the problems as early as possible. This means way before any code has even been written. It ensures that you aim to create the best possible user experience and not just a fine-looking app.

For instance, you may have designed your touch targets according to the interface guidelines. But yet, it is only after using it that you realize that it is a tad tricky to reach. Moving the target would mean adjusting the entire layout. Making these changes after developing the app is time-consuming and costly.

A man holding up a sad emoticon as a mask. This is the general feeling that is generated when designers and developers don’t get along.
A man holding up a sad emoticon as a mask. This is the general feeling that is generated when designers and developers don’t get along.

You can also see the UI animations in action without having to build an entire product. With mobile prototypes, you can easily identify problems in your interactive elements. You get a good feel of how well the animations and screen transitions work. Are they lacking visual feedback? Or too slow? Too many maybe?

5. Go From Idea To Testing In A Jiffy

Ideas are dime a dozen. The app stores release thousands of new apps every day. Some of them make it big. But many of them should never have even seen the light of day. Just because an idea sounds interesting does not mean that it should be developed.

Mobile prototyping provides us with a quick and easy means to validate our mobile app ideas. Learning from user feedback is crucial in the early stages of a mobile app development cycle. There is no need to spend on design and development if the idea turns out to be flaky. We have detailed this in our post on how to start a mobile app business the right way.

During the design process, it is common to second guess yourself and each other. You encounter a lot of “What if we did this and this instead of that?” Then, you wind up in deep discussion defending a design position based mostly on personal preferences.

Why not ask the users? You can put the ideas in a mobile prototype and run a quick test. This saves time spent on designing and redesigning, as well as on in-house arguments.

Say No To Mockups and Yes To Mobile Prototyping

Choosing a mobile prototyping tool that suits your needs is as important as prototyping itself. It has to be easy-to-use and jam-packed with features. It should allow you to demonstrate even the most complex of interaction design. And no doubt, it should work fast and it has to be reliable. For that, try Proto.io to create interactive app prototypes that feel so real.

Author