UX/UI design for a soap and shampoo refill station.
Overview
This project involves the design of a product interface following the Sprint model, an agile methodology that seeks to solve complex problems efficiently and quickly.
Throughout a week of intense teamwork, we have applied various techniques and tools to reach an optimal solution.
Throughout the entire process, we have maintained a user-centred approach, constantly seeking to understand the user's needs and desires in order to deliver an optimal experience.
We have to plan and develop the user interface design for an automatic filling station for different types of soaps.
The user should be able to choose between two varieties, pay and fill his own container.
This project is developed in a team of four people.
Understand,
Define,
Sketch,
Decide,
Prototype,
Validate.
Before starting the sprint, desk research is done in meeting. This way we can find insights, to start with a hypothesis.
Business ethics:
'If we can help you find the perfect product for your needs,
you will be getting good use of your money and we will have one more regular customer.
In this way we put an end to unnecessary consuming of products and waste.'
Hypothesis:
The vending machine should inform the user of the products it dispenses in detail,
in order to continue the company's work ethic.
Sprint Questions
Once we have a hypothesis, a series of questions about the operation of the device are set out.
These questions are framed as 'Will the user be able to...'?
Will the user be able to know which type of shampoo is best for their hair or skin type?
Javi
Will the user be able to choose the amount of product to dispense?
Daniela
Will we be able to let the user know that by purchasing from our machines their contribution will support a number of charitable causes?
Dennise
If there is a problem during the purchase, will the customer be able to request technical assistance through the machine?
Daniela
Will the user be able to know, in addition to the products currently being dispensed, which products will be available in the near future?
Javi
Will the user be able to try the product before dispensing?
Dennise
Will the user be informed of the date the machine was refilled, to know if the product is fresh?
Javi
Will the user be able to rate their satisfaction with the purchase?
Irene
Will the user be able to track previous purchases?
Dennise
Will the user have any way of knowing the locations of the machines?
Daniela
Will the user be able to easily access their user account?
Irene
'HMW' and Clusters
This process helps us to change our mindset from looking at questions to looking for solutions.
These 'How Might We' are then organised on an affinity wall.
Strategy
EthicsLoyalty
How might we get the vending machine to support Lush's social causes?
Daniela
How might we create some sort of discount?
Javi
How might we let the user know that Lush products are not tested on animals?
Dennise
How can we reward user loyalty?
Irene
Interface
CapacityInformationProductsSupport
How might the user be able to distinguish between different quantities?
Javi
How might we make the user aware that they need a container?
Daniela
How might we let the user know which products are being dispensed?
Irene
How might we let the user try the product?
Dennise
How might the user know the correct size of container for the amount of product they need?
Daniela
How might we help the user to evaluate the shopping experience?
Irene
How might the user know which type of shampoo is best for them, according to their hair or skin type?
Dennise
Interface
CapacityInformation
How might the user be able to distinguish between different quantities?
Javi
How might we make the user aware that they need a container?
Daniela
How might the user know the correct size of container for the amount of product they need?
Daniela
How might we help the user to evaluate the shopping experience?
Irene
ProductsSupport
How might we let the user know which products are being dispensed?
Irene
How might we let the user try the product?
Dennise
How might the user know which type of shampoo is best for them, according to their hair or skin type?
Dennise
Understand,
Define,
Sketch,
Decide,
Prototype,
Validate.
Possible solutions
Outline of ideas around the HMW questions.
First looking at all possible solutions, and then voting on the most appropriate one.
HMW
How might the user be able to distinguish between different quantities?
Solution
We can put an illustration showing the most common sizes of packaging.
Dennise
HMW
How might the user be able to distinguish between different quantities?
Solution
We can put an illustration showing the most common sizes of packaging.
Dennise
HMW
How might the user be able to distinguish between different quantities?
Solution
We can put an illustration showing the most common sizes of packaging.
Dennise
Understand,
Define,
Sketch,
Decide,
Prototype,
Validate.
Crazy 8
In a short time, each member generates their own 8 ideas for solving the problem.
When the exercise is over, the ideas that are worth working on in more depth are discussed and developed in whireframes.
'The user selects the product they want.'
Whireframe
Understand,
Define,
Sketch,
Decide,
Prototype,
Validate.
User stories
User stories will help us to create our flows, test our application, reduce the steps that the user has to do to achieve their goal...
they are a very powerful tool.
User storie:
As a user with sensitive skin,
I need to know which ingredients are contained in the shower gel
to ensure that it is safe for my skin type and to guarantee my purchase.
User Journey
Understand,
Define,
Sketch,
Decide,
Prototype,
Validate.
Moodboard
We developed a moodboard to bring together the aesthetics of the company.
Understand,
Define,
Sketch,
Decide,
Prototype,
Validate.
Prototype + User Test
After making the first prototype, a user test is carried out, where two tasks are performed.
After identifying the complications that can develop on each screen, a second prototype is developed and adjusted.
User test 1
Task: Check the ingredients of the shampoo 'Daddy - O'.