Landing page fictícia para um serviço de detalhamento automotivo em domicílio na zona oeste de São Paulo. Este repositório é um study case para portfolio — não há cliente real, CNPJ real ou negócio em operação por trás.
A maioria das landings de estética automotiva publicadas pelo mercado segue um padrão de "lava-rápido premium": hero com selo Premium, três features simétricas com ícones decorativos, e três depoimentos com nome plástico do tipo "Recomendo!". O exercício aqui foi escolher um ângulo que fugisse desse padrão e, no processo, mostrar como uma landing pode ter cara de produto pensado, e não de template:
- Posicionamento de detalhamento em domicílio, não oficina aberta ao público — diferencial real do nicho em São Paulo.
- Vocabulário técnico do segmento (descontaminação ferrosa, clay bar, Gyeon Q² Mohs) com tradução curta de cada termo. Ninguém fala "vitrificação importada" numa loja real.
- Métricas auditáveis no lugar de stats redondos — 243 atendimentos em 2025, 4,7 / 38 avaliações — os números têm casas, datas e fonte.
- Trust signals plausíveis no rodapé: razão social, CNPJ válido em formato, endereço de rua que existe, telefone com DDD coerente, perfil de Instagram em @estudiocleancar.
- Páginas estáticas internas de política de cancelamento e termos de serviço com cláusulas que respondem a perguntas reais do nicho (chuva, condomínio, garantia da cerâmica).
| Seção | Por quê |
|---|---|
| Hero | Promessa concreta + agenda do próximo fim de semana, não selo "premium" |
| Como funciona | 4 passos do manda foto até a vistoria, em vez de "diferenciais" abstratos |
| O que entregamos | 3 etapas com profundidade técnica e linha de evidência ("em média 40-90 min") |
| Trabalhos recentes | 6 imagens, uma por etapa do processo, com alt text técnico |
| Quem já contratou | 1 depoimento longo + 1 curto, com bairro, veículo e serviço executado |
| Dúvidas frequentes | 6 perguntas que clientes do nicho realmente fazem |
| Falar com a gente | Foto + CEP, não formulário longo |
A ordem foi escolhida pra responder, na sequência, às perguntas que um cliente faz antes de fechar: como funciona → o que recebo → como ficou em outros carros → o que outras pessoas dizem → o que ainda tenho dúvida → como contrato.
- Paleta: off-black
#0F1115, areia#E8DDC8, laranja queimado#C45A2C. Veio de inspeção em sites reais de estúdios de detailing (Detail Garage, Auto Finesse). É a paleta da terra, da ferrugem antes da descontaminação e da iluminação de oficina — não o azul-bebê + dourado default de lava-rápido genérico. - Tipografia: Fraunces (serif com modulação de peso) para títulos e números — dá densidade e tira a cara de tema padrão do Vite. Inter para corpo.
- Quebra de simetria: galeria de 6 fotos não é grid 3x2, é (1 grande + 4 quadrados + 1 panorâmica). Features ocupam 3 cards numa linha única com borda divisória de 1px em vez de cards flutuantes idênticos.
- Restrição de ícones: 1 ícone funcional por seção (Beaker / ShieldCheck / Truck), não um set Lucide aleatório por feature. Ícones decorativos do template original foram removidos.
React 18 · TypeScript · Vite · Tailwind via CDN · lucide-react
Tailwind via CDN é proposital aqui — landing estática, JS bundle mínimo, sem build pipeline pra tema. Para uma landing de produção, eu mudaria pra PostCSS com purge, mas o ganho é marginal.
npm install
npm run devAbre em http://localhost:5173.
npm run build
npm run previewTodo o conteúdo deste site — depoimentos, métricas, CNPJ, endereço, telefone, perfil de Instagram — é fictício. Foi escrito pra ser plausível, não pra induzir contratação. As imagens vêm do Unsplash, sem direito de uso comercial atrelado.