Estudo de caso · Advocacia
Dos wireframes a três direções visuais para o site institucional de uma advocacia boutique.
Cliente
Antônio Silvério Neto
Segmento
Advocacia
Serviço
Site institucional
Status
Em andamento: fase de design
01 · Contexto
Antônio Silvério Neto é advogado e atua em advocacia boutique. O projeto é o site institucional da Silvério Neto Advogados, construído a partir do manual da marca e do site atual do escritório.
O backup do site atual serviu de referência de estrutura e de conteúdo. A partir dele, a primeira etapa foi desenhar a arquitetura de informação e o fluxo de navegação, antes de qualquer decisão visual.
Páginas
Home, Sobre, Serviços (visão geral), dois serviços especializados e Contato.
Home
Menu, hero, escritório, quatro áreas de atuação, equipe, missão, visão e valores, conteúdos, contato e rodapé.
Em todas as páginas
Menu fixo com dropdown de Serviços (preparado para 3 a 5 itens), botão flutuante de WhatsApp e rodapé padrão com contato, links e informações legais.
02 · Processo
04/11/2026
13 pranchetas em desktop (1440 px), de baixa e média fidelidade, para avaliar a arquitetura de informação, os blocos de conteúdo e o fluxo de navegação. Cores, fontes, textos e imagens eram provisórios.
09/11/2026
Três direções visuais com o mesmo escopo e a mesma ordem de seções. Cada uma em desktop, tablet (768 px) e mobile (390 px), na cor original marrom ébano e em uma versão alternativa em preto.
Próxima etapa
O cliente escolhe a direção da home e a variação de cada página. As etapas seguintes serão acrescentadas a este estudo à medida que forem concluídas.
03 · Wireframes
O número indica a página (01 a 06) e a letra, a variação de wireframe. As variações A e B ficam lado a lado para comparação direta, e o cliente escolhe uma por página. Role cada moldura para ver a página inteira.
01A · Home, variação A
01B · Home, variação B
02A · Sobre
03A · Serviços, visão geral
04A · Serviço especializado
06A · Contato
04 · Linguagem visual
As três propostas partem do manual da marca: o dourado como acento, o marrom-preto como base escura e o off-white como fundo claro, com Cormorant Garamond nos títulos e Red Hat Display nos rótulos e textos.
Dourado
#C9982B
Marrom-preto
#160F01
Off-white
#EFEAE6
Aa
Cormorant Garamond · títulos
Aa
Red Hat Display · rótulos e textos
05 · Três direções para a home
As três homes têm o mesmo escopo e a mesma ordem de seções. O que muda é a direção: tipografia, composição, ritmo, imagens e tratamento visual.
1
Arquitetura tradicional preservada, com acabamento, hierarquia e espaçamento modernizados.
Tipografia: Cormorant SemiBold em 46 a 68 px, com rótulos em caixa alta.
Composição: grade de cards e colunas, com barra de contato no topo.
Ritmo: regular, com seções brancas e off-white alternadas.
Imagens: foto colorida em largura total no hero, com véu escuro.
Destaque: áreas em cards com filete dourado.
2
Leitura editorial e elegante, moderna sem linguagem de startup.
Tipografia: Cormorant Regular em 56 a 92 px, com itálico dourado como único acento.
Composição: assimétrica, com coluna de rótulos à esquerda.
Ritmo: contraste forte entre seções escuras e claras, com muito respiro.
Imagens: grandes, sangradas e em tom único.
Destaque: áreas em lista numerada e conteúdos com um artigo principal.
3
Rota própria, orientada ao perfil pessoal do Antônio. Sobriedade, autoridade e longevidade visual.
Tipografia: Cormorant centralizada, com itálicos e o menu também em serifa.
Composição: simétrica, com logo vertical e menu centralizados entre filetes.
Ritmo: calmo, todo em off-white, com uma única faixa escura.
Imagens: só o retrato, em preto e branco, com moldura dourada que ecoa o símbolo.
Destaque: algarismos romanos e publicações em lista.
06 · Situação atual
O projeto está na fase de design, aguardando a escolha da direção pelo cliente. O desenvolvimento, as funcionalidades e os resultados entrarão aqui quando existirem, sempre com a fonte de cada dado.
Nas propostas, os nomes e as fotos dos associados e as imagens dos artigos são ilustrativos, gerados por IA. Endereço, telefone, e-mail e os textos das áreas de atuação ainda serão confirmados com o cliente.
Conheça nosso serviço de sites institucionais