How to Create an App Design That Works

Design is essential to a project’s success. And designing an app involves more than one designer. If an entire team – including business owners – take an active part in the web and mobile application design process, there’s a better chance of creating a beautiful and useful product.

In our complete guide to a digital design that works, we’ll walk you through Yalantis’ approach to designing excellent products, providing helpful design tips and sharing our best practices accumulated over the years. So let’s ask some questions.

Creating app design that works

What is “design that works”?

Before we talk about how to make an app design that works, we need to know what a “working design” actually is. We all know there are two main design components for an app – the user interface (UI) and user experience (UX). What do these things have in common? The answer is the user. Design works when users are happy. It’s as simple as that. 

Read also: Product Designer in App Development 

A working design is not only a good-looking design. A working design is rather invisible. Ideally, users should instantly understand a web or mobile app’s user interface patterns and components to achieve their goals with minimum difficulty. An intuitive experience satisfies your users and keeps them coming back for more, which essentially means more profit for your business.

How can I create a UX design?

Creating an intuitive, attractive, and user-friendly design requires understanding your users – their pains, emotions, motivations, and desires. And here’s where UX designers usually rely on user-centric design tactics. 

How to Create an App UI/UX Design That Works

Made popular by the Stanford d.school, Harvard, and MIT, and successfully adopted by Apple, Google, Samsung, and General Electric, Design Thinking is a design approach that seeks to understand an end-user and redefine their problems to identify and develop the most optimal solution to them. At its heart, Design Thinking has a deep interest in developing empathy with the target user for whom the product is being developed. 

There are five stages of Design Thinking according to d.school

  1. Empathize – Learn about your customers

  2. Define – Construct a point of view based on customer needs and insights

  3. Ideate – Brainstorm many possible solutions

  4. Prototype – Create several prototypes of your solutions

  5. Test – Put your prototypes in front of users to get feedback

Design Thinking looks more like a circle than a straight path. The design team continuously uses the results of their work to review, question, and improve their initial assumptions and analyze possible implications of their solutions for users and the industry in general. 

What is Design Thinking? The five stages of the Design Thinking approach

Much like the Design Thinking approach, User-Centered Design (or Human-Centered Design) is an iterative design technique aimed at developing solutions to problems by approaching all steps in the problem-solving process from a human perspective

There are four stages of user-centered design as proposed by the Interactive Design Foundation:

  1. Understand the context of use – Try to understand the context in which your users will use your product. 

  2. Specify requirements – Identify and elicit users’ requirements. 

  3. Design a solution – Develop possible solutions.

  4. Evaluate the solution – Evaluate your solution against your users’ context and requirements, checking how closely it matches users’ specific needs. 

That’s not the end, however. Your team then can perform further iterations of these four phases and continue until the results are satisfactory.

What is user-centered design? The four stages of the user-centered Design approach

Lean UX is one more effective approach that’s widely used among design and development companies. This technique, born out of Toyota’s manufacturing model, works in alignment with Agile development methods. It aims to reduce waste and increase value.

Essentially, Lean UX combines the solution-based approach of Design Thinking and Human-Centered Design with iterative Agile development methods, streamlining the design process. It boils down to a simple formula: think, make, check. By mixing a lean, Agile approach with human-centered design techniques, you can establish a product development process that’s not only user-centric but also highly efficient from a business perspective.

Read also: How Do We Deal with App Development Process at Yalantis?

These approaches look pretty similar, don’t they? There are lots of other similar schemes and algorithms that have been created by designers all over the world. Essentially, they all teach us to ask the right questions to better understand our users, generate as many ideas as possible, and, by testing them, find an ideal solution that not only fits users’ needs but is sustainable and can survive in a competitive environment. 

What is Yalantis’ approach to UX design? 

All of the approaches we’ve mentioned complement each other. Any UX design process comes down to four basic steps – Think, Create, Test, and, surprisingly, Repeat. 

UI/UX design process at Yalantis

1. Think – Find out users’ needs to make them happy

Here are your tasks for the Think stage:

  • Conduct UX research (qualitative and quantitative) to learn more about your target audience’s needs; analyze the market and competitors.

  • Elicit customers’ requirements. Working closely with business analysts, define your business requirements and prepare technical specifications.

  • Create personas and roles, or fictional characters that represent users of your product.

