Mobile App Design for Beginners: The Basics of Your Work

Mobile devices give us so many opportunities wherever we go and whatever we do. There are apps for specialists of different spheres, apps for studying and organizing our lives, entertainment apps not to get bored – and you can continue the list in any way you like. As someone said, smartphones are those phones for which calling function is not the main thing.

But with great potential app creators got one but very big challenge – they have to design a unique solution, which is usually placed in the user’s palm. Designing a mobile application is not an easy thing, and you certainly need some help if you’re a novice.

Navigation
Interaction Design: The Very Foundation of Your Knowledge
The Preparatory Phase: Get to Know Your Users
Plan User Flows and Draw Content Maps
Add Familiar Patterns for Comfortable Usage
Focus on Accessibility with Fingers of Any Size
Usability Testing: Vital on Each Stage of Design

TecSynt gathered some basic information about the process of app designing. If you look for a general review, you’re in the right place to start.

Interaction Design: The Very Foundation of Your Knowledge

Designing a new app, it’s better to know a lot about how to talk to the user through his smartphone. The creators of interaction design built a structure of user-device relationships for us not to forget the basics no matter how much we know.

“Interaction designers strive to create meaningful relationships between people and the products and services that they use, from computers to mobile devices to appliances and beyond.” – The Interaction Design Association (IxDA)

As this concept can be applied in any type of development, we should definitely learn more about its main points.

  • Goal-driven design. It’s impossible to move without a direction. In the mobile app development, our direction is user behavior. With a previous research, you will know more what drives your users, and you’ll be able to build goals for your own work and the activity of your customers.
  • Usability. This point is not just about utilization but about an easy-going experience. If the app is easy to use, it becomes desirable in the short term.
  • Affordance & signifiers. Affordance makes an app functional. To demonstrate it correctly, apply signifiers wisely: when you see a blue underlined text, you click on it. So, be clear and don’t confuse customers with complex elements.
  • Learnability. This point is about instinctive usage when people don’t think much tapping on a button. To create such interaction, use familiar patterns from time to time.
  • Feedback & response time. Let people know that the action is completed and everything’s okay by a skillful feedback. It may be a short sound or a modal window – think about what your audience likes more. And don’t be late – make a response fast.

Now you have a general idea about design in the digital world. We will make a few stops to discuss some of these pillars in more detail.

The Preparatory Phase: Get to Know Your Users

Any work should start with a previous research. When creating an app, it’s vitally important because the new product should meet the expectations of the wide audience. So start listing your goals according to the needs of your target users. Who are they? Let’s find out together.

Our research is based on three methods you can use to make friends with your customers:

  1. Personas. These are fictional personages which are built according to the usual behavior of your customers. Personas help to understand various decisions people make navigating your app.
  2. Users Scenarios. Having scenarios at hand, you will know exactly how people will act within an application. It allows building the best UI experience from the onboarding stage till the app closing.
  3. Experience maps. They will show you all possible conditions in which users will appear. You will see deeply what drives personas when they make a certain decision.

“So replace the startup dogma of ‘launch early and often’ with ‘learn early and often.’ For me, it opened my mind to all the different kinds of ways startups can learn, and how valuable user research can be to the core mission of any startup.” – Braden Kowitz, GV

If you have information from these three sources, you’ve got a reliable foundation for the whole work you’re going to make. Now, it’s time to figure out how to actually start designing an app.

Plan User Flows and Draw Content Maps

This step is made along with researching or straight after it – this way all important data will be saved in your further work. We recommend you create a simple prototype of the app. Without any extra details, you will see the initial appearance of your product. Don’t think about anything complicated here – you can start with paper sketches of user flows.

Paper Sketches

For some of us, the writing-first method can be more useful. You just outline the main ideas of the app and actions within it. This method was described by Jessica Downey, and she gives an example of a written flow:

Draw Content Maps

Usually, such models are created before prototyping, and they emphasize the content before you move to the overall flow. You’ll be able to get a clearer understanding of the number of pages you eventually have in your application. In addition, it will help you in sketching each specific page of the product.

Add Familiar Patterns for Comfortable Usage

There are some mobile patterns that became common for all smartphone consumers. If you add some of them designing an app, clients would feel themselves great and would love to come back again. For them not to get bored, be creative with standard actions such as drawer navigation:

Drawer Navigation Drawer Navigation

For this stage, it’s important to know about two main categories: gestures and animations.

Gestures define the whole user experience as it’s the core of touch devices. There are lots of gesture variations to consider: tapping and double-tapping, swiping, pinching, etc. Each platform has its own approach, and you can learn more about them in the gesture guide written by Luke Wroblewski.

Animations may be not only an entertaining thing but also add some context to typical actions. For example, if the element vanishes from the screen, it means its deletion. If it slides out, then it may be used later. Mixing gestures with animations, you create an additional depth for UI.

Focus on Accessibility with Fingers of Any Size

Fingers are thicker than mouse cursor on the PC – this is the simple truth you shouldn’t forget designing a new app. When people can’t get to the target button with their finger, they get annoyed and eventually leave your product forever. Just keep in mind this data for the start:

There are typically three ways to use and hold a smartphone:

  • using one thumb holding a device with one hand;
  • using one finger and two hands;
  • using two thumbs and two hands.

Our fingers are fatter than you might think. Most guidelines tell us that the touch targets should be around 44 pixels wide. But when you create an app, consider bigger buttons – around 45-57 pixels.

Don’t Forget to Throw Out the Clutter

When designing an application, it’s important not only to create but also get rid of unnecessary things (i.e. unnecessary screens). When you appear on this stage, it’s time to count all of the steps users should do to complete an action.

You’ve probably guessed that the number of taps should be minimal. The ex-CEO of Yahoo Marissa Mayer advises to use the “two tap rule”:

“The Yahoo Flickr app uses this to great effect: from the opening screen, you can take a picture, surf your screen, navigate albums, check out groups, set alerts, and more, all with just a couple taps.”

If it takes too much time for the user to get what he wants, it’s time to consider app redesign.

Usability Testing: Vital on Each Stage of Design

We’re mentioning testing at the end of this article, but it doesn’t mean that it should take place at the end of the design process. On the contrary, with each step you make in creating a new product, you must work in collaboration with testers or at least with testing tools.

Usability Testing

No matter how far we go in our theoretical discussions about app design, the app becomes alive only after practical approvement. If you want to start with something simple, be ready to apply some remote usability tests – UserTesting service is just right for that.

It also may be an option to run a lab session with several users – you will get a deep insight learning gestures and body position to estimate the accessibility level.

App Design Sets No Boundaries for Creativity

In fact, we face lots of new challenges and novelties designing an app. But this ongoing process of transformation is a perfect field for personal growth and skill improvement. TecSynt follows the up-to-date mobile app design trends and uses them in practice at the first opportunity.

If you have some questions and would like to discuss it with us, we’ve got plenty to tell you. Together, we could examine the latest market demands and construct a helpful and valuable application for the audience of your choice.

Let’s create brilliant designs together!

Design your app with Tecsynt

Read Next

10 Up-to-Date Mobile App Design Trends
10 Up-to-Date Mobile App Design Trends
7 Top Logo Apps for Android
7 Top Logo Apps for Android
How to Make a Simple iOS Game
How to Make a Simple iOS Game
Don’t leave us hanging!
Get in Touch