E-commerce Website Re-Design
DURATION:
2 WEEKS
ROLE:
UX DESIGNER
TOOLS:
FIGMA + PHOTOSHOP
Objective
As a team of 4 UX designers, we were tasked with investigating and enhancing the online presence of a local business within a span of 10 days. As part of this assignment, we were required to design a responsive website, optimized for both mobile and desktop/ laptop use.
Considering the time constraints, we decided to approach this challenge in a structured manner. I will now outline our process;
What I did
My role was parallel to that of my team members, all UX designers. We oversaw the entire process, from stakeholder interviews to the delivery of the website. However, I placed more emphasis on the brand attributes.
What I’ve learned
It is important to have a good understanding of the stakeholder’s pain points. When it comes to research, it is crucial to ask the right questions. There is no room for personal interpretation. This prevents miscommunication and ensures that the end product solves the stakeholder’s problem in a way that resonates with them.
Table of contents
Stakeholder
We had the honour to work together with the owners of “Blue Story,” a boutique in Eindhoven, The Netherlands selling ceramics from Poland. This is their current website. We were given the opportunity to design a new website for them.
Discover
Our business analysis involved asking questions to Chris, the co-owner of Blue Story, with the aim of understanding Blue Story’s goals. Such as attracting a younger audience and increasing revenue, while retaining their current clientele.
We delved into competitor research and explored sources for insights, like potential customer buying behavior.
Employing tools like competitor analyses and perceptual mapping, we assessed Blue Story’s strengths and weaknesses compared to competitors. It became evident that Blue Story lagged in several aspects. Like for example they didn’t have active customer reviews. No e-commerce promotions. Nor did they had multiple language options. The website was in Dutch.
- Perceptual mapping
- Competitor analyses
Define
Armed with competitor analyses findings, we conducted user experience research with 4 ceramic enthusiasts aged 20–40. Our goal was to comprehend their purchasing preferences and collect insights on their user experience on Blue Story’s existing website.
Using insights from UXR interviews, we created an affinity map to identify key themes — the website’s look and feel, target customer/group, and unique selling points. With this, we were able to create a journey map as well.
To then create a user persona and problem statement.
Problem statement
Meena, a 35-year-old expat, needs to find handcrafted ceramics online because there is no local ceramics store in her town.
Develop
Our team held a sketch session using the crazy 8s method to generate ideas. Using the MoSCoW method, we then prioritized ideas, such as translating the website and presenting products dynamically. This aimed to find solutions for all the challenges Meena encounters in her search for ceramics.
- Crazy 8’s
- MoSCoW
- Userflow
After several iterations on the lo-fi prototype, we developed a mid-fi prototype, which we tested within our network. This allowed us to design the hi-fi prototype with the final adjustments.
Deliver
Our end product was a completely revamped, translatable, and more user-friendly website, not only in terms of its visual aspect but also in making it easier for customers to place orders. However, we still prioritized maintaining the authenticity of the store throughout the renewal, fully meeting the stakeholder’s preferences.
CLICKABLE PROTOTYPE
CLICK AROUND THE APP HERE >
Conclusion
One valuable lesson learned is the importance of clearly defining the scope for implementing changes with the stakeholder. In our project, prioritizing the development of a translatable website emerged as crucial, just to name one example. Yet, this undertaking also entails a fundamental shift in business operations. Therefore, effective communication with the stakeholder on these matters becomes paramount.