Espaço Dora Santos
Marca, site e agendamento online para um salão de beleza em Cachoeira Paulista. Fios de cabelo vivos na tela, um pente-folha que leva de uma página a outra, e horários livres lidos direto da agenda da Dora.
A Dora é cabeleireira em Cachoeira Paulista e atende cada cliente do começo ao fim, um horário por vez. Para o Espaço dela eu fiz a marca inteira e o site, do primeiro rascunho de logo até a agenda que confirma o horário sozinha.
A marca
Desenhei nove conceitos de logo e a Dora escolheu o pente-folha: uma folha verde cortada por um pente dourado, com “Espaço” em letra cursiva sobre “DORA SANTOS”. Dele saíram o perfil e os posts do Instagram, o cartão de visita, um flyer A5, um banner, a placa do Pix, reels curtos e molduras para as fotos das clientes no Google. As peças são geradas por script, com o texto convertido em curvas, então saem iguais em qualquer gráfica.
O site
O topo da página é creme, cheio de fios de cabelo ondulados que se alisam quando o cursor ou o dedo passa por eles, e depois relaxam de novo. Ao clicar num link, o pente-folha voa até o meio da tela, penteia os fios e a próxima página se abre a partir dele. Os cliques fazem sons, sintetizados na hora, sem nenhum arquivo de áudio, e um botão no topo desliga tudo.
Quem quer marcar escolhe o serviço, o dia e um horário livre, e a confirmação chega na hora. Um horário só aparece livre se estiver dentro do expediente, sem outra reserva e sem compromisso na agenda do Google da Dora. Ao confirmar, o evento entra na agenda dela. No painel, ela vê as reservas, cancela, manda uma confirmação pronta pelo WhatsApp e ajusta serviços e horário de funcionamento.
Como foi feito
Um único app em React Router, rodando em Cloudflare Workers, com o banco no D1 e a agenda pela API do Google Calendar. A reserva confere o horário de novo contra a agenda e o banco antes de gravar, e o banco recusa dois horários sobrepostos, então duas clientes nunca ficam com o mesmo horário.
O site precisa ser leve em qualquer celular, então ele mede o aparelho antes de pintar a tela e só liga os efeitos que o aparelho aguenta, com o framebudget. Os fios rodam num worker, fora da thread principal, e as páginas públicas saem do cache do Worker. No Lighthouse mobile, as páginas públicas tiram 100.