JetCustoms: um protótipo desenhado, pronto para produção.
- 100
- Desempenho
- 100
- Acessibilidade
- 100
- Boas práticas
- 100
- SEO
O desafio
A oficina tinha desenhado o site com o Claude Design e entregou-nos um único ficheiro HTML: um protótipo funcional do design, numa só língua. Estava correto no portátil onde foi feito. Tinha de se tornar um site a sério — todas as páginas, as duas línguas, conteúdo que os donos pudessem alterar, e tinha de aguentar em qualquer tamanho de ecrã.
O que fizemos
Mantivemos o design e reconstruímos tudo por baixo. O protótipo tornou-se uma aplicação Next.js, pré-renderizada por língua e alimentada pelo CMS no back office. Testámos todas as páginas em larguras de telemóvel, tablet e computador e corrigimos aquilo que o protótipo nunca teve de enfrentar: quebras de linha, áreas de toque, ligações lentas, navegação por teclado. Depois as partes invisíveis — metadados, dados estruturados, sitemap, robots, modo de pré-visualização, analítica — e um processo de publicação com pré-visualização e produção separadas.
O que mudou
| Área | Protótipo | Produção |
|---|---|---|
| Línguas | Português | Português e inglês, com alternativas hreflang |
| Conteúdo | Escrito no código | Editado no CMS, rascunhos pré-visualizados no site real, publicados num clique |
| Ecrãs | Um portátil | Testado de telemóveis de 320px a ecrãs largos |
| Imagens | Um JPEG embebido | Otimizadas, responsivas, servidas a partir de armazenamento atrás de uma CDN |
| Motores de busca | Nada | Metadados, dados estruturados, sitemap, robots, llms.txt |
| Acessibilidade | Por testar | Link para saltar, navegação por teclado, ordem de foco, contraste |
O resultado
- 4 × 100
- Lighthouse, em todas as categorias
- 320px+
- todas as larguras testadas, do telemóvel ao computador
- 0
- alterações ao design — o design deles, entregue tal como estava
A versão técnica
A mesma reconstrução, escrita para engenheiros: tudo o que nunca se pede a um protótipo, e o que exige manter o desenho intacto enquanto se substitui tudo por baixo. Em inglês.
Ler na Corvale EngineeringComece com uma resposta clara.
Uma avaliação técnica a preço fixo, sem compromisso posterior. Ou simplesmente marque uma chamada.