Design

Learning user-inspired visual design

April 28, 2016

Read time 4 min

Reaktor Academy is a mentoring program for people who want to learn to create excellent digital services. This blog post was written by one of the participants.

Our Reaktor Academy visual design session was arranged a couple of weeks ago and it lasted a full day: it consisted of a company visit to the Stockmann headquarters and a visual design workshop.

Here are the two cents on what I learned along the day.

Talking with users makes for richer and stronger ideas

IDEO’s CEO Tim Brown has coined the term ‘t-shaped people’, which refers to experts of a principal skill that describes the vertical leg of the T – for example, software engineering. In addition, they are also highly empathetic, which they can utilize in other skills as well, such as anthropology, and which makes them good at recognizing patterns of behavior. In design research, talking with the users – customers – provides richer and stronger ideas, because they are based on observations from the field.

The Academy was invited to visti Stockmann’s headquarters. With the warm welcome of Anna Salmi, Stockmann’s Digital Retail Director and Elina Savolainen, Omnicommerce Development Manager, we talked briefly about Stockmann’s digitalization strategy and heard about their on-going projects. Jari Aarniala and Timo Jääskeläinen from Reaktor showed us some applications that they have been developing with Stockmann.

Jari and Timo showed no signs of those stereotypical ‘silent cave coders’: when the Stockmann app was developed, software developers joined the designers to do design research by interviewing customers in the shops. This has helped them understand the customers’ needs, pick out the most essential ones and build the app to be as efficient as possible.

Jari Aarniala, Software Developer at Reaktor: “Kanban is a good reminder and roadmap of where we are at and what to do next”
Jari Aarniala, Software Developer at Reaktor: “Kanban is a good reminder and roadmap of where we are at and what to do next”

Principles can help guide through the fuzzy design process

What makes good design? Some grounding theories provide guidance in how to make design that works; for example, Dieter Rams’ (1932–) ten commands of good design and the Gestalt principles are classical guidelines to follow.

Facebook’s Product Design Director Julie Zhuo describes that her aha-moment for “good” design happened during her internship at Microsoft. Product Founder Chris Pratley told her that you have good design when people who see it say “oh, yeah, of course,” like the solution was obvious all along.

Yet, the outcome is rarely obvious to come up with. Behind a great design there might be months and months of iteration before the solution becomes obvious. This, in my opinion, is a solid outcome to chase when practicing visual design. Reaktor’s designers Lauri Borén and Ville Mäenpää gave us a lecture of the concrete actions on how to achieve it: Visual Design 101, based on 7 rules for creating gorgeous UI (Part 1).

  1. First the structure, then the color
  2. Give the color a meaning; start by using just one color
  3. Never use black
  4. Light comes from the sky and shadows fall on the ground
  5. Make affordance obvious; easy discoverability of possible actions
  6. Grids are there to help
  7. Avoid silos and work in teams; iterate with the developer
Lauri Borén and Ville Mäenpää’s Visual Design Workshop
Lauri Borén and Ville Mäenpää’s Visual Design Workshop

Design is best learnt by doing

These guidelines in mind we got to work with our hands-on exercise with Sketch, a lightweight, yet professional tool for user interface design. One handy new feature for the program was Sketch Mirror for iOS that allows you to test your application on your device on the go.

Although one can design for multiple screens with artboards, the design process should start with one object, like a phone, then move to another object, like a tablet or a desktop. In sketch, adjustments can easily be made with a layer system like the one in Adobe programs.

I think all design should be highly user-centered and aimed at giving the voice to the customer. Theory is always a good basis for whatever you are doing, and some theories indeed are classics for a reason. At the end of the day, I’d still say that the most important thing to take home from all design-related lessons is to get out there and experiment with the array of tools and methods.

Here’s some further reading and watching:

Design talks from UX/UI conferences 

7 Rules for Creating Gorgeous UI (Part 2)

Charles Pearson: Ethnography = Better Design 

Pictures: Alexandra Petrova & Daniel Morales

Never miss a post