UX research helps app designers and developers better understand users’ behaviors, habits, and needs through different observational techniques and surveys, interviewing users, and watching how they complete different tasks. A designer’s job is to dig deep into the problem and brainstorm solutions to provide value for users. 

Basically, UX research consists of two parts: gathering data and synthesizing it to improve your app’s usability.

Read also: The Role of a Business Analyst at Yalantis

Research techniques may include interviews with customers and stakeholders, study reviews, and interviews with subject matter experts. As a result of UX research, designers get buyer personas, user stories, use cases, and user flows, on the basis of which you can build your app’s information architecture.

In outsourcing companies like Yalantis, UX research can consist of the following steps:

  • Study all project materials, whether there’s a bare business idea or a detailed specification with desired functionality, mind maps, users roles, and so on.

  • Conduct a range of interviews with the client to elicit their requirements.

  • Conduct market analysis. Study close competitors and reviews of their products, interview subject matter experts, and, sometimes, observe users.

  • Prepare a presentation for the client that may include mind maps, moodboards, references, and a couple of initial app concepts.

In both product companies and outsourcing companies, after conducting initial UX research, the focus gradually shifts to usability and the users’ mood. Researchers can conduct usability tests, or A/B tests, as well as feedback sessions with users. Typically, developers test assumptions that will improve the design.

If you’re curious to find out more about our design approach and discover the cost of our design services, ask all of your questions at hello@yalantis.com

2. Create – Develop possible solutions based on users’ requirements

Once you’ve gathered the information you need, you can start creating first sketches. To do so, you need to start with drafting your information architecture and navigation:

  • Create a mind map (site map) of your application that describes the app’s structure and logic.

  • Create wireframes with textual content.

Your mindmap may eventually look like this:

UI/Ux design: How to create a mind map

The first step is creating low-fidelity wireframes, which help an outsourcing firm clearly communicate visual ideas to their clients. Low-fidelity wireframes also help a business analyst understand the project and create detailed requirements. 

Next, create detailed wireframes. To do so, you can use vector graphic editors such as Sketch, Figma, or Adobe Illustrator. These design tools also let you write comments for every screen to display the logic in as much detail as possible. 

UI/UX design: How to create wireframes

After the wireframes are ready, you can start building a prototype:

  • Export all of your screens as separate images

  • Use InVision (or any other tool you prefer) to build an interactive prototype with transitions

  • Share your prototype with a client or, even better, with its future users

  • Test your prototype (see the Test section below for details)

After your prototype has been tested and approved, start working on your visual design:

  • Find an appropriate visual style using information from your research (design brief, moodboards, references)

  • Don’t forget about developers: use Zeplin or Avocode for sharing specifications and assets

3. Test – Put your prototypes in front of users to get feedback

The earlier you start testing, the better. Once you have text wireframes, you can test them on real users. You should take advantage of every possible opportunity to get feedback. Ask your colleagues, parents, friends, and random people in your office building to accomplish certain tasks using your prototype. Then watch what happens.  

UI/UX design: How to create a prototype

Share your interactive prototype with everybody you know, including your stakeholders. Let them test it as well. Continue collecting feedback even when you feel like everything is perfect. After your product is released, start tracking analytics and collecting user feedback.

Read also: Creating Interactive Prototypes with Flinto: Pros and Cons

Finally, go all the way back to the beginning: gather information, think, and create a list of changes. Continue with wireframes, testing, design, testing, release, testing, and gathering information.

4. Repeat – Iterate until you get satisfactory results

How many iterations do you need to create an app design that truly works? All of them! There’s no such thing as a “final” design. There will always be something in your product that can be improved.

Consider your product a living creature: it should develop and evolve, getting better with each generation.

Can I fix all of my UX problems at once?

“A brilliant solution to the wrong problem can be worse than no solution at all: solve the correct problem.” —

© Don Norman, the father of user experience design

 

Don’t try to fix all your problems at once. Develop a minimum viable product first and try to fix major issues in the early version. Then test every change you make as soon as possible.

Your MVP product should have enough features to allow you to ship the product to its first users. Use it to test your assumptions, understand your users, and define the functionality that brings them real value.

4.3/ 5.0
Article rating
163
Reviews
Remember those Facebook reactions? Well, we aren't Facebook but we love reactions too. They can give us valuable insights on how to improve what we're doing. Would you tell us how you feel about this article?
Excited to create something outstanding?

We share the same interests.

Contact us

We use cookies to personalize our service and to improve your experience on the website and its subdomains. We also use this information for analytics.