The design process of the Floriday.io interface

Want to know what the design process of the interface of Floriday.io looks like? To give you a small glimps of the process we created a video that is shown below.

Where does it start?

The design process usually starts in a 'white' room as shown in the video. Every wall in this room is covered with a whiteboard or a piece of paper. The reason why we start our design process in this room is because there are no distractions from outside. A call or simple question from a colleague is enough to completely interrupt your flow.

By writing down all our ideas on the whiteboards and papers it's easy to stay at the same point of thought, and to involve other colleagues.

The customer journey

The session starts with a short pitch. The product owner, Jefry in this case, presents a scenario that needs to be processed in an interface.
When I'm designing the user interface I don't want to make any assumptions, so I ask a lot of questions. As soon as I have a clear view of the situation I start drawing.

As shown in the video, we make rough sketches of the interface. We draw each step that the user has to go through. This process is called the 'the customer journey'.

User interface design

When we have gone through the entire process, I go back to my usual work place where I start designing the interface. To do this, I use Adobe Experience Design, a tool specifically designed for creating interfaces and prototypes.

During this part of the design process many questions arise. For example, when we look at the catalog for Floriday.io:

• What does the catalog looks like when a user opens it on his phone or tablet, and what features are most important?
• What happens to the catalog if there are no products?
• What happens to the catalog if there are a lot of products?
• What happens if you select multiple products?
• What does an error message look like?

There are many more scenarios that should be devised before a developer can get started.

Check out the video to see what the process looks like.

If you have any questions, please let me know! You can email your questions to: bas@jem-id.nl