Feeling
like
Glossier.

Role
Brand research, user research, visual design, prototyping
Type
Website redesign for personal project
Duration
March 2020 - May 2020
Tools
Adobe XD, Adobe Illustrator, Adobe Photoshop

Creative Brief.

Background

Glossier believes that online marketing is the most effective and inclusive way to reach out to consumers today. Better yet, Glossier's very little offline presence makes them seem scarcer and more valuable. Their goal is to "build the future beauty company where everything [they] make start with [their consumers]" (glossier.com). ‍

With these values, five years after launching, Glossier raised its company valuation to $1.2 billion as of 2019.

Problem

Currently, the website serves one purpose: an online shop for the brand. However, for a brand that's predominantly online, the online shop shouldn’t be the only feature on their main and only website. Better yet, the website is very bland and basic that when people who don’t know anything about Glossier visits the website, they may question the credibility of this brand.

Original Design

Original Design Original Design Original Design

Solution

The redesign of the Glossier website will create an all-in-one experience for old and new consumers alike. Glossier's online and offline presence will be unified under one space that is not only visually appealing but also informative and engaging.

Glossier Glossier Glossier

Inspiration

Glossier's "cult following" was mainly established through Instagram but it wasn't just social media marketing that contributed to their success. Their beautiful retail stores played a big part in captivating the hearts of their audience. Therefore, the Glossier website needs to be in the same calibre as their retail stores. ‍

The redesign should be attractive, dynamic, and engaging. The new website will introduce design elements specific to the retail stores with a more dynamic layout, as well as Instagram posts from real consumers and blog posts from the company's blog, Into the Gloss, incorporated to increase viewership and revisits to the website.

Glossier Glossier

Research.

Research

Competitors

Their main competitors such as Milk Makeup or Drunk Elephant may not have the same level of online following, but instead they are far more accessible offline through wholesale stores, which are located globally. This is an aspect that Glossier lacks in and they need go beyond their current online shop website to cover this disadvantage.

Primary Research: Interview

Interviewee: Eunice Lim / 23 / Female / Recent Grad

Q. Are you familiar with my subject? What is your impression of it?
A. I know of glossier, but I’ve never used their products.

Q. How do you know of glossier?
A. It always shows up on my Instagram feed and Facebook page

Q. How would you describe its marketing proposition?
A. I guess they’re really good at marketing considering I always see them on Instagram and I also see sponsored ads on Facebook

Q. What is your impression on the website?
A. The website looks really dull like... there isn’t much to it. If I were to go on the website without knowing about the brand,I don’t think I would trust this brand? because there isn’t much on it, it makes the brand seem less established

Q. What’s your impression on the retail stores?
A. Their retail stores look very extravagant but not in a bad way, and I think I’d go in even if I didn’t know the brand

Glossier Glossier

Secondary Research

Glossier

Glossier's New York showroom generates more sales revenue per sq ft than the average Apple store

Glossier

They are getting plenty social media coverage thanks to innovative and interactive installations

Glossier

"Experience" is at the forefront of their retail stores

Glossier

Their popularity shows that experience means everything to the modern-shopper

Glossier Glossier

Sketches.

Version 1

Sketch Sketch

Version 2

Sketch

Wireframe.

Version 1

wireframe

After putting together version 1, I realized it's not very different from the original design with the same boring layout. The only differentiating factor would've been the surrounding background design.

With this in mind, I tried playing around with the positioning of the images on version 2 to make the layout more dynamic and interesting to scroll through.

Version 2

wireframe



Hi-Fidelity.

Hi-Fi Hi-Fi Hi-Fi Hi-Fi

Design.

Color Palette

Design

Style Tile

Design

Final Redesign Prototype.

PREVIOUS PROJECT NEXT PROJECT