Exfolicare focuses on exploring commonly used chemical exfoliants in skincare, through visual diagrams and animations. Exfolicare comes from a combination of the words exfoliant and skincare.
Vision
To inform the audience about the different aspects of skincare, specifically chemical exfoliants. This serves to explain the advantages and uses of various skincare acids.
Solution
The goal of this project is to inform the audience of different aspects of skincare, beyond the basics of cleansing and moisturizing. This project aims to explain the benefits of acids and chemical exfoliation in skincare.
Moodboard 1 - Calming Blues
I focused on using shades of blue and green, commonly used in skincare branding to convey dependability and serenity.
Moodboard 2 - Grainy Gradient
I went with slightly brighter colors for this version, focusing on gradients. Gradients are a popular trend in a lot of designs today and convey minimalism and modernity.
Sketches & Sitemap
To start off, I created a storyboard sketch of how I planned for this project to go, as well as a sitemap to display the different available pathways. In my wireframes, I created a start screen, where the character introduces the concept to the user. Then, there are screens to learn about specific acids, example products, pairings and mistakes, and a resources page.
Iterations v1 & v2
In these earlier iterations, I focused on experimenting with colors that would fit my moodboards, where one version focused on warmer colors and the other one on cooler colors. I also tried a variety of different gradients for the background as well as the character, but some did not work well with the icons.
Iterations v3 & v4
After deciding on the main background color, the character design went through a few more versions until it became the way it is now - a layer of skin. In these iterations, the grid layout is modified for the "example products" as well as "pairings and mistakes" screens.
Character Design Process
The character that introduces the user to Exfolicare has gone through many versions, starting from a simple circle to represent a cell, until it becomes something more representative of the topic - an illustrated version of the layers of skin.
Acid Chemical Structures
Here are the simplified molecule structure icons of the chemical exfoliants in this project, which include: glycolic, lactic, malic, mandelic, and salicylic acids.
Takeaways
Gradients are very difficult to work with. It’s difficult finding colors that blend well together and still fit the theme without making anything stand out/disappear too much. But this was still a fun challenge.
It would be helpful if there were more infographics or visuals based on the science behind skincare, instead of mainly skincare products alone.As someone who enjoys learning about skincare products, I found this to be quite an enjoyable passion project.
Take a look at some of my other projects:
.png)
.png)
.png)
