Page Templates // Design System
Alma da Marca Pitch V4

19 // Sistema de Design

Templates de página

Escolha a estrutura pelo trabalho que a página precisa realizar

Guia de aplicação3 modelosBrandbook V4

O template organiza a conversa

Use este guia para decidir como uma página deve ser lida antes de escolher componentes. A estrutura ajuda a apresentar contexto, evidência e próximo passo sem transformar a marca em uma fórmula.

Regra de escolha

Primeiro defina o trabalho da página. Depois escolha o modelo que reduz melhor a dúvida do leitor.

Template 01 // Página institucional

Apresente a marca
com direção.

Para explicar quem somos, como pensamos, qual problema organizamos e qual é o próximo passo da conversa.

MAGGIUMPágina institucional
01 // Contexto

Clareza antes da criação

Marketing como ferramenta de vendas, organizado por método, criatividade e critério.

Conhecer o método →
PosicionamentoMétodo S.A.V.E.Próximo passo
Demonstração: uma ideia principal, contexto suficiente e uma ação clara.

Quando usar

  • Apresentar: a marca para uma pessoa que ainda não a conhece
  • Explicar: posicionamento, método, oferta ou cultura

Estrutura mínima

  • Abertura: uma promessa de entendimento, não de resultado
  • Corpo: contexto, diferenciais e evidências aplicáveis

Preserve a marca

  • Títulos: Averia Libre com hierarquia e respiro
  • Leitura: Urbanist em textos, interface e informações de apoio

Evite

  • Excesso: manifesto longo antes de explicar o essencial
  • Promessas: faturamento, conversão garantida ou atalho mágico

Para IA: descreva primeiro o objetivo da página, depois a ordem das seções e só então os componentes visuais.

Template 02 // Painel de decisão

Mostre o que
precisa ser decidido.

Para organizar indicadores, cenários e recomendações quando o leitor precisa entender uma situação e escolher o próximo movimento.

PAINEL MAGGIUMLeitura comercial

Direção da semana

Contexto: ciclo atual // atualizado hoje

Visão geral
Oportunidades12
Prioridade03
Próxima ação01
Sinal por etapa
LeituraConcentrar atenção

Escolha um sinal, registre a fonte e indique quem decide o próximo passo.

Demonstração: métricas com contexto, fonte e recomendação, sem transformar número em promessa.

Quando usar

  • Comparar: cenários, prioridades ou caminhos de trabalho
  • Acompanhar: sinais que orientam uma decisão

Estrutura mínima

  • Contexto: período, público, fonte e pergunta central
  • Leitura: poucos indicadores, evidência e próxima ação

Preserve a marca

  • Critério: rotule unidades, datas e limites de cada dado
  • Contraste: destaque uma prioridade sem esconder o restante

Evite

  • Acúmulo: muitos KPIs competindo pela primeira leitura
  • Conclusão falsa: dado sem fonte, recorte ou responsável

Para IA: cada número precisa de definição, período, fonte e interpretação autorizada. Se faltar um desses itens, sinalize a lacuna.

Template 03 // Grade de conteúdo

Dê ritmo ao
que precisa ser lido.

Para reunir artigos, cases, referências, aulas ou materiais relacionados sem perder hierarquia, contexto e destino.

BIBLIOTECA MAGGIUMGrade de conteúdo

Escolhas para avançar

Materiais organizados por objetivo
Filtrar
Destaque

Clareza para decidir

Uma peça principal conduz a leitura sem competir com os próximos caminhos.

Leitura recomendada

Use uma imagem, um título e uma linha de contexto. O destino precisa ser evidente.

Abrir material →
01 // MétodoOrganizarGuia
02 // CriaçãoAplicarReferência
03 // RevisãoAprenderChecklist
Demonstração: um destaque conduz a entrada e os cards seguintes mantêm ritmo e reconhecimento.

Quando usar

  • Reunir: materiais que pertencem ao mesmo tema ou jornada
  • Orientar: leitura por categoria, etapa ou objetivo

Estrutura mínima

  • Entrada: título, filtro ou categoria que explique o conjunto
  • Cards: imagem, título, contexto curto e destino claro

Preserve a marca

  • Ritmo: repita a anatomia do card e altere apenas o necessário
  • Imagens: use função editorial, alt text e proporção consistente

Evite

  • Mosaico aleatório: tamanhos diferentes sem prioridade explicada
  • Card vazio: imagem bonita sem contexto ou próximo destino

Para IA: trate cada card como uma unidade de conteúdo: objetivo, título, resumo, ativo, alt text e ação.