Beauty·B
design for e-commerce site
role & responsibilities:
art direction, copywriting, market research, design research, visual design, ui design, and graphic design
brief:
this project was done in collaboration with the thread group (consultancy & creative agency), with the help of a pdf documenting the brands guidelines.
beauty·b is a brand new beauty brand entering the beauty market with one product, a sugar wax kit.
as a brand they are rooted in the idea of creating skincare using traditional approaches and putting a modern twist on them. they are big believers in using natural ingredients from the earth. the customer is someone who values wholesome wellness.
being a new brand their marketing has been limited to running ads on instagram and facebook while they explore appropriate retailers to stock their product. the owner now wants to expand their online presence by going into e-commerce through a website.
business problem:
1. the owner needs a site that gives people an insight into the brand very quickly and has a lot of impact as no one knows the brand.
2. an easy checkout experience for anyone coming from social media to buy the product.
3. designs for a landing page, product page, and single page checkout.
4. as a way to get reviews for the product the team is thinking of putting a qr code on the packaging that leads to the website, allowing customers to say how they felt about the product. you are to design a page for this idea.
brand guidelines:
as a matter of confidentiality, i was restricted from showing too much of the brand guidelines. so what i can show is relevant only to the site design.
market research:
in beginning, i decided it would be a good idea to research would-be competitors of beauty·b. i did this because in the retail space these are brands that would probably be on the same floor or section of the store. they would most likely have interweaving customers, so for beauty·b to compete successfully on a visual level i wanted to see what made these competitor sites work and what/if any similarities they had.
.png)
.png)
my takeaway was that all the sites were designed with minimalist and simplistic influences. they focused on a visual experience that made the product feel as close to the customer as possible, almost as if you could smell and touch it through your screen. they focused on natural textures and tonal block colors, and were elegant.
mood boards and design research:
to further deepen my understanding of the brands aesthetic i put together a collection of images focusing on keywords from its motto/essence.
natural/texture, clean, type-based, indulgent, soft, elegant, and simple.
.png)
customer profile:
to also help with the site design i put together a brief customer profile based upon the description of the brand and the research done. i felt that getting an overview of the target customers' interests and lifestyles would help with my design choices.
.png)
design solution:
as i mentioned above the owner needs a site that gives people an insight into the brand very quickly and has a lot of impact. so from all the research and information i'd collected i decided to make a landing page with an image showing indulgence in the product. i also decided to generate copy for a short slogan on the landing page. a clean and modern design that will communicate the essence of the brand at a quick glance. subsequent pages would be influenced by the same things.
site map/customer journey:
keeping in line with minimalist and simplistic structures i decided that the site shouldn't have too many pages, just a direct and easy experience so customers take in the brand in as little steps as possible.
.png)
lo-fi wireframes
early versions of landing page:
the feedback that i got on this version was that although it is a very pretty design, the water droplets were are distracting, the brand logo wasn't the focus and the text and icons were not given proper hierarchy in the colour scheme so they aren't instantly legible. i took these notes onboard and modified the design to what is now the final version above.
copywriting:
for the copy, i focused on the words natural, tradition, and modern. the decision to circle the words was to bring attention to these elements of the brand, draw the eye to it and unconsciously solidify it in the viewers' mind. these are three from the final list i came up with and the one i used and the top.
retrospective:
i really enjoyed working on this project as it allowed me to experiment with my creativity in ways i hadn't done before. the decision to use the water droplets happened as a mistake while rapidly trying beginning ideas. i'm glad about the changes i made after the early landing page ideas with the big water droplets.