Something went wrong.

We've been notified of this error.

Need help? Check out our Help Centre.

ULTA.COM HOME PAGE REDESIGN:

CASE STUDY

Ulta is a major beauty retailer that sells cosmetics, fragrances, skincare, bath & body, hair tools and salon services with around 1000+ stores nationwide.

Due to their merchandise, their main demographic is mid-20’s females, though they also sell male products. With thousands of items in hundreds of categories, their website should be streamlined and easy to use.

This student project proved useful in doing so by condensing the left navigation categories, updating the top bar links with icons, reducing the amount of image sliders, simplifying ads, and creating an overall cleaner design.


Current Ulta.com home page

GOALS

Streamline Left Navigation

Navigation categories will be condensed and reduced, creating less clutter and more organization. Some categories will remain the same, others will be renamed and sorted accordingly depending on their respective items. 

Update top bar links with icons

Links on the top bar will be moved and updated to include user-friendly icons and link names, while others will be condensed into other categories. The search bar, Locations, Sign in and Cart/Bag will remain. 

Reduce amount of image sliders

Most image sliders will be converted to static ads to reduce clutter on the home page and create more engaging advertisement space that customers will want to look at. 

Simplify Ads

Many of the ads on the home page contain a lot of products in one place, or tons of words. These ads could be so much more effective by focusing on one product at a time, or at least one type of product with less of them in one image.


COMPETITIVE AUDIT

Browsing other makeup or beauty-related sites, I found that all of them had an “add to bag” and “add to favorites”, the latter requiring signing into the user’s account or creating one. All except for MAC had a “quick shop” option; they had a “preview colors” but it didn’t give more information about the product or the ability to add the item to the cart from the list page like the other sites. More sites than I expected had a notification in the cart showing how much more needed to be added to qualify for free shipping. 

There were only three that had a “find in store” option, though some brands don’t have store locations, or aren’t sold in stores. Others like E.l.f., Real Techniques and Urban Decay however are sold in many places, so could potentially have that feature. The two outliers were Amazon with their “One-Click” option, and E.l.f. Cosmetics with their “Live Chat” with a real customer service representative about the product on each product page.


BRAINSTORM MINDMAP


WIREFRAMES

VERSION 1

VERSION 2

VERSION 3


USABILITY TEST RESULTS

Wireframe version 2 was used for the Usability testing. Based on the feedback from the users, I made slight changes to the schematic by adding a title for the social media section and an email signup section.


USABILITY SURVEY RESULTS

SURVEY QUESTIONS

1. Is the wire frame easy to navigate?
2. How would you rate the size of the following: Category Buttons, Images, Headers, Body Text
3. How would you rate the amount of the following: Category Buttons, Images, Text, Overall Content
4. What would you add to the home page?
5. What would you remove from the home page?
6. What’s your favorite element of the site?
7. What’s your least favorite element of the site?
8. Any additional comments/feedback? (optional)


1. Is the wire frame easy to navigate?

2. How would you rate the size of the following: Category Buttons, Images, Headers, Body Text

3. How would you rate the amount of the following: Category Buttons, Images, Text, Overall Content

4. What would you add to the home page?

5. What would you remove from the home page?

6. What’s your favorite element of the site?

7. What’s your least favorite element of the site?

8. Any additional comments/feedback? (optional)



FINAL DESIGN COMP

I updated the wireframe one last time based on the usability survey results by further reducing the categories, text and links. Attempting to stay on brand yet still modernize the look, I created new, simple advertisement graphics for the “New Arrivals” and “Beauty Services” sections from images found on their website. 

CUSTOM ICONS

WIREFRAME

FULL DESIGN COMP

IN-BROWSER EXAMPLES

Using Format