Veterinária Projeto de demonstração
Pata Amiga — um site de clínica veterinária que tranquiliza tutores
Um site quente e clínico-mas-amigável para uma clínica veterinária em Rio de Mouro: ícones de animais desenhados a traço, pedido de consulta em quatro passos, faixa de urgências 24h com chamada num toque e planos de saúde animal com preço mensal por espécie.
Temos uma pequena clínica veterinária em Rio de Mouro e a maioria dos clientes chega por passa-palavra. Precisamos de um site que faça tutores ansiosos sentirem-se seguros antes sequer de ligar: o telefone de urgências impossível de falhar, preços claros dos serviços e dos planos de saúde mensais, a equipa com as suas cédulas, e uma forma de pedir consulta a partir do telemóvel em menos de um minuto — cão, gato ou coelho.
O que está lá dentro
- Pedido de consulta em quatro passos (espécie → motivo → dia preferido → contacto) com validação por passo e confirmação de demonstração
- Ícones SVG desenhados a traço: cão, gato, coelho e pata, reutilizados no hero, na marcação e nos planos
- Faixa de urgências 24h em alto contraste com número de telefone sobredimensionado e chamada num toque
- Atalho de urgência dentro do fluxo de marcação — escolher 'Urgência' mostra o telefone de imediato
- Planos de saúde animal com toggle cão/gato que troca os preços mensais em EUR ao vivo
- Grelha de serviços com preços de partida transparentes para consultas, vacinação, cirurgia, dentária e domicílios
- Secção de equipa com avatares de iniciais e cédulas da OMV — zero fotos de banco
- Totalmente bilingue PT/EN com toggle nativo, landmarks semânticos, alvos táteis de 44px+ e suporte a reduced-motion
Registo de construção
- Sistema de design: paleta branco + coral quente + salva, tipografia grande e amigável, auditoria de contraste; esboço dos ícones a traço de cão/gato/coelho
- Hero com composição SVG de animais, chips de confiança e faixa de urgências 24h com chamada num toque
- Pedido de consulta em quatro passos com validação por passo, atalho de urgência e confirmação de demonstração
- Grelha de serviços, planos de saúde com toggle de preço cão/gato, secções de equipa e contactos
- Passagem de copy PT/EN, recomposição responsiva a 768/1100px, QA de acessibilidade e reduced-motion
Stack
- Laravel
- Inertia.js
- Vue.js
- TypeScript
- Tailwind CSS
Lighthouse
95
Performance
100
Accessibility
100
Best practices
100
SEO
