Vinhos Projeto de demonstração
Quinta do Vale Alto — loja de vinhos com reserva de provas
Um e-commerce premium para uma quinta vinícola fictícia de Colares: sete vinhos desenhados como silhuetas tipográficas de garrafa, carrinho funcional com quantidades e lógica de envio, fluxo de reserva de provas e um caderno de vindimas em mono — bordeaux, pedra e filetes dourados do princípio ao fim.
feitura.pt/demo/vale-alto — Ao vivo
Somos a terceira geração a fazer Ramisco e Malvasia em vinhas de chão de areia em Colares, e o nosso vinho ainda se vende por telefone. Precisamos de uma loja que saiba à quinta — lenta, séria, bonita — onde se possam encomendar os nossos sete vinhos, marcar uma prova de fim de semana na adega e ler a história das três gerações. Sem fotografias de banco de vinhas que não são as nossas.
O que está lá dentro
- Sistema de design de terroir — bordeaux profundo, pedra e filetes dourados, serifa Georgia em grande escala
- Sete vinhos desenhados como silhuetas de garrafa em SVG com rótulos tipográficos — zero fotografia
- Loja funcional: filtros por tipo, carrinho em gaveta, quantidades, envio grátis a partir de 60 € e totais
- Fluxo de reserva de provas: dois formatos, escolha de dia e hora com estados esgotados, contador de pessoas e total em tempo real
- Secção de património que conta três gerações da quinta, com cronologia em numeração romana
- Caderno de vindimas em tabela mono — datas, chuva e produção, ano a ano
- Dicionário bilingue PT/EN completo com comutador de idioma acessível
- Layout mobile-first recomposto em tablet e desktop, alvos de toque de 44 px
- Contraste AA, HTML semântico, controlos com aria e movimento reduzido respeitado
Registo de construção
- Direção de arte e tokens de design — paleta bordeaux/pedra/ouro, escala serifada, primeiros estudos das silhuetas de garrafa
- Hero com paisagem de vinha em traço, cabeçalho fixo, números da quinta e navegação por âncoras
- Catálogo de vinhos — sete referências com colheitas, castas e preços em EUR; garrafas em SVG com rótulos tipográficos
- Carrinho em gaveta: linhas de encomenda, contadores de quantidade, envio grátis a partir de 60 €, totais e fluxo de checkout
- Reserva de provas — dois formatos, escolha de dia e hora com lógica de esgotado, número de pessoas e resumo da reserva
- Secção de património das três gerações e tabela do caderno de vindimas em mono
- Passagem completa de copywriting PT/EN, ligação do dicionário bilingue e comutador de idioma
- Acessibilidade e afinação — auditoria de contraste AA, alvos de toque, movimento reduzido, recomposição responsiva aos 768 e 1100 px
Stack
- Laravel
- Vue.js
- Inertia
- Tailwind CSS
- TypeScript
Lighthouse
94
Performance
100
Accessibility
100
Best practices
100
SEO