Pal-it

Pal-it App: Beauty Product Insights from Community Reviews

ROLE

Sole Contributor

TIMELINE

January 2021 – March 2021

RESPONSIBILITES

User Research; UX Design; UI Design

An independent class-based project. The goal was to identify a problem space, research and develop a MVP App to solve for the issue.  

The problem to solve for…. Consumers purchasing beauty products need a way to easily research and compare products in the market, so that they are not overwhelmed by the wide array of products available and are satisfied with their purchase decisions.

The project explores the discovery and application for developing a tool to re-establish confidence in the makeup buying experience, making it easy for consumers to research their purchases before buying.

OVERVIEW

first thing’s first… what’s the problem??

I am frequently asking friends for makeup and skin care recommendations and/or spending hours on YouTube comparing and contrasting tons of beauty products in review videos.

My mental catalog of products on the market is pretty limited, so it’s always a challenge to know which products to purchase without having cosmetic expertise or doing prior research. Putting in the work to research products is overwhelming and most people don’t really have the time.

Additionally, with so many diverse options on the market, the type of products that work for me, might not work for someone else. I needed help to narrow down my search to tailor my makeup and skin care needs.

research

I interviewed three makeup users with varying level of makeup/skin care expertise and beauty industry knowledge. I wanted to get more insight into the various user pain points when purchasing beauty products. From here, I was able to create a user persona.

meet brooke

How might we develop a solution?

Confirmed! Consumers purchasing beauty products need a way to easily research and compare products in the market, so that they are not overwhelmed by the wide array of products available and are satisfied with their purchase decisions.

How might we re-establish confidence in the makeup buying experience, making it easy for consumers to research their purchases before buying?

I started with a user flow to help figure the out boundaries of the user’s journey and think through critical filtering activities from the user’s perspective. It will also help me to identify screens and components of the application and discover potential problems during my iteration process. Find the top-rated.

develop

What’s the solution?

Then came wireframes… I began by sketching out a bunch of solution ideas on paper. Afterward, I took a more critical look at my sketches and started bringing my designs to Figma.

discovering products

I wanted my user to be able to navigate the app without needing to rely on a search bar (Competitive Analysis issue with Influenster). I wanted to simulate how it feels to browse in a store for products without a plan. So I focused on categorizing products as if they were organized in an actual store, and also used card sorting as a solution. I still wanted to keep the search bar prominent so that users coming with the intention of finding a specific product could do so easily.

Comparing Products

Within a product category, I wanted to list the top-rated overall products. This highlights important features about the product including ratings from the community, brand and price. The rating system offeres a simple way for users to compare products. Including user ratings/testimonials allows users to gain reassurance about their purchases and interact with the community. I also included sorting options: top-rated overall, price, and product attributes, so the user could tailor their search to their specific needs.

Providing Product Details & Highlighting Inclusivity

Once selected, a product profile provides streamlined product information, user reviews, product highlights, ingredients, user uploaded photos, similar product recommendations, and the ability to save the product all in one place. The challenge was to simplify the content, highlighting what was important and hiding secondary information. I also wanted to have a dedicated section that scored the inclusivity of the brand, product shade range, and efforts to promote inclusiveness to all beauty consumers, as this was really important during interviews.

not everything went as planned

I tested with users and updated based on misclicks and hesitations while interacting with the prototype. I also gained feedback by conducting interviews during and after users interacted with the interface. Here were some of my key takeways:

Make the filtering options more robust by giving more options, update nav, add onboarding to explain app purpose.

Add more information about product attributes so the user has more detail.

Some users were confused by what the inclusivity section means. Build out this section to be more robust.

Provide more guidance through copy and icons to help users recognize product categories.

Add breadcrumb navigation; carousel feature to get to other products so the user does not reach any dead ends

Users wanted more information on where to buy products; Add retailers and price section

<span data-metadata=""><span data-buffer="">With this feedback...

I went back to the drawing board. I was able to diagnose and fix problems, bringing me to our high-fidelity prototype…. oooo – ahhhhhh – shiny things!

<span data-metadata=""><span data-buffer="">Validation with Maze

“I thought it was easy to filter. Not a lot of clutter that I think a lot of other filters on sites typically have. Very simple. “

“I liked how it gave places you could buy the product and clearly listed the price so you could choose the store by price point. “

here’s what can still be improved

A designer’s work never ends! Here are some further improvements on my to-do list:

Expand Features

Build out the other features in the navigation (leaving reviews, following friends and influencers, & profile building and quiz); Build out other category’s product detail pages like mascara, lipstick, concealer, skin care, etc

<span data-buffer="">Number Rating Banner on PLP<span data-metadata="">

Change orange color; some users thought that these were color swatches and shade numbers due to the color looking like some foundation

<span data-metadata=""><span data-buffer="">Integrate with other Social Platforms

Offer the ability to share on Instagram and tiktok; incorporate instagram or tiktok highlight reel on product details page

<span data-metadata=""><span data-buffer="">Add Tap Interaction on Arrow

To exit the details page required drag-down motion, but many users tried to tap to close it. Both tapping the arrow and dragging down should close out the page.

<span data-metadata=""><span data-buffer="">Let’s see the bad too!

Include a section with unfavorable attributes. This will distinguish the app from eccom, without having the spin of the sway of the seller marketing their product