Fale com a gente Site institucional
Da estratégia de negócio ao site, conectamos identidade, conteúdo, UX/UI e desenvolvimento. A parceria segue com publicação de artigos e SEO.
Hermes, mensageiro dos deuses, conecta comunicação, comércio e riqueza ao Direito Empresarial.
Telas do site / capturadas em 01.11.2026
01 / Estratégia aplicada
Depois da identidade e da papelaria, aprofundamos o negócio com o cliente. O modelo, os objetivos, os públicos e a proposta de valor passaram a orientar o conteúdo, a navegação e a experiência do site.
Construímos a expressão visual da operação existente.
Organizamos o negócio, o público e a proposta de valor.
Traduzimos a estratégia em linguagem e arquitetura.
Aplicamos os textos aprovados e validamos a navegação.
Implementamos, testamos e refinamos a experiência.
Seguimos com artigos, publicação, indexação e SEO.
Business Model Canvas + Strategy Map
O que esclarecemos
Definimos o foco da boutique, seus limites de atuação e os valores que orientam a relação com o cliente.
Como aplicamos no site
A apresentação do escritório prioriza atuação, método e responsáveis visíveis, apoiando a confiança de quem chega por indicação.
ICP + Mapa de Empatia
O que esclarecemos
Priorizamos o sócio-fundador/controlador e modelamos as necessidades de CEO, CFO e jurídico interno: risco, controle e clareza.
Como aplicamos no site
Organizamos a entrada por situações reconhecíveis, sem exigir domínio dos termos jurídicos, mantendo também o acesso pelas áreas.
Value Proposition Canvas
O que esclarecemos
Relacionamos tarefas, dores e ganhos à necessidade de transformar análise jurídica em uma decisão compreensível.
Como aplicamos no site
O trabalho estratégico deu origem ao slogan “Clareza para decidir”, criado por nós e aprovado pelo cliente. Essa direção também orienta a mensagem da página inicial: “Decisões jurídicas difíceis, tomadas com clareza.”
Brand Voice + Blueprint
O que esclarecemos
Definimos uma voz precisa e serena, uma estrutura de páginas e os caminhos para compreender a atuação do escritório.
Como aplicamos no site
Produzimos os textos, validamos com o cliente e levamos o conteúdo aprovado ao Figma antes da implementação.
02 / Experiência digital
No benchmark, encontramos sites que exigiam familiaridade com o juridiquês. Organizamos o conteúdo a partir das situações que o visitante reconhece, mantendo também o acesso pelas áreas jurídicas.
Pensado também para o celular
Formulário com assuntos ligados à atuação do escritório e telefone adaptável ao país.
Atendimento internacional
Conteúdo em português, inglês e espanhol, acompanhando os idiomas em que o cliente atende.
03 / Sistema visual
Três famílias, papéis distintos e uma paleta funcional. O sistema visual organiza a leitura, sinaliza ações e sustenta a clareza da experiência digital.
Títulos e hierarquia
Regular
Barlow
Condensed
O título estrutura.
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789!@#$%¨&*()-=+
Leitura e argumentação
Regular
IBM Plex Serif
Risco se enxerga, se mede e se escolhe.
Interface e elementos funcionais
Regular
IBM Plex Sans
Clareza em cada interação.
Fundos, destaques, títulos, texto e contornos: cada cor ocupa um papel definido na interface.
#041B24
#E8EEF1
#4BA6CD
#12313F
#F5F5F5
#444444
#D8DEE2
04 / Recursos digitais
Uma FAQ para consultar e levar em PDF. Capas de compartilhamento e favicon que identificam o escritório antes mesmo de abrir o site.
Perguntas frequentes com busca e organização por assunto.
Consultar a FAQ em PDF
Favicon / Identificação do site
Reconhecimento também na aba do navegador.
Retorno & continuidade
O cliente navegou no protótipo, revalidou o conteúdo e aprovou a proposta de primeira.
Testamos navegação e responsividade com cinco usuários, em diferentes dispositivos e navegadores, e refinamos a versão final a partir das observações.
Após a entrega, o trabalho seguiu com artigos, indexação, SEO e presença profissional.
05 / Documentação do processo
Da pesquisa à implementação, cada etapa aproxima o site do negócio e de quem precisa usá-lo. Abra uma etapa para conhecer as escolhas e seus fundamentos.
Contexto / Início em março de 2026
O cliente já conduzia sua operação jurídica, mas ainda não tinha identidade visual ou site. Conhecíamos a qualidade do seu trabalho como cliente e propusemos construir essa presença. O ponto de partida criativo foi zero.
O objetivo era apresentar a atuação do escritório com clareza, sustentar a confiança de quem chegasse por indicação e permitir que novas pessoas encontrassem seus serviços. Construímos a identidade e aprofundamos a estratégia para orientar o site.
Identidade / Pesquisa e direção visual
Pesquisamos símbolos Adinkra a partir do livro organizado por Elisa Larkin Nascimento e Luiz Carlos Gá, relacionando seus significados aos valores do escritório. Da pré-seleção de onze referências, escolhemos Epa por sua associação à lei e à justiça.
Hermes do Porto reúne os sobrenomes do cliente. Exploramos também a ligação de Hermes com o deus grego do comércio, da riqueza, das viagens e da eloquência, mensageiro dos deuses do Olimpo.
Relacionamos o papel do mensageiro à representação dos interesses do cliente na advocacia, e o comércio e a riqueza ao Direito Empresarial. Essa associação orientou a escolha da figura de Hermes para o hero do site e as capas de redes sociais. Porto completa a metáfora como abrigo e apoio no trecho de risco.
O benchmark nos ajudou a construir uma alternativa aos códigos recorrentes do setor. Os azuis profundos expressam sobriedade e discrição; o cerúleo atua como sinal de orientação. Na interface, o sistema se completa com superfícies claras, texto cinza, títulos claros sobre fundos escuros e contornos suaves.
Invertemos a combinação recorrente no setor: Barlow Condensed nos títulos, para nomear e estruturar, e IBM Plex Serif na leitura, para sustentar a argumentação. A IBM Plex Sans atende aos elementos funcionais. Aplicamos esse sistema à papelaria e ao produto digital.
A referência escolhida
A pesquisa aproximou os valores do escritório dos significados dos símbolos. Epa orientou a construção do símbolo da marca; as outras referências documentam o caminho dessa escolha.
Referência do estudo: Adinkra – Sabedoria em símbolos africanos. Elisa Larkin Nascimento e Luiz Carlos Gá (org.). Editora Cobogó, 2022.
Estratégia / Modelo → público → valor → experiência
Depois da identidade e da papelaria, aprofundamos o entendimento do negócio com o cliente. Os documentos se complementaram: esclareceram o foco do escritório, quem precisava atendê-lo, o valor de sua atuação e como traduzir esse conjunto para o digital.
Todo esse material também deu origem ao slogan “Clareza para decidir”, que criamos e o cliente aprovou.
Organizamos segmentos, proposta de valor, canais e relacionamento. O recorte conectou contratos, disputas, governança e sucessão à continuidade empresarial. Essa definição ajudou a manter a apresentação e os assuntos do site alinhados à atuação do escritório.
Formalizamos missão, visão, valores e objetivos. Clareza que conclui, risco medido e senioridade presente passaram a ser critérios para comunicar: explicar a atuação, tornar o método visível e identificar quem conduz o trabalho. O site precisava sustentar a confiança de quem chegasse por indicação, além de permitir que novas pessoas encontrassem o escritório.
A modelagem priorizou o sócio-fundador/controlador e considerou CEO, CFO e jurídico interno. O mapa de empatia aprofundou pressões, dúvidas e expectativas desses perfis. Usamos essa leitura para orientar a hierarquia das informações e a explicação dos problemas em linguagem acessível. O benchmark reforçou essa necessidade quando nós mesmos precisamos pedir ao cliente explicações sobre o juridiquês encontrado.
Relacionamos tarefas, dores e ganhos dos perfis às propostas de valor. A síntese orientou uma comunicação centrada em clareza para decidir, em vez de simplesmente listar serviços. Na página inicial, essa direção se apresenta como: “Decisões jurídicas difíceis, tomadas com clareza.”
Definimos como falar e como organizar a informação. A voz precisa e serena orientou os textos; o Blueprint conectou páginas, navegação e conteúdo. O cliente validou os materiais antes de aplicarmos o conteúdo à interface no Figma. O protótipo aprovado guiou a implementação, que recebeu novos refinamentos durante os testes.
Conteúdo / Estratégia → escrita → validação
Durante o benchmark, precisamos pedir ao cliente explicações sobre termos usados nos sites analisados. Essa dificuldade revelou uma barreira para pessoas sem formação em Direito e fundamentou nossa escolha: começar pelo problema reconhecível, antes da classificação jurídica.
A partir dos estudos estratégicos e das diretrizes de voz da marca, escrevemos os textos e os compartilhamos no Notion. O cliente ajustava e validava o conteúdo antes de aplicarmos os materiais à interface.
Também pesquisamos o Código de Ética e Disciplina da OAB e o Provimento nº 205/2021 para orientar a comunicação. O caráter informativo e a sobriedade previstos nessas fontes fundamentaram nossas diretrizes: explicar com precisão, sem promessas de resultado, apelos promocionais ou exposição de casos identificáveis.
Essa pesquisa orientou tanto a linguagem quanto a arquitetura: o visitante pode entrar pelas situações que vive ou consultar diretamente as áreas de atuação. O conteúdo explica os termos e ajuda a compreender o problema antes de iniciar o contato.
Fontes que fundamentaram a comunicação
Protótipo / Avaliação do cliente
Com o Blueprint e os textos validados, criamos as páginas no Figma e compartilhamos o link do protótipo. O cliente acessou pelo computador e revalidou o conteúdo aplicado à interface, junto com a navegação.
A proposta foi aprovada na primeira apresentação e recebeu elogios do cliente. Na etapa seguinte, os testes no ambiente de homologação trouxeram refinamentos para a versão publicada.
Desenvolvimento / WordPress, testes e refinamentos
Escolhemos WordPress e PHP considerando a publicação recorrente de artigos. Implementamos o site página a página, usando o protótipo aprovado como referência para conteúdo, navegação e hierarquia visual.
Antes da publicação, realizamos diversos testes com cinco usuários no ambiente de homologação. Avaliamos a navegação e a responsividade em diferentes computadores, notebooks e smartphones, além de diferentes navegadores.
As observações orientaram ajustes na interface e nas interações. Incorporamos esses refinamentos à versão final, conectando a proposta do protótipo ao uso do site em diferentes telas.
Entrega / Conteúdo, documentos e presença
Estruturamos o site para conteúdo em português, inglês e espanhol. O formulário inclui seleção de país no telefone, com máscara adaptável, e assuntos limitados às áreas atendidas. A seção de artigos foi planejada para publicação recorrente.
Auxiliamos o cliente na criação da FAQ e produzimos o modelo visual do PDF para download. Também criamos capas de compartilhamento, favicon e e-mails profissionais, além de apoiar a utilização desses endereços no Gmail.
Após a entrega, seguimos com conteúdo e SEO: o cliente escreve os artigos, e conduzimos a publicação, a indexação e o acompanhamento. Também auxiliamos na organização da presença profissional no LinkedIn, Lattes, Escavador e Jusbrasil.
06 / SEU PRÓXIMO PRODUTO
ESTÚDIO CRIATIVO / DESIGN + WEB
Um site. Uma landing page. Um app. Uma plataforma.
Conte o que você quer colocar no mundo.