UX case study
Luster’s Pink
Being a natural hair Instagram influencer I have been able to work with several brands over the the past 5 years including Luster’s. Luster's Pink has been apart of my personal haircare routine since I was a child.
Recently they launched a new product and it prompted me to take a look at their brand website lusterspink.com to see how they have updated the site. To my surprise the site has not been updated for quite some time. The site navigation and layout is very outdated, leaving more to be desired for the overall experience
Overview
UX goals
Update the overall UI and visual designs on the site.
UX constraints
1. Update navigation of Luster's Pink's expansive online product inventory
2. Keep newest product launch at the forefront of the site
3. Update typography and brand color usage
My role
As Designer for my project, I was involved in the entire process, including the overall strategy, user research, website hierarchy and visual designs.
Research
In order to better understand the current site in more detail I performed a site audit. This allowed me to rate and and prioritize the site features by different criteria.
Top priorities & areas for improvement:
1. Update site layout and company branding
2. Update navigation for easy use across the site
3. Add CTA's
Click to enlarge
Existing site
Competitive analysis
A look at the field highlighted where Luster's Pink was falling short. Out of the direct competitors I analyzed, 3 out of 4 have at the very least an updated website design. Other places where Luster's Pink fell short in comparison to the competition are:
1. Good Color, Typography, & Alignment
2. Simple hierarchy & Navigation
3. CTA's on each page
4. Easy Happy Path
Click to enlarge
Branding & social media presence
To better understand Luster's Pink brand image, I analyzed their social media platforms. They have a significant following across Facebook, Instagram and Twitter. These accounts allowed me to get a better perception of the brand identity through logos and branded communications.
Facebook - 145k likes & 144k followers
Instagram - 36k followers
Twitter - 1200 followers
Click to enlarge
Visual designs
New home page
Hero Image - I chose a high resolution image of a woman with her natural afro with a Pink background. This speaks to the retro piece of Luster's Pinks history. Visitors immediately have an option to explore Luster's Pink's vast collection.
Best Sellers - This space gives visitors an opportunity to scroll through what other people are buying - let's be honest, people want what other people have. With an "add to cart" option directly from the home page, no extra steps are needed for conversions.
Product Promotion Carousel - Here is where Luster's Pink can show case their newest product's and marketing launches. Each image will have an CTA - maximizing potential sales.
Social Media Corner - Social media has become a big way for Luster's Pink to connect with their customers and promote their latest products. Having this direct from Instagram feed is a great way to show how real people are using their products. This also gives customers a chance to interact with their social pages.
Click to enlarge
Menu & Submenu design
Luster's Pink has a lengthy catalog of products that they maintain under the Pink umbrella. In order to give customers optimal browsing I designed a submenu in the top navigation drop down. This allows customers to browse categories and see where product are in the collections.
Click to enlarge
Product highlight & quick view
Quick view allows customers to get additional product information without navigating to a new page. If they want to continue browsing where they left off, it's an easy click of the close button.
Product detail page
This is the full product detail page that will be consistent across each item in the catalog. Consistent top navigation bar with breadcrumbs that show you exactly where you are on the site. Recommendations are highlighted and suggested for further sale conversions
Responsive design
Click to enlarge
Responsive design is key for any e-commerce website. Customers use all different types of methods for searching and shopping online. My designs for Luster's Pink caters to users on any medium.