Week 3: App Design Process

The Process Behind App Design

What Everyone Should Know About the Process Behind App Design By Michael Flarup

Over the years many things have changed for App Design, but some remain the same: the process of designing apps and the many phases in the creation of an app. The process in which an app designer undergoes when creating an app is shown below.

Screen Shot 2017-03-28 at 20.30.42.png

Step 1: Idea

Everything starts with an idea but it is better practice to be open to change, rather than committing to something straight away. Every idea should undergo a circular process of evaluation before proceeding to the next step.

Screen Shot 2017-03-28 at 20.39.39.png

Depending on the type of idea, there are different questions to ask. In the case of apps, these are some of the most often asked questions:

  • Is this idea financially viable?
  • Is this idea technically feasible?
  • Is someone else already doing this?
  • Could this be made simpler/differently?

Once you’re satisfied with an idea, it’s time to put things in writing.

Step 2: Spec

A ‘Specification’ or a ‘Spec’ is the piece of paper(s) that declares what your app does and how it is accomplished. No matter which way you choose to go about it, always do a spec. When an idea is put into writing it can changed, refined and developed. it allows initial ideas and assumptions to be explored. List both functional and non-functional requirements. Explain what your app is, and not how it needs to be done.

Step 3: Wireframe

Wireframes, or low fidelity mockups, can be either part of the spec or built from the spec. it allows the designer to understand how the product is put together and how the app is structured. The fusion of knowledge on how to best achieve things on the platform, with knowledge about the target audience or the goal of the product, creates a strong foundation for the architecture of the app. Going through the spec, screen by screen, and whiteboard the wireframes. Applications such as Omnigraffle or Sketch and Photoshop can assist with this. Your wireframes will be your first deliberate design made in a project.

Screen Shot 2017-03-28 at 20.49.24.png

Step 4: Prototype

The prototype are about creating a bare-bones version of the app with the goal of testing your hypotheses and get early feedback. Tools like Invision or Marvel  can convert your low-fidelity mockups into interactive “apps” that allow you to tap through the design. The most important thing in this step when deciding is getting early validation of your idea. A bad experience with a prototype might cause you to uncover issues with your wireframes, your spec, or even the very core of your idea.

Step 5: Visual Design

Visual design deals with the appearance of the app. Visual design will tell a story and communicate your brand, to guide users through challenging parts of the app, and make particular aspects of the experience more enjoyable. There is no right way of creating a visual design for an app and this stage is probably the phase that has the most tools and approaches. Visual design doesn’t end when you hand something off to the developer. It is a continued and constantly evolving process

Step 6: Development

In an ideal world, the developer would have worked alongside the designer throughout the design process. The best products are built by teams made of multiple professionals from various disciplines who have a mutual understand of each other.

Step 7: Iterate

You’re never actually done designing. In most good projects, designers have product ownership from spec to ship. The underlying process of making apps remains largely the same.

  1. Get an idea
  2. Write it down
  3. Build a prototype
  4. Enter into the dance between design and development until something comes out of it

The process is there to help us explore the potential by challenging our assumptions and iteratively execute each step.

This article was an interesting read, the author offered tools used by professionals, an insight from a designers perspective and broke down the process into an easy to read, easy to follow step to step guide. I felt by reading this article that I can follow his steps as a young professional and have an understanding of what is expected and the reality of making a successful app through an understanding of it’s process.


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s