The Problem

There are so many variables to consider during the product evaluation process. Not only does the research process vary from person to person, the different aspects of a product to consider can vary from product to product. Additionally, there are a multitude of journeys to consider depending on the intent and need. Coming to a decision on a product(s) can look different for each person and our challenge was to accommodate most, if not all of the different ways that people prefer to research for all types of intents and needs whether through blogs, videos, online stores, publications and so on.

One example that illustrates the nature of this painpoint is something we call "attack of the tabs" where a single product search can start with a blog post that links to a slew of tabs being opened for ingredient fact checking, review validating, in-action video browsing. By the end of the whole process, you may or may not have formed an opinion about which products to purchase.

Exploration: How we tested the very first version of our product catalogue webapp with a group of 20 Alpha users using Facebook groups and Fullstory.

Our research first started out with dozens of generative user interviews asking people about their product exploration and research patterns. We found that there are primarily four different content types that people prefer to access when evaluating a product-- images, videos, reviews and ingredients. Every person's method of evaluation and preferred content type can vary greatly and be wildly complex depending on who/what they trust and how they build a case for or against a product. One of the more interesting permutations of this process is represented in our Youtube video skin type and skin tone filters. Evaluating how a product performs virtually can be tough so people turn to the next best thing-- which is watching someone else who shares their skin type and skin tone apply or review the product on Youtube. So, we built a skin tone and skin type features into the videos tab (see image below). It's worthwhile to note that beauty users will often rely on multiple content types and sources so it's important to cover the entire landscape of information available online.

With our testing platform running and ready to go, we started to research with a group of 20 Alpha users that would use Mira consistently over the course of 2 weeks. The group was hosted on Facebook and there were or “quests” set up every few days that would aim to test various aspects of the app such as recommendations, product pages, search. By the end of the two weeks, we invited a couple of the most active member within the group to our physical office to do a final, comprehensive 1v1 user interview to get feedback on the process as well as a more generative round of research that explored what future iterations. Through the last round of interviews, we concluded that while all forms of content that we provided were valuable, the form factor of the information was one of the key areas of improvement. While all forms of content that we provided were valuable, Mira’s value cannot truly be realized if people can’t effectively navigate through that information.

Learnings: how we continued to improve our catalogue by improving our data form factor (or data visualizations) through our Beta iOS app.

Old title - Further Testing and Improving Data Form Factor with Beta
In this next round of iterations, our “All Reviews” section was one of the largest focal points for improving data form factor. This section of content easily recieved the most amount of attention (time spent) and scrutiny. It was important to people that “all reviews” was easily searchable via sentiment (positive and negative reviews) and facet (longlasting, matte, etc). By the time our Alpha research sessions concluded, we had a pretty complex system to evaluate and sift through reviews.

From the product page itself we organized review via “Top Reviews”, “Pros”, and “Cons”. Underneath was a system of tabs and cards that highlighted key excerpts of the reviews. Below that was a graph that sought to illustrate the “intensity” of that facet (i.e. smoothness) in comparison to all other similar products that also mentioned that facet. No wonder people were overwhelmed looking at our product page-- what was supposed to be a simplification of data became an over-complication because there were so many visualizations left for the viewer to process and digest.

Review cards at Beta launch

This was a classic case of less is more. After many more rounds of testing, we learned that if the reader can’t gain a sense of what the overview is saying in a matter of a few seconds, we’ve not really provided an overview. So, we went back to the drawing board and started to iterate upon the "review overview" concept. There were many layers of information to consider from the UI of the cards themselves, the data form factor, as well as the language. We found that

• People really enjoyed being able to understand a product "at a glance" in a single view as opposed to a more detailed view that required more swiping
  
• People were able to understand the over view better when we used a single label (number of reviews)
• Even when people understood a facet to be good or bad, they always wanted a sense of scale. Number of reviews was the most helpful label
• Color cues were an important tool that helped people quickly asses the strengths and weaknesses at a glance
  

Solutions: an overview of the “finalized” version of a product page & takeaways (although nothing is ever really final)

Our final iterations allowed people to get good sense of the pros and cons of any given product from a cursory view due to the color signals and the visually comparable bar graphs. It's interesting to note that the final versions of our data visualizations didn't actually communicate the power and complexity of Mira's utility. At first we thought that our more complex datasets (such as z scores) would be helpful for people to understand and while some power users really loved detailed stats, most people just wanted  a gut feeling. They wanted to know, quickly, if the product was "good" or "bad" and gain a sense for how good and how bad.

This module became a cornerstone feature of Mira’s product page and even made its way into our marketing material because it is the most concise representation of our value proposition.

Aside from our Review Overview, we continued to iterate upon key features that would best showcase the primary 4 content types. Some of these features include the product swatch gallery, the ingredients graph, the skin compatibility review filter, youtube video filters, and even community mentioned posts.

Wrapping it up

There is so much complexity and variety in how people search for-- well, anything! At first, we wanted to provide people with the most accurate and comprehensive pieces of information that Mira could offer. We hoped that we could provide Mira's users with unique information that they wouldn't be able to find elsewhere. As we continued to iterate upon our product pages we realized that it's more important to prioritize brevity and clarity over accuracy and information density by crafting a clear story.