Aurora Studio is an e-commerce company that sells artwork on clothing as well as other products. Their website needed to be redesigned to allow for customers to more efficiently find and purchase products.
To better understand the layout of the current website and where redesign opportunities were, we used a heuristic evaluation, which showed that the main violations were related to efficiency and error management.
efficiency: 11 violations
(How quickly can users complete tasks?)
SATISFACTION: 6 VIOLATIONS
(How pleasant is it to use the design?)
LEARNABILITY: 4 VIOLATIONS
(How easy is it for users to accomplish basic tasks?)
ERROR MANAGEMENT: 2 VIOLATIONS
(How easily can users recover from errors?)
MEMORABILITY: 1 VIOLATION
(How easily can users reestablish proficiency?)
After these findings, we conducted a competitive & comparative analysis to better understand the business space. From this analysis, it was clear that while Aurora Studio's website may be more limited compared to some bigger companies in terms of products and features, it makes up for it in its unique curation. By having a more limited number of artists, and with many of these artists being Persian and Iranian, Aurora Studio can offer a more curated and personalized experience for users.
We conducted two usability tests with 8 users on the current website. Users were tasked with finding specific products to test out how intuitive the navigation and menu/filter categories were. It took users longer than we expected to complete both tasks, and with several errors. Most of the errors and extra time were due to confusion over menu and filter categories.
9 interviews
We interviewed both current and potential future Aurora Studio customers, including people who have experience online shopping and appreciate art.
Takeaways
-I appreciate efficiency because I value my time.
-I want to ensure my expectations (fit, quality, cost) match reality when online shopping.
-When I shop online, I question if I really need it.
-If I am wearing a graphic design, I need to believe in the message.
-I think art is important.
Aurora customers need an efficient, trustworthy, and convenient way to find and purchase a product with artwork they feel connected to so that they can be motivated to add the item to their wardrobe and feel confident in their purchase.
So, the solution for the redesign needed to utilize intuitive navigation and increased attention to artists, so that customers can more efficiently and conveniently find products and will feel confident in their purchases.
Before expanding upon this solution, we determined what our priorities for the redesign would be.
From this, we could expand upon our solution statement to include the following specifications:
-navigation process will be more efficient and intuitive for users.
-menu categories and subcategories will be reworded to be more user-friendly
-better showcase artists and their work, so that users can better understand how the website connects
-clothing to artwork, and learn more about art styles
-allow users to create a profile to save their information and past purchases
-allow for user reviews of the product pages so that users can feel confident in the quality and fit of the products
-lay out how much money from a purchase will go to the artist, for increased price transparency
We wanted Aurora Studio's potential users to be the ones to dictate how we might re-word and re-organize the filters. To do this, we led 11 open card sorts, where users were given pictures of various artwork from Aurora Studio's website, and were prompted to categorize them in whatever categories they saw fit. A majority of users used words such as "abstract," "minimalism" and "pop art," as well as descriptors like "funny," "Zen," or "space." We used these to begin to try out different filter categories.
Redesigns: Low fidelity prototype
First, we help a design studio to sketch out the basic layout for the website, starting with the home page. From there, we created our low-fidelity prototypes before turning to usability testing.
.png)
How are users navigating the low fidelity?
We asked 4 individual users to complete the following 4 tasks:
.png)
Since the first task of finding a t-shirt took users slightly longer than anticipated, we made the text sizes for "product" and other categories larger to make them easier to see. To read reviews, most of the errors were simply that users clicked on the stars or amount of reviews, instead of clicking the "reviews" option below. This indicated to us that we should make those clickable options as well.
Finding a hoodie with an abstract design on it was more challenging for users because our headers were not clear. All users were confused about the terminology of "theme," so in our next fidelity we updated the wording.
.png)
Redesigns: Mid fidelity prototype
In addition to making updates based on our first round of usability tests, we began to add some more text and detail to the next version of our prototypes, our mid-fidelity prototypes. We also cleaned up some of the margins, spacing, and overall formatting, to make it look a bit more polished.
.png)
How are users navigating the mid fidelity?
We asked 4 individual users to complete the 5 tasks below. We repeated two of the same tasks, to test if we had improved upon them both in terms of efficiency and in terms of error management. We also added a few more tasks, to continue to test how intuitive the navigation and wording was, and how findable certain key information on the website was. Again, our user research showed us that these features were important to help users feel confident in their purchases.
Overall, we saw more success than in our previous tests, but still had areas of improvement that are highlighted below.
.png)
When users tried to find a hoodie with an abstract design on it, half of the users tried to use the artwork showcased on the home page first, instead of clicking into "shop." One user also failed to use the filters right away. We solved for this by embedding the artwork more on the page through clarifying text and better contrast to highlight where users could go, and made the icons clickable to navigate into the shop.
.png)
.png)
Redesigns: High fidelity prototype
.png)
How are users navigating the high fidelity?
We asked 4 individual users to complete the 4 tasks below. Again, we repeated two tasks, finding a hoodie with an abstract design on it, and finding how Aurora Studio supports artists, because users did not successfully complete those tasks in previous tests. We also wanted to test other flows, such as finding a design on other products, and searching for an artist.
Overall, we decreased the amount of time needed for each task and therefore increased efficiency. By solving for pain points in previous design iterations, we were able to have more successful tasks in the final rounds of testing. We were also able to create more interaction and potential pathways for users to take, which decreased the amount of errors.
.png)
For information on supporting artists, it was clear that we needed to make that information more visible through increased text sizing. We also added a new section about how pricing works under "Our Journey" page, to make it more discoverable. But, this task should be further tested.
.png)
With more time, I would advocate for conducting more usability tests until each aspect of our redesign was completely intuitive and friendly for users. And, it would be important to monitor sales and other quantitative analytics to see if our solution does contribute to more users successfully checking out and being happy with their purchases. Lastly, we would want to begin working on a mobile version as well for users who prefer to shop on their phones.