Designing a digital product
In this article I will explain the process that I followed to design a mobile application.
I started with a white canvas and 50h later I had a prototype ready to develop.
The only thing I knew from the beginning is that I wanted to create kind of dashboard application that will summarise information somehow and that will help users in the decision taking process.
In summary, these are the steps that I followed.
Step 1 Needfinding
Step 2 Ideation
Step 3 Prototype
Step 4 Test
—
Introduction
Since I became a father I have been struggling with cooking, all I wanted was providing my kids with a healthy and balanced diet, introduce them into the good habits, and make sure that they grow healthy but also that they enjoy food. But when both parents work full time this sometimes becomes very difficult.
I decided to create a product that will help people with the cooking, didn’t know what exactly yet, but I wanted to improve the cooking experience some how.
Step 1. Needfinding
1.1 Design brief
The first thing that I did was choosing an area to explore, a field where there could be a need and a solution for it.
I decided to focus on cooking, yes, I decided to create a tool to improve the cooking activity.
1.2 Find potential users who can provide feedback on the area of exploration
The idea of this project was to design a solution for specific users need. In order to understand those users needs I had to observe people performing a task so that I could get information to start building my product.
1.3 Create an observation plan and observe users performing related tasks.
Observing people is pretty simple, but you can prepare your observation in advance to make sure you get the right information
—
Step 2. Ideation
2.1 List of users needs
After observing my users I obtained a lot of information, so I created a list of needs so that I can narrow my project in one direction and help those people providing a tools to solve specifics needs.
2.2 Develop a point of View
From the users needs I choose a few of them to narrow my project and I developed my point of view. The point of view will drive my whole project from now in advance, is the core of my project and I sould build a solution directly aligned with my Point of View.
2.3 Inspiration board
Internet is full of information and it can save lot of time by going through others work. I created an inspiration board to get inspired by other projects.
3 Prototyping
3.1 Storyboarding
Storyboarding allows the designer to “walk in someone else’s shoes”, so I created to different storyboards to “visualise” how my product will help users.
3.2 Paper prototyping
In order to build the right product I decided to build different paper prototypes so I can test my ideas in a cheap and quick way.
Prototype 1
Prototype 2
3.3 Heuristic evaluation
Once the paper prototypes were ready I decided to observe users, in a structured way, interacting with them so that I spot potential breakdowns and get ideas about how to improve the prototype before starting with the digital version of it
3.4 List of potential improvements
After observing users I got a list of heuristic violations that helped my defining potential improvements.
3.5 Wireframing of the paper prototype
Based on what I learned so far I started wireframing my product so that I could conduct another round of testing, this time with a digital artifact
4. Testing
4.1 Project planning
In order to start an interactive project, is extremely helpful to plan it in advance, so that is what I did. This is not a rigid plan, this is more like a guide that you will be modelling through the project and that will help you framing the time and the scope of your project.
4.2 Interactive prototype
In order to get the most of my testing, I created an interactive prototype that will allow users to interact with it as if it was the final product.
4.3 Testing script
Is very important to have a goal and a structured questionnaire so you can get the most of you testing. I created a testing plan and protocol to make sure I will gather the right information.
4.4 Testing with users
This is where the real fun started, observing people interacting with your product is what makes the different in product design
4.5 Compiling testing results
Before taking any decision I compiled the results of the testing in a way that I could use to base my design decisions on.
4.7 Create a B version based on feedback
Having an alternative version is a very useful technique in design so you can compare two different versions and get an idea of what design perform better and improve your product based on the results.
4.8 A/B testing
I have never experienced an online testing tool but I was really surprised about how easy and quick is to get valuable insights on your product.
4.9 A/B testing compilation
Testing is in my opinion the easiest part, later you need to analyse the results and take design decisions based on it, so this is a very important step in the desining that will lead you to a refined version of your prototype and probably, will go into development and become a product in the future.
4.10 Design iteration to produce a prototype based on findings
Based on the previous step I created a prototype that I hope, it will become a product one day.
Powered by WPeMatico