O seu site fala antes de você.
Desenho e desenvolvo sites, landing pages e experiências digitais do zero, para a sua empresa parecer o que ela entrega.
Fig. 01 · Folha de construção da marca Tramma Web
Manifesto
Ninguém conhece uma empresa pelo que ela diz de si. Conhece pelo que vê: o cuidado, a clareza, o tempo que a página leva para abrir. Na internet, esse primeiro encontro é o site. E quase sempre ele acontece antes de qualquer conversa.
Por isso um site não é cartão de visita. É ferramenta de posicionamento: decide como a sua empresa é percebida, quem chega até ela e com que disposição chega.
Cada página que sai daqui começa nessa pergunta e termina num caminho claro até a conversa.
Toda página começa num módulo.
O quadrado laranja da marca é a unidade de medida de tudo o que eu desenho. Daqui em diante, uma página se monta com ele, na ordem em que as decisões de verdade acontecem.
-
01
Estrutura
Antes da cor, a ordem. O que vem primeiro, o que merece destaque, onde a decisão acontece. Uma página bem resolvida já funciona em blocos cinza.
-
02
Hierarquia
Tamanho é argumento. A promessa, a prova e a chamada ganham o peso do papel que têm. Aqui, a altura de cada bloco é a importância dele.
-
03
Identidade
Então entra a marca: cor, tipografia, imagem. Não como enfeite por cima, mas como linguagem que atravessa a página inteira.
-
04
Experiência
Por último, o comportamento: movimento que orienta, resposta ao toque, carregamento rápido no celular. É aqui que o desenho vira produto.
Uma mesma estrutura. Personalidades diferentes.
Cada negócio conversa de um jeito com o seu público. Abaixo, explorações conceituais para mostrar como a direção muda de um ramo para outro.
Experiência conceitualExperiências conceituais com marcas fictícias. Nenhuma delas é cliente.
Demonstração conceitual: página de Sua Clínica, marca fictícia do ramo saúde e odontologia. Promessa: Cuidado que começa na primeira consulta.
DireçãoCalma e precisão. Muito respiro, contraste suave e o agendamento sempre à mão.
- Sereno
- Claro
- Confiável
Demonstração conceitual: página de Sua Construtora, marca fictícia do ramo construção e imobiliário. Promessa: Do terreno à entrega das chaves.
DireçãoEscala e solidez. Tipografia condensada, foto de obra e o empreendimento como protagonista.
- Sólido
- Direto
- Técnico
Demonstração conceitual: página de Seu Restaurante, marca fictícia do ramo gastronomia e hospitalidade. Promessa: Cozinha de estação, servida sem pressa.
DireçãoApetite e atmosfera. Foto que ocupa a tela, serifa elegante e a reserva em um toque.
- Acolhedor
- Sensorial
- Elegante
Demonstração conceitual: página de Sua Arena, marca fictícia do ramo esporte e entretenimento. Promessa: Treino que muda o seu ritmo.
DireçãoEnergia e movimento. Caixa alta larga, contraste máximo e a agenda visível de cara.
- Intenso
- Rápido
- Ousado
Demonstração conceitual: página de Sua Barbearia, marca fictícia do ramo beleza e bem-estar. Promessa: Corte clássico. Acabamento de navalha.
DireçãoRitual e detalhe. Luz quente, textura de madeira e o horário marcado no centro.
- Clássico
- Quente
- Próximo
Demonstração conceitual: página de Sua Loja, marca fictícia do ramo comércio e varejo. Promessa: A vitrine que não fecha.
DireçãoProduto em primeiro plano. Grade de vitrine, cor de campanha e o pedido a um toque.
- Vibrante
- Leve
- Comercial
Demonstração conceitual: página de Seu Escritório, marca fictícia do ramo serviços profissionais. Promessa: Clareza para decisões que não podem errar.
DireçãoAutoridade sem frieza. Serifa clássica, linhas finas e cada área de atuação bem explicada.
- Sóbrio
- Preciso
- Humano
Demonstração conceitual: página de Sua Indústria, marca fictícia do ramo corporativo e b2b. Promessa: Tecnologia de processo para quem produz em escala.
DireçãoPrecisão e confiança. Grade rígida, informação técnica em evidência e contato comercial direto.
- Técnico
- Seguro
- Global
O que eu desenvolvo.
Cada formato resolve um problema diferente. O ponto de partida é sempre o mesmo: entender o que a página precisa fazer pelo seu negócio.
-
01 Sites institucionais Para a sua empresa ser entendida, lembrada e escolhida.
Apresenta quem você é, o que faz e por que confiar, com uma estrutura que aguenta crescer: serviço novo, página nova, sem refazer o site.
Conversar sobre issoO trabalho envolve
- Arquitetura das páginas
- Textos organizados para leitura rápida
- Preparação para o Google
-
02 Landing pages Uma página, uma oferta, um objetivo.
Para campanha, lançamento e anúncio que precisam transformar visita em contato. Escrita em cinco partes: promessa, prova, oferta, objeções e chamada.
Conversar sobre issoO trabalho envolve
- Roteiro antes do desenho
- Uma chamada, repetida no ritmo da leitura
- Carregamento rápido no celular
-
03 Sites para negócios locais Achado no bairro, escolhido na cidade.
Horário, endereço, serviços e WhatsApp onde a pessoa procura, do jeito que ela procura, para quem pesquisa no celular a caminho.
Conversar sobre issoO trabalho envolve
- Informação de contato sempre à mão
- Busca local considerada desde o título
- Página leve para rede móvel
-
04 Sites corporativos Muitas áreas, um caminho claro para cada visitante.
Para empresas com vários produtos, públicos ou unidades. A arquitetura de conteúdo vem antes do layout, para ninguém se perder no meio do caminho.
Conversar sobre issoO trabalho envolve
- Mapa de conteúdo por público
- Navegação que escala
- Componentes reutilizáveis
-
05 Experiências digitais interativas Quando a marca pede mais que uma página.
Cena 3D, narrativa guiada pela rolagem e interação que o visitante lembra depois de fechar a aba. Como esta página.
Conversar sobre issoO trabalho envolve
- Cenas 3D em tempo real
- Narrativa presa à rolagem
- Versão leve para celular simples
-
06 Interfaces e soluções sob medida Quando o formulário padrão não resolve.
Simulador, calculadora, configurador de produto ou um fluxo próprio do seu atendimento, desenhado para o processo que a sua empresa já tem.
Conversar sobre issoO trabalho envolve
- Entendimento do processo
- Protótipo antes do código
- Integração com o WhatsApp
-
07 Direção visual e animação Para quem já tem site e quer outro nível.
Direção de arte, sistema visual e animações implementadas no código, em cima do que a sua empresa já tem no ar.
Conversar sobre issoO trabalho envolve
- Diagnóstico do site atual
- Sistema de cor, tipografia e movimento
- Animação com desempenho medido
Demonstração interativa
Laboratório de direção.
Mude o tom, a cor, a forma e o ritmo, e veja a mesma página assumir outra personalidade. São as decisões que eu tomo com você no começo de cada projeto.
Da primeira conversa à página no ar.
Em cada etapa você sabe o que está sendo feito e o que depende de você. É isso que impede um projeto de parar sem ninguém saber por quê.
-
Etapa 01
Descoberta e estratégia
Você me conta o que vende, para quem e o que está travando hoje. Estudo o seu negócio, a concorrência na sua cidade e o que o seu cliente digita antes de achar você. Saio dali com escopo e valor fechados.
Sua parteUma conversa.
-
Etapa 02
Direção criativa
Escrevo a página antes de desenhar: o que ela promete, como prova e o que pede, na ordem em que se lê. A direção visual nasce da sua marca, não de um modelo pronto.
Sua parteCorrigir o que eu entendi errado.
-
Etapa 03
Design e experiência
Você vê a página desenhada antes de existir código, no computador e no celular, com o comportamento de cada parte explicado.
Sua parteAprovar ou apontar o que mudar.
-
Etapa 04
Desenvolvimento
Programo a página do zero e te mando um link que atualiza a cada rodada. Nada de sumir e reaparecer no fim.
Sua parteTextos, fotos e logo. E olhar o link.
-
Etapa 05
Testes, publicação e evolução
Testo em celular fraco com internet limitada, no teclado e no leitor de tela. Domínio apontado, certificado, Google avisado. Depois, quando precisar mudar alguma coisa, é só chamar.
Sua parteDizer que pode subir.
Um site melhor muda a conversa antes de ela começar.
-
01
Profissionalismo que se vê
A primeira impressão acontece em segundos e sem você presente. Um site cuidadoso diz que o resto do seu trabalho também é.
-
02
Diferença que se nota
Quando a concorrência usa o mesmo modelo pronto, uma página pensada para a sua marca é o jeito mais rápido de não ser confundido.
-
03
Serviços explicados com clareza
Quem entende o que você faz nos primeiros segundos continua lendo. Quem não entende volta para a busca.
-
04
Confiança antes do contato
Informação completa, prova visível e um caminho claro respondem as dúvidas que a pessoa nem chega a perguntar.
-
05
Contato sem atrito
WhatsApp no lugar certo e no momento certo, com a mensagem já começada. Ninguém precisa caçar o botão.
-
06
Base para atrair clientes
Anúncio, busca e redes sociais levam gente até o site. É ele que decide se essa visita vira conversa.
O padrão de toda entrega
O que dá para conferir em qualquer projeto que sai daqui.
-
01
Nenhum template
O layout é desenhado para a sua marca. Ninguém abre outro site e reconhece o seu.
-
02
Velocidade medida, não prometida
Cada entrega passa por teste de carregamento em celular com internet e processador limitados.
-
03
Funciona no teclado e no leitor de tela
Contraste, foco visível e alvo de toque conferidos por script antes de subir.
-
04
Preparado para o Google
Título, descrição, sitemap e dados estruturados escritos à mão, sem depender de plugin.
Sem promessa de posição no Google nem de número de vendas. Isso depende de oferta, concorrência e tempo, e quem garante está vendendo o que não controla.
Perguntas antes de começar.
Não achou a sua pergunta?
Perguntar no WhatsAppQue tipos de site você desenvolve?
Sites institucionais, landing pages, sites para negócios locais, sites corporativos e experiências interativas como esta página. Quando o projeto pede, também desenho interfaces específicas, como simuladores e calculadoras.
Como funciona o processo?
Começa numa conversa e termina com a página no ar. Em cada etapa você sabe o que está sendo feito e o que depende de você. Você vê a página desenhada antes de existir código e acompanha a construção por um link que atualiza a cada rodada.
O site pode ser personalizado para a minha empresa?
Não existe outro jeito de fazer aqui. Não uso tema pronto nem construtor de blocos: estrutura, textos e direção visual partem do seu negócio e da sua marca.
Quanto custa?
Depende do escopo, e por isso não tem tabela aqui. Uma página de uma oferta só e uma que precisa apresentar seis serviços, com fotos novas e textos escritos do zero, não são o mesmo trabalho. Me manda no WhatsApp o que você vende e eu volto com escopo e valor fechados.
Quanto tempo leva?
Depende do escopo, e o prazo fechado vai junto com o orçamento. Antes de você aprovar qualquer coisa, não depois. O que mexe no relógio quase sempre é a mesma coisa: textos e fotos. A parte que é comigo eu controlo; a que espera por você é a que costuma esticar. Por isso você vê a página desenhada antes de existir código. Aprova cedo, e o resto anda.
Como funciona a publicação e a manutenção?
Eu cuido da publicação: domínio apontado, certificado e o Google avisado. Se você já tem domínio e hospedagem, configuro no que você tem; se ainda não tem, a gente resolve isso junto na primeira conversa. Depois, quando precisar mudar alguma coisa (um texto, uma foto, um serviço novo), é só me chamar e a gente combina.
É feito em WordPress?
Não. O site é escrito em código, arquivo por arquivo. WordPress e construtores resolvem bem o caso de quem precisa publicar sozinho toda semana; o custo deles é peso, tema parecido com o dos outros e plugin que quebra sozinho na atualização.
Meu site vai aparecer no Google?
A página sai preparada para ser indexada: título, descrição, sitemap e dados estruturados escritos à mão. Aparecer em primeiro lugar depende de concorrência e de tempo, e quem te promete posição está te vendendo algo que não controla.
Como peço um orçamento?
Pelo WhatsApp, em qualquer botão desta página. Me conta o que você vende e o que precisa, ou monte a mensagem no fim da página em poucos toques. Eu volto com escopo e valor por escrito.
A próxima página pode ser a sua.
Me conta o que o seu negócio faz. Eu volto com escopo e valor, por escrito.
WhatsApp (46) 99914-1622
- Você conta O que o negócio faz e para quem é o site.
- Eu mando escopo e valor O que entra e quanto custa, por escrito.
- A gente começa Com o combinado fechado, o projeto começa.