Visiting furniture stores can be time-consuming and due to the pandemic, it is not as preferred
as before. At this point, online stores provide customers with many solutions, such as instant payment, other customer reviews, and augmented technologies, to enhance the real-life experience and easy price comparison.
as before. At this point, online stores provide customers with many solutions, such as instant payment, other customer reviews, and augmented technologies, to enhance the real-life experience and easy price comparison.
About the project:
Maynooth is a non-existent web-based online furniture shopping platform. On this website, users can browse, observe, select, and add the product to their cart similar
to other furniture websites. However, this design aims to maximize customer satisfaction
by offering several solutions such as easing the search, browsing, and payment experience
along with a wish list, augmented technology, and customer review functionality.
to other furniture websites. However, this design aims to maximize customer satisfaction
by offering several solutions such as easing the search, browsing, and payment experience
along with a wish list, augmented technology, and customer review functionality.
Please click on images for high resolution.
Project duration:
November 2021 to March 2022
My Role:
UX design and research of the Maynooth the website from conception to
a high-fidelity prototype.
Tools:
Adobe Creative Cloud Express, Adobe XD, and Miro
November 2021 to March 2022
My Role:
UX design and research of the Maynooth the website from conception to
a high-fidelity prototype.
Tools:
Adobe Creative Cloud Express, Adobe XD, and Miro
The Process:
Here is the iterative design process:
Starting with Questions:
I conducted informal interviews with 20 participants to be able to determine the initial problems with shopping for online furniture. I tried to scale down the common problems noted below:
The Challenge:
The challenge was to provide users with a furniture shopping website with a better
experience focusing on easy navigation, payment, and browsing. Building trust with
the customer was another challenge while buying a product. Another focus point is
to make sure users feel the in-store experience as possible while observing a product.
experience focusing on easy navigation, payment, and browsing. Building trust with
the customer was another challenge while buying a product. Another focus point is
to make sure users feel the in-store experience as possible while observing a product.
Mind Mapping:
I tried to organize and put the ideas in my mind in a structure systematically. With this method, I could see the bigger picture of the project more clearly. Here is the mapping:
Market Research:
I performed market research to be able to understand and analyze the consumers' behaviours with validated statistical data and I was also able to narrow down the relative competitors in furniture e-commerce. Therefore, I was able to come up with key findings that helped me to shape my thought process for my project for further steps, especially for persona creation and competitor analysis. All statistics and numeric data are obtained from Statista and Pew Research Center.
Key findings:
- Online shopping behaviors are relatively more common across a wide range of younger adults ranging from 19 to 29.
- More than half of the given age range consumers always check for reviews before purchasing items.
- Users want to navigate easily.
- Users mostly prefer fast and easy payment options.
- The product should be shareable on social channels.
- Online shopping behaviors are relatively more common across a wide range of younger adults ranging from 19 to 29.
- More than half of the given age range consumers always check for reviews before purchasing items.
- Users want to navigate easily.
- Users mostly prefer fast and easy payment options.
- The product should be shareable on social channels.
Competitor Analysis:
To be able to understand the strengths and weaknesses of the product I conducted a competitor analysis. I determined the competitors from surveys and market research data.
Key findings:
-The most common features are detailed product information, special offers, easy navigation, readable fonts, and high-quality images.
-As an opportunity, we can consider the 360-degree view, shareable on social media, customer reviews, and wishlist features.
-Products can be curated for specific concepts instead of a random order.
-Bloated homepages can be reduced to a simpler and more efficient page style.
-The most common features are detailed product information, special offers, easy navigation, readable fonts, and high-quality images.
-As an opportunity, we can consider the 360-degree view, shareable on social media, customer reviews, and wishlist features.
-Products can be curated for specific concepts instead of a random order.
-Bloated homepages can be reduced to a simpler and more efficient page style.
Survey and Personal Interviews:
I conducted personal interviews and surveys to address the pain points and understand the user's points of view regarding challenges and requests for further improvement of my project.
I performed personal interviews with 5 participants via Zoom and for surveys, I asked 20 participants to complete an online form formatted survey. I tried to keep the age range comprehensive but I tried to focus on participants aged 19 to 29 due to previous research results.
With this quantitative and qualitative data, I created personas, affinity diagrams, and scenarios to better understand users.
For the personal interviews, I try to choose people with a different approach that do online shopping and previously bought furniture online, prefer in-store shopping, and never use online shopping but consider it for the future.
Aside from personal interviews, surveys helped me to come up with statistics about
user insight toward shopping more quantitatively.
user insight toward shopping more quantitatively.
Combining the results from the data-gathering process I pointed out some key findings
which are:
which are:
Grouping and Organizing Data:
After collecting the qualitative and quantitative data, I grouped and organized all the information in the affinity diagram to create persona and empath maps.
Creating Persona:
Considering the collected information, I created a primary persona to be able to understand the challenges and goals of the user. Persona information helped in the creation of an empathy map and a user journey map.
What Do We Know About the Persona?
I created an empathy map to understand the user and to focus on what we know about the persona visually.
Walking With User In a Scenario:
After collecting and visualizing the data, I managed to come up with a user scenario:
Marcia is looking for a new sofa for her living room. She wants to find the perfect fit according to several features such as color, size, and style. Unfortunately, by the time her shift ends at 6 pm, the furniture stores are closed. She hears that her colleagues are shopping from popular websites to save time and also to be able to see more options at any time from the internet.
She decides to search for a website and selects one of those websites and observes the main page. Before performing the search for a sofa, she had to close several ads on the website along with pop-ups. She searches for sofas from the search bar and is directed to the result page where the variety of sofas is represented. She finds the search results exhausting and wants to filter the results. She proceeds to the filtering option however she finds the filtering tab confusing and eye-straining.
She selects a product from the results and is directed to the page where product details are displayed. She checks the product details along with pictures. She observes that there are no 360 views and customer reviews. She feels insecure due to those factors.
She likes the product and saves it in a wishlist and continues with other products to see more and compare. She finally decides to buy the selected product. She checks delivery and discount details and completes the purchase action and feels excited to see her sofa in her living room.
Can We Find Any Opportunities?
Understanding of User Interactions:
From start to end I was able to create a user flow with the help of previous information. Based on the scenario I created the user flow diagram to give a better understanding of user interactions through the website navigations.
Information Architecture:
Low Fidelity:
I requested from my friends who are suitable for the persona to check my low-fidelity prototype. This small but effective checking method helps me to prevent future design problems before getting to the high-fidelity prototype. I performed comprehensive and final usability testing after a high-fidelity prototype.
Homepage Wireframe
Search Results Wireframe
Catalog Wireframe
Product Page Wirerame
Error Wireframe
High Fidelity:
Below are some captures from the high-fidelity design. Click the button below to see the full project.
Homepage
Catalog
Search Results
Product Page
360 View
Contact Page
Error Page
Design and Style Guide:
To touch upon the design and style guide I have created, I considered color psychology and I found that the semi-dark pastel colors evoke openness and relaxation. Also, I observed my competitor's UI, how they use colors tones etc. so I created a few alternatives and I decided on my current system.
Usability Testing:
I performed usability testing to gain a better understanding of users’ expectations, insight, and reactions with 4 people who were suitable for the persona profile. I came up with a test plan to follow such as searching for a product, navigation, browsing and product detail questions.
I tried to establish metrics for users such as time on their task, speed, goal fulfilment, and expectations.
I tried to establish metrics for users such as time on their task, speed, goal fulfilment, and expectations.
Results and Improvements
Most of the tasks were completed successfully aligning with the expected business goals. The other metric results were close among users. Overall navigation including the navigation bar and breadcrumbs along with the search bar, minimal product catalogue, and 360 views were the most liked features whereas the filtering option and lack of a more dynamic carousel were the most disliked and complained about.
Future Considerations and Conclusion
For future considerations, I plan to improve the disliked features, and additionally, I want to display the most popular and unique offered products on the homepage. I will add fast payment and account details in both design and user flow. Lastly, I will add more space to product specifications such as picture carousels.
In conclusion, I learned a lot about e-commerce websites in terms of both design and business goals. I went through a hands-on learning experience while visualizing my data and metrics because it was my first time using Miro to create flows and diagrams. Also, I enjoyed learning micro-interaction dynamics on Adobe XD.
While creating the high-fidelity prototype, I realized that I spent so much time on the details which sometimes hinder my vision for the main functionalities. I learned to equally distribute the tasks according to their needs.
