Como esta página foi feita
Nossos apps são usados no meio do trabalho, então precisam ser fáceis. Este site segue as 10 heurísticas de usabilidade de Jakob Nielsen e o nível AA das WCAG 2.2. Abaixo, onde cada uma aparece.
As 10 heurísticas de Nielsen
Visibilidade do status do sistema
O formulário da lista de espera avisa quando está enviando (o botão mostra um indicador girando), quando deu certo (aparece um sinal de confirmação) e quando falhou (os campos com erro balançam de leve e mostram a mensagem). O menu marca a seção que está na tela, a página do Agromoo mostra o caminho de volta (Scapus / Produtos / Agromoo) e o botão de instalar o site só aparece quando o navegador permite.
Correspondência com o mundo real
Cada página fala a língua de quem usa: piquete, ordenha, lote e cama do compost barn no Agromoo; modelagem, protótipo e orçamento no Scapus Lab. A sigla PWA aparece sempre explicada, e os botões dizem o que fazem ("Pedir orçamento por e-mail", "Entrar na lista").
Controle e liberdade
O menu fecha com Esc e devolve o foco ao botão. Depois do cadastro, dá para cadastrar outra pessoa. A caixa de aceite começa desmarcada e todo link que abre outra aba avisa antes. O site segue o tema claro ou escuro do aparelho; se você escolher o outro, ele lembra, e voltar ao tema do aparelho faz o site seguir o aparelho de novo.
Consistência e padrões
Um botão principal por contexto, com o mesmo formato em todo o site. A ação se chama "Entrar na lista" do começo ao fim, e cada link leva para o que diz o texto. Cores e tipos vêm das mesmas variáveis do arquivo de identidade no Figma.
Prevenção de erros
Campos com o tipo certo (e-mail, telefone), preenchimento automático do navegador, faixas prontas para o tamanho do rebanho e validação ao sair de cada campo, antes do envio. Os botões de orçamento avisam que vão abrir o e-mail ou o WhatsApp.
Reconhecer em vez de lembrar
Todo campo tem rótulo visível, que não some ao digitar. A dica de formato do WhatsApp fica embaixo do campo. O cabeçalho fica fixo, com o menu sempre à vista, e as dúvidas do Lab ficam abertas na página, sem precisar clicar.
Flexibilidade e eficiência
Link para pular direto ao conteúdo, navegação completa pelo teclado, instalação como app e tema escuro automático. As animações são curtas, respondem ao que a pessoa faz e ficam todas desligadas quando o aparelho pede menos movimento.
Estética e design minimalista
Uma ideia por seção, laranja só onde se espera um clique, textos curtos e nenhum pop-up.
Reconhecer, diagnosticar e recuperar erros
As mensagens de erro ficam ao lado do campo e dizem como corrigir. Sem internet, o cadastro fica guardado no aparelho e é enviado depois. E-mail repetido não vira erro: a página avisa que você já está na lista. Se o app de e-mail não abrir, o endereço aparece escrito embaixo do botão. A página de erro 404 mostra os caminhos mais usados.
Ajuda e documentação
Perguntas frequentes na página do Agromoo, dúvidas comuns e passo a passo de como pedir um orçamento no Scapus Lab, e explicação de como instalar o app.
Acessibilidade (WCAG 2.2, nível AA)
- Contraste de texto acima de 4,5:1 nos dois temas. Exemplos no tema claro: texto principal sobre o bege, 15,3:1; texto secundário, 5,1:1; links em laranja profundo, 5,0:1; texto escuro no botão laranja, 6,0:1.
- Contorno de foco de 3 px em todo elemento clicável.
- Áreas de toque com pelo menos 44 px nos controles principais.
- Idioma declarado em português, marcos de página (cabeçalho, navegação, conteúdo, rodapé) e títulos em ordem.
- Ilustrações decorativas escondidas dos leitores de tela; a prévia do app tem descrição em texto.
- Links que abrem outra aba avisam isso aos leitores de tela.
- Erros do formulário ligados ao campo e anunciados por leitores de tela.
- Fonte Inter servida pelo próprio site: nenhuma requisição a serviços de terceiros para carregar a página.
Encontrou um problema?
Se algo não funcionar com o seu leitor de tela, teclado ou aparelho, conte para a gente pelo e-mail do rodapé.