top of page

Grid Beauty

Grid Beauty, a leading beauty store chain, seeks a modern and eager feel for its website targeting individuals living alone. The task involved creating a concept-based website to spread brand awareness, with easy navigation. Pages included landing, about, shop, and blog, with a prominent "Our Values" section. User flow was showcased through digital wireframes and prototypes.

Landing page-1.png

Problem

The website needs to have a modern look & feel. The website needs clear CTA buttons, along with the website conveying a sense of eagerness

Goal

The goal was to craft such a website where users can have an experience with a trendy and modern look, browse through different options.

My Role

UX designer designing the website for Grid beauty

Responsibilities

Designing the digital wireframes, producing low fidelity prototype, mockups, high fidelity prototype accounting for accessibility, and iterating on designs.

Understanding the User

Primary Research

The beauty industry is not the same as other online commerce markets. The beauty consumers are highly educated. The beauty consumer has gotten accustomed to a certain level of quality in website design. The skin care and cosmetic consumer has many choices these days. There is no shortage of brands already within this sector or entering it. It is a highly fragmented market. It is very lucrative as well as competitive. It takes a budget and time to succeed in the beauty market. The website is foundational and critical to the success of a beauty brand. Beauty websites usually incorporate much more information. Offer more frequent incentives and display aesthetically a more beautiful design. Afterall, it is the beauty industry. Consumers judge the brand by how it looks online.

Yes, we do judge the book by its cover!

Some popular trends that work out for a website of beauty products are as follows:

  • The consumer demand for authenticity extends to products

  • Showing texture is critical for enticing people to buy beauty products online

  • Communicating scent is especially challenging in a purely visual medium, so it’s important to use visuals that will stimulate a sensory association

  • With more customers shopping online, user-generated content such as reviews and customer photos are becoming critical

  • Recognizing more skin tones, the move toward inclusivity is extending to people with disabilities. Not only is accessible web design becoming the norm in beauty e-commerce

Design Process

Digital Wireframes

As the initial design phase continued, I made sure to base designs on findings from  the primary research.

Landing page.png
Shop.png
About.png
Blog.png

Low Fidelity Prototype

Using the completed set of digital wireframes, I created a low-fidelity prototype. The primary user flow I connected was the navigation of different pages from the homepage, so the prototype could be used  

View the Grid Beauty

Low-Fidelity prototype

Screenshot (133)_edited.png

Refining Designs

Mockups

High Fidelity Prototype

The final high-fidelity prototype presented cleaner user flows for moving from one screen to another.

​

View the Grid Beauty

High-Fidelity Prototype

Accessibility Considerations

  • CTA buttons are clear and are user centric.

  • Used detailed imagery to help all users better understand the designs

Tool Used

figma.png
bottom of page