O horizonte vira interface — e cada gesto ganha direção.
Uma travessia digital autoral que alterna impulso, precisão e silêncio para transformar movimento, direção de arte e hospitalidade em percepção premium.
MAREA ocupa o encontro entre precisão, liberdade e hospitalidade privada. A oportunidade era traduzir esse território sem depender de um catálogo de embarcações: construir uma presença capaz de fazer o visitante sentir ritmo, controle e horizonte antes de conhecer qualquer detalhe da operação.
Criar sensação de alta performance sem transformar ficção em oferta.
A referência pedia tipografia expressiva, transições de estado e narrativa guiada pelo scroll. O desafio foi traduzir esses princípios para o universo náutico com propósito, desempenho e transparência, evitando copiar identidade, composição ou conteúdo e sem sugerir que uma travessia pudesse ser contratada.
02 / Conceito criativo
A ideia que orienta tudo
O horizonte como estado, não como destino.
Assinatura visual e interativa
Navegador de horizonte: uma linha de progresso acompanha o scroll, anuncia o ato ativo e permite saltar entre partida, impulso, precisão e horizonte.
03 / Sistema de expressão
Cor, tipografia e movimento contam a mesma história.
Arial Narrow / Avenir Next CondensedTítulos, presença e ritmo editorialAvenir Next / InterLeitura, clareza e interfaceMovimento
Cortes velozes, camadas em profundidade e estados que respondem ao ritmo da travessia.
04 / Storytelling da marca
Uma sequência que transforma navegação em narrativa.
Partida → Impulso → Precisão → Horizonte
01
Partida: hero de horizonte e tese da marca
02
Impulso: rastro aéreo, tipografia cinética e aceleração
03
Precisão: detalhe material e limites de uma operação real
04
Horizonte: desaceleração e memória
05
Compositor de estados: Abrir, Acelerar e Pausar
06
Resposta direta e epílogo da Guia-se
05 / Decisões estratégicas
Forma com intenção comercial.
01
Tempo como arquitetura
Quatro atos organizam a experiência: a Partida abre escala, o Impulso acelera tipografia e imagem, a Precisão aproxima a matéria e o Horizonte desacelera a leitura.
02
Movimento com função
Progresso, estado ativo, tipografia cinética e mudanças de atmosfera informam onde a pessoa está. A interface mantém navegação direta e respeita movimento reduzido.
03
Conversão fora da ficção
A demo permanece em voz de marca até o epílogo. Só então autoria, página de case e WhatsApp real da Guia-se aparecem como próximos passos separados.
06 / Copy e conversão
Uma voz que conduz sem soar genérica.
A voz da marca constrói sensação antes de explicar recursos: frases curtas aceleram a leitura, pausas ampliam o horizonte e o epílogo oferece dois caminhos claros — conversar sobre um site autoral ou aprofundar as decisões do case.
07 / Recursos técnicos
Tecnologia a serviço da experiência.
React 19 e Vite 8 com saída estática
Navegador de horizonte calculado por posição de scroll
Seletor de estados operável por clique, setas, Home e End
Três imagens locais com dimensões explícitas e lazy loading abaixo da dobra
Fallback legível e suporte a prefers-reduced-motion
404, robots, sitemap, manifest e cabeçalhos próprios
08 / SEO, AEO e GEO
Ser encontrado. Ser compreendido. Ser citável.
A demonstração usa noindex, follow; a página de case é a URL indexável. Título, description, canonical, Open Graph e Twitter Card são específicos. O JSON-LD se limita a WebPage e CreativeWork, com autoria real da Guia-se e resposta visível para “O que é MAREA?”.
09 / Percepção construída
O que esta experiência faz a marca comunicar.
Uma experiência temporal e ousada, em que o scroll muda o estado da narrativa, a tipografia assume escala cinética e os intervalos de silêncio valorizam os momentos de aceleração. A marca comunica performance sem perder exclusividade e presença humana.
Narrativa própria em quatro atos
Movimento orientado por estado e navegação
Ficção separada do contato comercial real
Demo preparada para noindex e case indexável
10 / Perguntas que importam
Clareza antes do próximo passo.
Três imagens foram geradas por IA para o case, sem pessoas, barcos visíveis, logotipos, texto, costas ou localização identificável. Não representam viagem ou serviço. Termos de uso comercial permanecem a confirmar antes da publicação.
MAREA é uma empresa náutica real?+
Não. É uma marca fictícia criada pela Guia-se Botafogo/RJ para demonstrar direção criativa e desenvolvimento de uma experiência digital premium.
A demonstração oferece reservas, rotas ou embarcações?+
Não. Nenhuma operação, frota, equipe, destino, preço, agenda ou disponibilidade é apresentada como real.
O que foi efetivamente validado?+
Lint, TypeScript, build, testes automatizados, desktop, mobile, teclado, imagens, links, console e 404 foram validados localmente. Lighthouse e produção após redesign ainda não foram medidos.
A PRÓXIMA DIREÇÃO É A DA SUA MARCA
Seu site não precisa parecer com este. Precisa provocar uma percepção que só faça sentido para você.
A conversa começa pelo que sua marca precisa tornar claro, desejável e possível — com objetivos, provas e conteúdo verdadeiros.
