Les Essentiels d'Ana

YouTuber specialized in Organic Cosmetics and Well-being with 4k+ subscribers, Ana decided to expand her reach through another important acquisition channel, a personal website.

discover LIVE PROJECT

Approach

Through her story I learned a lot about the 'Why'. Ana wants to live in harmony with the planet, tired of companies exploiting resources for the sake of money. She is compelled by brands with eco-friendly values and sustainable approaches to the environment. One day, she decided to strive by sharing her thoughts and exploring alternatives to traditional polluting products. She deeply believes that we can root for the beauty and the planet at the same time.

Additionally, Ana isn't only a video producer, she has a goal, providing tools to help consumers like her to make better choices. That's why I took the task of creating a new online home for Ana. A fresh slate exposing a simple and effective look and feel combined with a unique web experience, perfectly suited with her state of mind, and her values.

Specifications

Content Architecture

Aside of providing fresh and regular content accessible through the main page, my Client desired to push her YouTube videos first in each blog post, followed by the detailed content, expanding the topic she is covering in the video.

Showcasing her favorite organic cosmetics products in a Ecommerce way is one of her main request. It's part of a will to provide clear information about the best products on the market, and let consumers to view her video review aside some bullet points showing the strengths and weaknesses of each product. This page is also part of the overall business model based on affiliate links.

Hosting and CMS

In order to reduce the development cost and get a closer release date, it made a lot of sense to choose Webflow, which is providing hosting and visual development tools. Their powerful CMS is the killer feature that decided us to lean on this service first, because we needed an agile system, fast to engineer, and future proof.

Sketches and Wireframes

There isn't a better way to start designing new layouts than drawing on a sheet of paper. It frees me of tool restrictions and help creativity to express itself. Even if I'm only showing two versions of each layout I imagined, I'm always thinking of at least four iterations that are always discussed with my Clients. Then starts wireframes production, using Sketch, based on content architecture and sketches previously settled.

High Fidelity Prototypes

Ana and I have chosen to go for Adobe XD as she wanted to be able to edit files on her end. This is a software that I particularly enjoy, compared to the combo Sketch-Invision, allowing to produce Hi-Fi prototypes in one environment instead of using two softwares.

Visual Development

Relying on my knowledge of HTML and CSS coding languages, I developed from scratch Ana's website using Webflow. This is a very powerful Visual Development tool to create responsive websites. It saved us a lot of development time and allowed me to release the website way sooner than a fully hardcoded solution, even than producing a simple wordpress template.