For this project I was provided a brief to redesign a e-commerce website which due to support local small business. After search on google, I located this site as my redesign target -- Cactus.Store which is a company selling cactus plants and some relevent products online, they also provide some garden service like green house and furniture customization.
The purpose of the Contextual Enquiry was to quickly and easily find usability problems related to shopping experience and product listing. I went through the whole website while assessing the site against general principles for interaction design of a e-commerce website. Below are the key issues I discovered.
Users found it is hard to directions to groups of products.
They have some good images but too much text and mess layout make all information hard to read.
They don't provide a clear navigation menu to tell users where the shop entrance is.
All products list on one page makes users hard to find the product they want.
To gain some inspiration for my project and see what good features others e-commerce site provide. I conduct the C&C analysis. I began by identifying 4 main competitors, they are all popular online plants stores. The direct competitors analysed included Bloomscape, The sill, Easy Plant and Leafy.
The indirect competitors were Ikea, HomeDepot and Stock X. My goal was to compare and identify common and unique features across these sites and find potential opportunities for Cactus.Store to provide a better shopping experience. The most important takeaway from this analysis was learning how different websites use these features help users find the products they need as easy as possible, This was helpful insight that helped me determine the focus points of the next research phase.
To better understand how the current site works to find the redesign key points, I created a user flow that accesses to purchase a plant from browsing to check out as a happy path. The most important takeaway from this part is the website lacks a searching feature, so whether users have product options in mind or not, they have to start from a category to find the relevant items. It could be a big frustration.
Bring the key point I found in user flow and c&c analysis, I wonder know users more, so I conducted the user interview to see if my assumptions really impact the users online shopping feeling. I asked some questions about their previous experiences with plants purchase and online shopping.
From the results of the interviews, I used affinity mapping to organize these insights. I put all the audience quotes together and tried to find some trends to clarify what my target audience needed during online shopping. Eventually categorized nine themes with 31 insights. I list five main insights my participants mentioned most. Affinity map details here.
”I want a clear category to help me find what I need for a quick“
“I’d love to see some relevant items if I need them”
“I feel helpful read other customers’ reviews first”
“I use filter to target my product efficiently”
“I want a more detailed description of the product to make sure the actual thing is the same as the picture”
“I wonder a easier way to check out ”
According to my synthesis data through affinity mapping, I created a persona , Linda who is a hard working designer live in Los Angeles, she is a plant lover but not a expert, it is hard for her shop by terminology. Based on my persona, I synthesized all her needs into problem statement :She seeks the quick and easy online shopping experience can find her desired product and check out as soon as possible.
In User Journey map process, I created a scenario on what was the process of buying a cactus on current website as my persona Linda. I splite 5 main process from before visit our website to check out.
At this stage, it was time to redefine the goal and narrow down its scope based on the insights gained from users.
Linda is a plant lover but not a plants expert, it is hard for her shop by terminology, She seeks the quick and easy online shopping experience can find her desired product and check out as soon as possible.
I focused on the following improvements when designing the initial low-fidelity wireframes.
After defining the pain points and solutions through Journey map,I created a new user flow, add on search by keywords feature and products filter to help user find their product more fast.
The site map was created to give me a clearer picture of the navigational hierarchy for the new website.
After finishing the sitemap, I created the wireframe by Figma; I used my site map and new user flow as a guide and organized all my insights from the exploration phase. Make sure to prioritize the features that best address the users' needs throughout the website.
I conducted a usability test with 4 participants and asked them to complete three different scenarios to test if the website can reach their goals. Overall users were able to locate products and information easily fits my expectation. However, most of them didn’t hit the buy now button, they were afraid of hiding fees, they prefer to see the ESTIMATED TOTAL before the purchase. So I removed the buy now button in my final design.
For the home page, I redesigned the layout to make all information more readable. I added a secondary navigation menu and search bar to help users find their products more efficiently. Creating the feature items section gives users more options. Social media and our story help users better understand the company and promote their business. Contact information as a footer.
On the category page, I also redesigned the lay out, organized nine items per page, and contextual navigation to help the user know which page they are on. Add on a filter feature help them find their products more efficiently
For the product page, I made a review section, users can read some reviews before they purchase, I also add more descriptions like care tip help users know their product better.
I designed a save payment and address feature hope to save users time when they check out.
The updated product listing form is easier to navigate, provides clear guidance and instructions, and is flexible for vendors to use.
In order to further improve the shopping experience on Cactus.Store, If I got more time I will :