Skin.KARE

Uma experiência de compra de cosméticos orientada à descoberta, decisão e recorrência.

01 — Visão geral

A proposta foi criar uma experiência de e-commerce para uma loja de cosméticos que fosse além de apresentar produtos em um catálogo.

O principal desafio era ajudar o cliente a descobrir o produto certo, entender se ele é adequado para suas necessidades e comprar com segurança, enquanto o lojista teria uma estrutura simples para administrar o catálogo e os pedidos.

O projeto foi dividido em duas experiências conectadas:

• Cliente: descoberta → decisão → compra → pós-compra
• Lojista: cadastro → gerenciamento → venda

02 — O desafio

Comprar cosméticos online envolve algumas dúvidas que uma loja tradicional consegue resolver presencialmente, mas que precisam ser traduzidas para a experiência digital.

• “Esse produto funciona para mim?”
• “Qual é o melhor para o meu tipo de pele?”
• “Qual textura vou encontrar?”
• “Como devo usar?”
• “E se eu escolher errado?”

Por outro lado, o lojista precisa cadastrar produtos que possuem muitas características diferentes — ingredientes, benefícios, tipo de pele, textura, tamanho, variações e informações de uso — sem enfrentar um formulário complexo.

A oportunidade era criar uma experiência que facilitasse tanto a decisão de compra quanto a gestão do catálogo.

03 — Estratégia de produto

A experiência foi pensada a partir de quatro momentos principais:

• Discovery: Ajudar o usuário a encontrar produtos relevantes.
• Decision: Dar contexto suficiente para decidir.
• Conversion: Reduzir fricções até a compra.
• Retention: Continuar ajudando depois da compra.

Para o lojista, a lógica é diferente:

Cadastrar → Organizar → Gerenciar → Vender

Experiência do cliente

04 — Home & discovery

A Home não começa simplesmente com uma grade de produtos.

Ela oferece diferentes caminhos de descoberta: categorias, produtos mais vendidos, lançamentos, kits e rotinas, produtos por necessidade e conteúdo educativo.

Uma das principais entradas é “Compre por necessidade”, permitindo que o usuário comece pelo problema que quer resolver em vez de conhecer previamente o produto.

A ideia é diminuir o esforço de quem sabe o que precisa, mas não sabe qual produto procurar.

05 — Search experience

A busca foi pensada para entender a intenção por trás da procura.

Em vez de depender apenas do nome exato do produto, o usuário pode pesquisar algo como: “Quero um hidratante para pele oleosa.”

Os resultados podem ser refinados por: Categoria · Marca · Preço · Tipo de pele · Necessidade · Ingrediente · Acabamento · Avaliação

Assim, a busca funciona como uma ferramenta de descoberta, e não apenas como um mecanismo para localizar produtos já conhecidos.

06 — Product page

A página de produto concentra as informações necessárias para uma decisão segura.

Além de fotos, preço e disponibilidade, o produto apresenta:

• benefícios
• tipo de pele
• textura
• acabamento
• ingredientes
• composição
• modo de uso
• tamanho e rendimento
• avaliações
• perguntas e respostas
• produtos complementares

Uma informação especialmente importante é o bloco:

A intenção é transformar especificações técnicas em informações que realmente ajudam na decisão.

07 — Beauty finder

Para usuários que ainda não sabem qual produto escolher, foi criada uma experiência de recomendação.

O usuário responde algumas perguntas simples:

• Qual seu tipo de pele?
• O que você gostaria de tratar?
• Qual textura prefere?
• Quanto pretende investir?

Ao final, recebe uma seleção personalizada com sua rotina recomendada. Cada recomendação explica brevemente por que aquele produto foi escolhido, evitando que a personalização pareça uma “caixa preta”.

08 — Building a routine

A experiência também permite pensar nos produtos como parte de uma rotina. Em vez de vender produtos isoladamente, a loja passa a ajudar o cliente a entender como eles funcionam juntos, dividindo em cuidados matinais e noturnos.

09 — Cart & checkout

O carrinho foi pensado para manter o usuário informado sem criar novas barreiras.

Além dos produtos selecionados, apresenta subtotal, frete, previsão de entrega, progresso para frete grátis e sugestões complementares.

O checkout segue uma estrutura simples: Entrega → Pagamento → Revisão → Pedido confirmado. A compra como visitante é permitida, evitando criar uma conta como requisito antes da conversão.

10 — Post-purchase

A experiência não termina na confirmação do pedido.

Depois da compra, o usuário pode encontrar informações sobre como utilizar os produtos, ordem de aplicação, frequência de uso, cuidados e momento estimado para recompra.

Um sistema de Smart Replenishment pode estimar quando um produto provavelmente estará acabando e oferecer uma recompra em 1 toque, criando uma ponte entre a primeira compra e a recorrência.

Experiência do lojista

11 — Overview

O segundo lado do produto foi pensado para o proprietário da loja.

Enquanto a experiência do cliente é mais visual e orientada à descoberta, o painel administrativo prioriza velocidade, clareza e eficiência. O objetivo não era criar um ERP completo, mas oferecer as ferramentas necessárias para manter a loja funcionando.

12 — Dashboard

O dashboard apresenta uma visão rápida da operação: vendas do período, pedidos pendentes e produtos com estoque baixo. Também oferece ações rápidas para adicionar produtos e cadastrar promoções, permitindo que o lojista identifique rapidamente o que precisa de atenção.

13 — Gerenciamento de produtos

A área de produtos apresenta uma visão objetiva do catálogo. Cada produto pode ser editado, duplicado ou desativado. A tabela prioriza densidade de informação, já que o objetivo aqui é gerenciamento e não descoberta.

14 — Cadastro de produtos

O cadastro foi tratado como uma das principais experiências do painel. Um cosmético possui muito mais informações do que nome e preço. Por isso, o formulário foi dividido em grupos com progressive disclosure:

• Informações: Nome, Descrição, Categoria, Marca
• Preço e estoque: Preço, Preço promocional, Estoque, SKU
• Características: Tipo de pele, Benefícios, Ingredientes, Tags
• Mídia: Fotos, Vídeo

No desktop, um preview do produto acompanha o cadastro para que o lojista consiga visualizar como as informações serão apresentadas na loja.

15 — Princípios de design

16 — Experiência responsiva

O e-commerce foi pensado para diferentes contextos de uso, com atenção especial ao mobile, onde grande parte da descoberta e compra pode acontecer. A interface adapta navegação, filtros, cards, informações do produto, carrinho e checkout.

Já o painel administrativo prioriza uma experiência mais densa em desktop, onde o lojista consegue trabalhar com maior quantidade de informações simultaneamente.

17 — Resultados

O projeto transforma uma loja de cosméticos em uma experiência mais completa de descoberta e decisão.

O resultado é um ecossistema em que as duas pontas do produto são consideradas: uma experiência orientada ao cliente e uma operação simples para quem administra a loja.

18 — Reflexão

O principal aprendizado do projeto foi perceber que um bom e-commerce não precisa apenas facilitar a compra.

No caso de cosméticos, existe uma camada importante de educação e orientação antes da conversão. O usuário não está necessariamente procurando apenas um produto; muitas vezes está procurando uma solução para uma necessidade que ainda não sabe traduzir em produto.

Por isso, a experiência foi construída para responder uma pergunta maior:

“Como podemos ajudar o cliente a tomar uma decisão melhor, em vez de apenas mostrar mais produtos?”