Prontmed Landing Page

Prontmed Landing Page
Publicado em 09/12/2021 19h15
Visualizações: 780

Utilizando WP

Para visualizar o projeto clique aqui.

Esta landing page foi codificada a partir do trabalho da designer da empresa, que não obtive informações. Foi criada em Adobe XD.

Como sou usuário de Linux e habituado a usar ferramentas open-source, migrei o arquivo para sketch para importar no Figma e extrair os estilos e imagens.

O resultado? Foi péssimo, mas consegui utilizar o thumbnail e os arquivos de imagens do pacote XD e as comparar. A primeira imagem foi fruto da conversão e a segunda é a do thumb do pacote:

Prontmed Landing PageProntmed Landing Page

Após finalmente conseguir algo útil para trabalhar, foi dado início a fase de codificação. Foi solicitado o desenvolvimento do projeto no formato de tema para o WorPress. Eu preferia não utilizar este CMS, pois sob meu ponto de vista não havia necessidade e seria possível entregar uma estrutura muito mais enxuta com tudo feito na mão mesmo, mas a ordem foi WP, então foi reproduzida apenas o template. Ainda assim, fiz um esforço para consumir o mínimo possível de recursos computacionais das pontas (cliente e servidor). O estilo foi codificado em scss, minificado, foi utilizado somente um componente em JavaScript puro para controle de carregamento de imagens (lazysizes) e o resultado foi menos de 15KB de css e 8KB de js, menor que o próprio WP carrega. Além disso, as imagens utilizadas foram redimensionadas e convertidas para webp (o designers não ajudam muito neste sentido). Ainda ficou por minha conta a responsividade. Alguns pontos de contraste também não foram analisados, mas não houve possibilidade de alterar qualquer elemento de design definido. No final, deu para cumprir o propósito:

Prontmed Landing Page

Análise no Google Lighthouse:

Prontmed Landing Page

Para visualizar o projeto, clique no seguinte link: rodrigobrito.dev.br/projetos/prontmed-lp

Veja também:

Confira mais projetos relacionados

Este website utiliza cookies próprios e de terceiros a fim de personalizar o conteúdo, melhorar a experiência do usuário, fornecer funções de mídias sociais e analisar o tráfego. Para continuar navegando você deve concordar com nossa Política de Privacidade

Sim, eu aceito. Não, eu não aceito.