Design Process GDE.design

Is there a single standard for the design process?

The short answer is no.

Design process

Is this process discrete?

For sure, it’s not. Discreteness implies a clear end of one stage and the beginning of the next one. In the case of design thinking, the steps are superimposed on one another.

The design process steps are superimposed on one another.

Is it linear?

No.

Non-linearity of the design process

What determines the structure of the design process?

Many factors do. From the nature of the project carried out by the team to the line-up. We at gde.design primarily focus on working with startups. Therefore, our design process is a squeeze of product and service design’s best practices, multiplied by experience in working under tight deadlines. We took the fastest and most effective techniques, built them in the correct order, and enlisted experienced specialists’ support. These steps look like this:

  1. Discovery
  2. Brainstorm session
  3. User Flow
  4. Wireframes
  5. UI

1. Discovery

Design process: discovery stage
The role of UX/UI designer in the product lifecycle

1.1 Vision

Vision is a powerful yet simple tool for understanding your business. Below you can see a canvas spreadsheet of 12 simple questions that describes your product from all angles such as Users, Marketplace, Solutions, and Business Goals. Earlier, we tried to apply Business or Linen Canvas, and in the end, we came to Vision, as it does not contain anything superfluous. The client fills it in — independently or with our help.

The vision document

1.2 Persona

It is also crucial for us to understand the target client — his goals, pains, everyday tasks. We go through this stage with the client together. It’s good when the customer himself knows his target audience. Otherwise, it is necessary to carry out rather expensive research to determine it.

Persona document

1.3 Competitors Matrix

You probably know a little more about your direct competitors than UX designers do, since you are more familiar with the subject area. Moreover, your USP will directly depend on who is fighting for your target client. In any case, we need this list to indicate which elements are useful and which are not. For this, there is a matrix of features. In it, we note what your competitors have done well, what is ineffective, and what is essential in your opinion they do not have. At this stage, we also conduct competitive analysis ourselves.

Competitors matrix

Additional Discovery Stage Artifacts

1.4 Use cases

Use Cases
Testing of the existing prototype

2. Brainstorming

Design process: brainstorming stage
  • Decision Matrix
  • Priority Matrix

2.1 Decision Matrix

Here is a table where we enter all the ideas related to solving users’ needs identified earlier. We can come up with solutions ourselves and partially borrow them from competitors, taking into account their mistakes. We evaluate each feature on a 10-point scale according to two parameters — the effort required to implement it (Efforts) and the impact that this feature will have on the user’s problem. The first indicator helps to evaluate the developer and ourselves. The second is understanding the target client and Kano’s method.

Decision Matrix

2.2 Priority Matrix

This tool helps us prioritize features. It is not hard to guess that, first of all, you should implement those features that have the most significant impact on the user’s problem at the lowest implementation cost. To see this clearly, we display the Influence and Effort metrics on a 2-dimensional chart — the Priority Matrix. Thus, it costs us nothing to divide the features into 2–3 groups. The first will include elements for the first release. Second and further — features for later releases.

Priority Matrix

3. User Flow

Design process: User Flow stage

3.1 User flow diagram

User flow diagram

Additional artifacts

Depending on the project’s complexity, several additional documents may also be required at the user flow stage.

Data model Diagram
Service Blueprint

4. Prototyping

Design process: Prototyping stage

4.1 High Fidelity Prototype

High-fidelity prototype
  • Microinteractions
  • Text data
  • All possible states of components
  • All possible transitions between screens
The hierarchy of user experience components

4.2 Clickable and animated prototype

You can assess many decisions only over time. That is why we do both a clickable prototype — with basic animation and a prototype with complex animation of UI elements. If the product requires it, we will recreate the interface animation as it appears in the final design.

5. UI design

Design process: User Interface design

5.1 UI Design Concept

Design concept

5.2 Full UI & Design System

After the design is approved, we scale it to the rest of the product.

Design system

Additional artifacts

5.3 Branding

Brand design for Brokrete company
Illustration for the UI design of Brokrete website

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
gde.design

gde.design

We design products that bring millions. Individual UX solutions to fit your business goals.