Orques

A Orques é um produto web (orques.com.br) com identidade e interface já definidas em Figma. O material disponível incluía o design completo em desktop e mobile, além do manual da aplicação.

Meu ponto de entrada foi a camada de interface: transformar esse material em uma implementação real, consistente e sustentável.

Traduzir um design detalhado em código sem perder fidelidade, e ao mesmo tempo evitar a armadilha comum de reproduzir tela por tela — o que gera duplicação e trava qualquer evolução futura.

O desafio real não era “fazer a página ficar igual”, era extrair o sistema por trás do design.

Fui responsável pela implementação da landing page e pela interpretação do Figma, além de atuar em correções tanto no front-end quanto no back-end e no trabalho com a API de Nota Fiscal.

Antes de escrever componentes, mapeei o que se repetia no design: espaçamentos, escalas tipográficas, variações de botão, blocos de seção e comportamento responsivo entre as versões desktop e mobile.

A partir disso, a landing page foi construída como composição de peças reutilizáveis, e não como um bloco único de marcação.

Next.js e React para a estrutura da aplicação, com Tailwind CSS para manter a estilização próxima do componente e coerente com o design.

A regra que guiou as decisões foi simples: se um elemento aparece mais de uma vez com pequenas variações, ele vira componente com props — não uma cópia.

O trabalho não ficou restrito ao front-end. Parte dos problemas encontrados durante a implementação tinha origem no back-end ou no contrato da API, o que exigiu investigar e corrigir dos dois lados.

A integração com a API de Nota Fiscal foi o ponto que mais exigiu atenção a detalhes de dados e comportamento da interface diante de respostas diferentes.

A landing page foi entregue fiel ao design e estruturada sobre componentes reutilizáveis, o que simplifica manutenção e alterações futuras.

A atuação entre front-end e back-end reduziu o vai-e-vem para resolver bugs de integração.

Ler um Figma é uma atividade de design tanto quanto de engenharia: o valor está em identificar o sistema, não em copiar pixels.

E quando o front-end entende o back-end, o produto inteiro anda mais rápido.