A Gin pins collection

Buying Gin pins online — An E-commerce Challenge

For the first two weeks of our UX/UI Design Bootcamp at Ironhack Amsterdam, we had to work on an E-commerce project. The original guideline said, more precisely, a local E-commerce project.

The idea was that “local shops often suffer a decrease in their annual sales due to more and more adoption in online purchases through options like Amazon or eBay.” But due to the pandemic, this aspect had to be reconsidered. My partner in design, Matty Acton, was working from Spain and I was working from France. Visiting a local store and observing it was, unfortunately, not an option for us.

Some of Tipsy per Tutti super cool pins!

Stage1: Empathize — Understanding the user’s needs

To understand what the usual cocktail-pin buyer wants and needs when buying online, we had to do some research.

The first step was to look at direct & indirect competitors’ websites and create a Brand&Features Comparison chart. That way we would understand better what was standard and what was extra.

The brand and feature comparison chart for Tipsy per Tutti (don’t mind the mess!)
The Lean Survey Canvas helped us shape our survey.
Our Interview Guide helped us keep the interview focused and efficient.

Stage2: Define — Defining the problem

We used this to process the results we got from the surveys and the interview.

An Affinity Diagram is a creative tool used to generate, organize, and consolidate information concerning a product, process, complex issue, or problem. What we learned from it was that the customization/personalization feature we originally thought would be a great and fun selling point actually wasn’t a big interest at all. The big reason for that seemed to be that pin buyers mostly buy pins as souvenirs and don’t really want to design them except if the process was made super easy. So Matt and I decided to entirely drop the pin customization feature.

The Affinity Diagram revealed interesting patterns.

The user needs to know where the pins come from and who made them because they want to support the artist.

The user also wants to know what other customers have experienced, and where they can be shipped to because they need to trust the store/seller.

This statement then helped us write our hypothesis statement:

We believe that by providing information about the artist including product review info and listing shipping information, Tipsy per Tutti will achieve its goal of building more trust and engagement with its products. We will know we are right when sales on tipsypertutti.com website increase by 15% in the next quarter.

As a next step, we had to create a User Persona. The goal here is to keep our efforts human-centered. Fleshing out our persona helped us better understand the final user, keep in mind the user’s needs, and avoid projecting our own goals into our design.

Doesn’t Chris seem like a great guy?
Chris’ journey is a real roller coaster…

Stage3: Ideate — Challenging assumptions & Creating ideas

The two previous pages gave us a good building ground for the next steps of our project.

To prioritize our solutions, we placed them in a MoSCoW chart. This helped us determine what we had to implement in this prototype and what we could leave out for now by classifying what our prototype Must, Could, Should, and Will Not have.

MoSCoW Prioritization tool
The Site Map helped us visualizing our new website as a whole and in a structured way.
The User Flow shows the different canals and user paths when buying pins.

Stage4: Prototype — Creating solutions

As the last step in this challenge, the prototype implements the solutions we identified on Stage3 into a mid-fi wireframe.

A sneak-peek into our final wireframe


Those two weeks were rich in learnings and experimentations.

I am super grateful to have joined this Bootcamp and to have had the opportunity to try remote working with Matty Acton: a complete stranger who turned out to be a highly compatible co-worker and a great guy! The remote working tools allowed us to work as a team at all times. I greatly appreciated the fact we could come up with ideas that weren’t always the best without judgment: I truly believe this is the best environment for finding solutions.

UX Designer focused on creating meaningful & lasting bonds through technology. I want to design experiences that bring people together for real! she/her