E-Commerce | UX UI Design Bootcamp IronHack — Case Study
Team — Bruno | Jacqueline | Diogenes
Duration — 5 days
Tools — Figma | FigJam | Google Docs
Intro
I’m excited to share with you my second project as part of the UX UI Design Bootcamp at IronHack, this time we had to devote most of the research time doing market research and conducting a competitive analysis in order to deliver great online shopping experiences for end users of desktop devices.
Goal
After reaching out for business owners who would be interested about cooperating with the team to expand their business, the goal was to create an e-commerce website for customers who love to shop vintage products, according to the User-Centered Design Methodology combined with the Agile methods.
Constraints
Our business partner was Melissa Greenauer, owner of Greenauer Design Group Inc., an Interior and Architect Designer who wishes to have an online shop where she can sell one-of-a-kind, organic and timeless pieces of furniture and home accessories. The main constraints were the fact that customers would usually prefer to buy these products in brick-and-mortar stores rather then from online-shops because of the touch and feel experience.
Timeline
The team participants were Jacqueline Vujica, Diogenes Freitas and Bruno Pulheze. We had a flat hierarchical team approach and cooperated together in many tasks but also worked individually.
Business Strategy
In the beginning, the team interviewed the stalkholder to learn their values, what were the business objectives, the target audience, the competitors and the potential threats to their business. Next, we build a competitor matrix to understand the competitors’ strengths, weaknesses and strategies. In addition, the team created the Jobs-to-be-done Framework and the Job Stories to describe the task that the customers want to achieve. Finally, we put all the data results gathered with the business analysis and applied them onto the UX Stragegy Blueprint.
User Research
Next, we conducted a Survey created on the Lean Survey Canvas and interviewed customers who have the habit of buying furniture and home accessories online. After gathering enough data during the research, we used the Design Thinking tools, i.e. Affinity Diagram, Empathy Map, How Might We statements — in order to interpret the results be ready to create a User Persona and the Problem Statement and Hypothesis.
User Persona
Our User Persona is an engineer based in NYC, USA. She has gotten married recently and as a business woman, she does not have time to visit brick-and-mortar stores in order to decorate her new apartment. She would rather purchase the products online. Though she fears that the appearance and details of the products are not going to be exactly how she saw them online, causing her frustration.
The work
After creating the User Persona, we were ready to move on and elaborate the User Journey Map and the Storyboard, to help us understand the customers’ Pain Points, Gains, Emotions — and also the touchpoints and channels they communicate during their shopping experience.
Information Architecture
The next step was to build the Sitemap to exemplify the relationship between the pages in the website and the User Flow to focus on a limited task to be accomplished by the customer, where they have to add a product to the shopping cart. Besides, the team tested how the users would organize categories and menu items through Card Sorting at an online platform. Another useful tool was the Moscow Method, which we used to learn how to prioritize what features would be included in our MVP.
Low-fi
Based on the data collected during the Business Analysis and the User Research, we combined our efforts and brainstormed using some ideation exercises to find a solution on how to better address the Problem of displaying furniture and home accessories in order to provide the user with a satisfactory shopping experience. Our main idea was to highlight the main features of the product that connects and are consistent with the brand identity and on the product page, we decided to showcase the products on an image gallery with high quality images and video, to provide the user with an in-depth showcase of the product.
Mid-fi and Testing
The team created a mid-fidelity prototype on Figma focused on a limited task, where the users can select a product from the main category page, on the product page they can enlarge the video on the image gallery, check the description and product details — and add an item to the shopping cart.
We had the usability test run on Useberry plugin with users that provided us with feedback about their behaviour while navigating on the prototype.
Outcomes & Lessons
The end result for the specific test of selecting a product from the category page, checking the product’s details and adding it to the shopping cart was successful and the initial goal was fulfilled.
The teamwork made us achieve a satisfactory result towards building an e-commerce website for a well established business and provided the stakeholder with a solid business and marketing research.
We learned how to approach and work with a stakeholder, develop a business strategy, empathize with the user, find the sweet spot between the business’ and users’ needs, assess and interpret the data collected from the researches and apply them on a design solution, a mid-fi prototype.
