02 / 07
Homem Atual
Uma barbearia com duas unidades, dezenas de serviços, planos de assinatura e agendamento por aplicativo. O trabalho foi transformar essa operação em uma experiência que leva cada pessoa à ação certa, na unidade certa.
Contexto
Preços, planos, barbeiros e horários estavam nas páginas de agendamento de cada unidade, com nomes de planos diferentes entre elas. A identidade estava no logo e no Instagram: menta, grafite, estrelas e o petróleo dos posts.
Desafio
Muitas decisões para quem só quer cortar o cabelo: qual unidade, qual serviço, qual plano, qual frequência. O site precisava simplificar sem esconder informação.
Material de partida
Os dados vieram das páginas de agendamento das duas unidades. A legenda de um post do Instagram, “Olha só esse resultado”, virou o título da seção de resultados.
- 01Páginas de agendamento das 2 unidades
- 02Instagram das duas unidades
- 03Google: horários e localização
- 04Logo e fotos do negócio
Estratégia
A unidade é escolhida na hora da ação: um único diálogo atende nove botões, em três modos (agendar, assinar e WhatsApp). Os seis preços de plano cabem em três cartões com uma alternância de frequência, que funciona até sem JavaScript.
- 01Inícioposte 3D e agendamento
- 02Sobremanifesto
- 03Serviçosdestaques + tabela em 4 grupos
- 04Assinatura3 planos × 2 frequências
- 05Resultadosdireto do Instagram
- 06Applojas por unidade
- 07Unidadesagendar, WhatsApp, rota
- 08Em qual unidade?diálogo único
Experiência
01 · Conversão
Em qual unidade?
Agendar, assinar ou chamar no WhatsApp: todos os botões levam ao mesmo diálogo, que pergunta a unidade na hora certa em vez de duplicar caminhos.
02 · Assinatura
Seis preços, três cartões.
Uma alternância entre Ilimitado e 2 por mês troca os valores dos três planos. Os nomes, diferentes em cada unidade, foram unificados.
03 · Serviços
Na cadeira.
Os três serviços mais procurados em destaque e a tabela completa em quatro grupos, com preço e duração.
04 · App
Cada unidade, seu aplicativo.
Uma alternância de unidade troca os links da App Store, do Google Play e do agendamento pelo site.
Direção visual
A paleta saiu do logo e dos posts: a menta da fita, o grafite do selo, o amarelo das estrelas e o petróleo das fotos.
- #0D1514Breu
- #1C3935Petróleo
- #A2D7CFMenta
- #EEF3F1Espuma
- #FECC2BEstrela
Tipografia
Big Shoulders Display em caixa alta e Outfit
Assinatura
Um poste de barbeiro em 3D, recolorido com a paleta da marca. As imagens são reveladas por uma “passada da máquina”; os títulos se juntam como um corte de navalha.
Mobile
O poste 3D continua no celular, ajustado ao título. Uma barra fixa traz agendar, WhatsApp e unidades; o diálogo de unidade vira uma folha que sobe da base da tela.
O que foi entregue
Uma operação com duas unidades, planos e aplicativo apresentada como um caminho só: escolher, agendar, sentar na cadeira.
- Site one-page com navegação por âncoras
- Agendamento por unidade em um único diálogo
- Serviços e planos organizados a partir das páginas de agendamento
- Elemento 3D com alternativa sem WebGL
- Barra de ações e folha de unidade no celular