Ir para o conteúdo
bertoni.coPTENOrçamento online

Estudo de caso · 2026

Spaço In

Agência 360 para escolas. O site organiza as frentes de atuação e conduz cada visitante à direção certa dentro da instituição até o contato.

Cliente
Spaço In
Segmento
Marketing para escolas e educação
Entrega
Site institucional
Ano
2026
No ar
No arspacoin.com.br

01 · O site

Rolando do começo ao fim

Gravação da rolagem do site publicado. Para navegar, abra o site no ar.

Gravação da rolagemVer no ar ↗
spacoin.com.br

02 · O desafio

Uma agência com várias frentes (marketing educacional, RH educacional e formação) precisava falar com públicos diferentes dentro da mesma escola sem virar um catálogo confuso.

03 · A resposta

Cada frente ganhou um bloco com cor e foto próprias, numa página que desce como uma apresentação, com a prova de clientes logo em seguida e o contato sempre à mão.

  • Site institucional
  • Blocos por frente de atuação
  • SEO on-page
  • Dados estruturados

04 · Como foi feito

Sete etapas, uma equipe

Cada etapa tem uma frente responsável e um ponto de aprovação antes da seguinte. A IA entra como ferramenta, nunca como autora.

  1. 01

    Imersão

    Conversa com a equipe sobre cada frente e sobre quem decide dentro da escola.

    Estratégia e conteúdo
  2. 02

    Estratégia e conteúdo

    Uma frente por bloco, cada uma com a sua promessa e a sua chamada.

    UX e arquitetura
  3. 03

    Arquitetura e wireframes

    Página longa em blocos de cor, com a prova de clientes entre as frentes e o contato no fim.

    Direção de arte
  4. 04

    Direção de arte

    Roxo profundo, laranja e fotos de pessoas em ação. Montserrat em toda a página.

    Motion e interação
  5. 05

    Desenvolvimento

    Site em WordPress, com a mesma linha visual em todas as páginas.

    Desenvolvimento
  6. 06

    SEO, AEO e performance

    Metadados, textos alternativos e dados estruturados da organização.

    SEO, AEO e dados
  7. 07

    Testes e entrega

    Revisão em desktop e celular antes da publicação.

    Qualidade e performance

05 · Do wireframe ao layout

A estrutura antes da arte

A página inteira, de cima a baixo. Arraste a divisória: de um lado a estrutura (blocos, títulos, fotos e botões), do outro o layout final. Role dentro do quadro.

Wireframe do site Spaço InLayout final do site Spaço In
WireframeLayout final

06 · Direção de arte

Cores e tipos

  • Ameixa#49233c
  • Noite#070815
  • Laranja#dc6437
  • Areia#eadbbd
  • MontserratTítulos e texto

07 · Quem pensou cada parte

Sete frentes, um site

  • 01

    Estratégia e conteúdo

    Quem chega, o que precisa entender e em que ordem. Define a história antes de qualquer tela.

  • 02

    UX e arquitetura

    Mapa da página, wireframes e o caminho até o contato, testado no celular primeiro.

  • 03

    Direção de arte

    Paleta, tipografia, fotografia e o elemento de assinatura que torna o site reconhecível.

  • 04

    Motion e interação

    O que se move, por quê e em que velocidade. Tudo respeita quem pede movimento reduzido.

  • 05

    Desenvolvimento

    Código próprio, sem construtor visual: HTML leve, CSS crítico embutido, painel quando o cliente precisa.

  • 06

    SEO, AEO e dados

    Estrutura para o Google e para as IAs: schema, FAQ de respostas, metadados e consentimento LGPD.

  • 07

    Qualidade e performance

    PageSpeed, acessibilidade, segurança e teste em desktop e celular antes de entregar.

Quer um site assim?

Conte o seu projeto. A Bertoni responde no mesmo dia, pelo WhatsApp ou e-mail.