PINTO E PAIS
Um website para uma metalomecânica em Esmoriz, com o portefólio de obra a servir de argumento e um pipeline de imagens que reduziu 136 MB de fotografias a 9 MB servidos.
Visitar website↗
A MIRAE construiu o website da Pinto e Pais com o trabalho no terreno em primeiro plano: portefólio de 24 obras, oito serviços em cartões que reagem ao rato, e dados estruturados de negócio local dos mais completos que já escrevemos.
O briefing
A Pinto e Pais faz estruturas em aço do projeto à montagem, com mais de 45 anos de casa e mais de 500 obras realizadas. O que convence um cliente industrial é ver obra feita, por isso o site mostra isso primeiro, com fotografia real e à escala do que se constrói.
Sem loja, sem área de cliente e sem multilingue: um site institucional em português, com pedido de contacto, candidaturas à equipa e a informação legal completa da empresa.
Abordagem de design
Movimento com contenção
O hero abre em parallax, com o título a revelar-se palavra a palavra por baixo de uma máscara, e os oito cartões de serviço inclinam-se em perspetiva a seguir o rato, com um halo que o acompanha.
Quem prefere quieto, tem quieto
O respeito por movimento reduzido atravessa três folhas de estilo e três componentes: o marquee para, o parallax e a inclinação desligam-se, e o carrossel troca de motor em vez de ficar a meio.
Desenvolvimento
Um pipeline que trata da galeria
Quatro scripts próprios em Node e Sharp encontram as fotografias novas, ignoram logos e ficheiros de trabalho, geram WebP e JPEG a partir de uma única descodificação por foto e escrevem sozinhos a lista que a galeria lê. De 136 MB de originais para 9 MB servidos, sem lista para manter à mão.
Encontrada por quem procura em Esmoriz
Dados estruturados de negócio local com morada, coordenadas, dois telefones, horário real, área servida, NIF e os oito serviços tipados um a um, mais coordenadas nas meta tags, sitemap e canonical.
Rápida antes de ser bonita
Só a imagem principal carrega com prioridade, as restantes esperam pela sua vez, e o browser salta o desenho das secções fora do ecrã. Nenhum JavaScript de terceiros arranca antes do consentimento.
Consentimento negado por omissão
O banner é próprio, sem biblioteca, ligado ao Consent Mode v2 da Google: tudo negado à partida, e a analítica só arranca depois de um sim explícito. As três páginas legais abrem em modais acessíveis.
Continua a explorar o nosso trabalho
Diga-nos o que está a construir
Fale-nos dos seus objetivos e respondemos em 24 horas com um âmbito claro e os próximos passos.