Scooto
O cliente
A Scooto se apresenta como uma BPO (Business Process Outsourcing) de relacionamento, que cuida da jornada entre pessoas e empresas, da prospecção fria ao suporte técnico e à retenção. A Scooto oferece soluções de vendas, atendimento ao cliente e formação de equipes, e descreve o próprio time, as Scooteiras, como 100% feminino e remoto.
O que fizemos
Balão da marca que vira vídeo
Na primeira tela da nova home da Scooto, o balão da marca mostra uma cena de atendimento. Ao rolar, o balão cresce até o vídeo virar o fundo do título “Escale com a gente.”
Pergunta que abre o WhatsApp
No topo da nova home da Scooto, o campo “O que gostaria de resolver?” abre o WhatsApp da Scooto com a pergunta já escrita, e quatro atalhos levam a vendas, time, atendimento e candidaturas.
Soluções em forma de escada
As três soluções da Scooto aparecem em campos de cor lado a lado, cada campo um degrau acima do anterior, com tudo o que cada solução entrega e o link para a página dela.
Depoimentos, uma voz por vez
Os seis depoimentos de clientes da Scooto ocupam um palco só, um de cada vez, dois deles em vídeo vertical, e trocam por clique, pelas setas do teclado ou deslizando o dedo, sem autoplay.
Vídeo da fundadora em janela própria
Na nova home da Scooto, o vídeo “Marina Vaz apresenta Scooto” abre numa janela que cresce a partir do botão e, ao fechar, devolve o foco ao mesmo botão.
Orçamento com o formulário da Atendare
A seção de orçamento da Scooto traz o formulário real da Atendare, vestido com a fonte e os campos da página, com espaço reservado durante o carregamento e o WhatsApp como saída se ele falhar.
Perguntas frequentes como conversa
As 11 perguntas frequentes da Scooto viram uma conversa: a pergunta é o balão de quem visita, a resposta chega no balão azul da Scooto, e a busca do navegador consegue abrir a resposta.
Menu, idiomas e botão flutuante
No celular, o menu da Scooto abre um painel com um bloco de cor por destino. O seletor PT/EN usa o tradutor do site da Scooto, e o botão flutuante nunca fica parado sobre texto.
Como foi feito
A nova home da Scooto foi construída em Astro, com a rolagem do hero em GSAP (ScrollTrigger), e está publicada na Vercel. O texto da nova home foi copiado do site da Scooto sem mudar uma vírgula, salvo a correção de erros de digitação.
O desenho da nova home da Scooto parte das artes da marca: o balão com rabinho foi redesenhado em geometria e vira botão, marcador de lista e balão de conversa. A nova home usa só a Sora, a fonte da marca, e as cores da Scooto, com escala tipográfica e durações de movimento fixas.
Acessibilidade e desempenho
A nova home da Scooto tem link para pular às soluções, foco visível e botões de 44 px para toque, e aparece inteira e parada com movimento reduzido ou sem JavaScript. O leitor de tela lê os números da Scooto pelo valor final, sem a contagem. As fotos da Scooto saem em AVIF ou WebP, em vários tamanhos, e os vídeos da fundadora e dos depoimentos só carregam no play.
Estrutura para a busca
A nova home da Scooto é HTML gerado pelo Astro, e todo o texto, inclusive as respostas das 11 perguntas frequentes, já vem no HTML servido. A nova home da Scooto tem um h1, um h2 por seção e h3 para cada solução, matéria, pergunta e post, além de título, descrição e Open Graph com imagem de 1200 × 630.
Processo
A nova home da Scooto começou com três direções para o cabeçalho e a primeira tela: editorial, imersão e ecossistema. A direção de imersão da Scooto, a proposta B, passou por seis rodadas de ajuste e depois ganhou a página inteira, seção por seção, com o conteúdo real. Uma última fase uniformizou cantos, escala tipográfica e durações na nova home da Scooto, e três seções voltaram à versão anterior.
Ficha
- Cliente
- Scooto
- Feito por
- InCraft
- Segmento
- Atendimento e vendas
- Ano
- 2024 – até hoje
- Serviços
- Website, UX/UI Design, Dev, Suporte / acompanhamento
- Tecnologia
- Astro, GSAP, Vercel