Contente
- 1. Não marque os campos obrigatórios
- 2. Não use spinners
- 3. Ter apenas um tipo de botão ou melhor ainda, apenas um botão por formulário
- 4. Campos de pedaços
- 5. Pense por que você está perguntando algo e como é para o usuário
- 6. Os encontros estão confusos, amiguinhos
- 7. Formulários como ofício do desenvolvedor
- 8. Não use colunas em formulários
- 9. Não use dois campos quando um fará
- 10. Seja legal
Formulários, não há nada que muitos designers odeiem mais do que formulários. Eles não necessariamente trazem a criatividade para fora, ou não? Talvez seja hora de olharmos os formulários novamente e entender que um formulário, em sua forma mais básica, é uma conversa entre o usuário e o software.
Esqueça apontar e clicar, os formulários representam a interação mais rica que nós, como designers digitais, enfrentaremos. Da próxima vez que um formulário vier em sua direção, não pense que é apenas uma questão de aplicar alguns efeitos CSS legais ou adicionar um toque de jQuery legal. Há muito mais profundidade no design de formulários.
Eu testei centenas de formulários e projetei alguns formulários complexos para seguradoras, interações de reservas de férias e muito mais. Provavelmente, você usou um dos meus formulários nos últimos meses.
Aqui estão as lições que gostaria de ter aprendido antes de começar a projetar formulários.
1. Não marque os campos obrigatórios
Você conhece o asterisco que denota um campo obrigatório? Já vi isso falhar muitas vezes em testes de usuários. Como um conceito, os campos obrigatórios não fazem muito sentido, eles não têm equivalente off-line. Eles são ótimos para desenvolvedores porque oferecem uma boa abordagem em preto e branco para a conclusão. O asterisco e o campo obrigatório falham porque é um comportamento aprendido. O comportamento típico que vi em testes de usuário é o usuário preencher o formulário na parte superior e terminar quando há algo para impedi-lo ou quando ele pressiona um botão.
A solução é simples, marque os campos opcionais, marque o lugar onde nosso simpático usuário deve parar e pensar se precisa preencher aquele campo.
2. Não use spinners
HTML5 é brilhante, não é? Ele oferece um monte de novas ferramentas brilhantes para brincar. Precisamos pensar sobre a adequação de nossos novos brinquedos. O campo de número agora inclui pequenas setas para cima e para baixo para permitir que o usuário percorra os números.
Existem dois problemas aqui. Em primeiro lugar, a exibição padrão das setas do navegador os torna realmente pequenos. Com um clique muito complicado, os dedos gordos entre nós vão ter problemas em um iPhone. É chamada de Lei de Fitt, quanto menor é algo, mais difícil é clicar nele.
Mas eu ouço você gritar, você pode simplesmente digitar o número diretamente no campo numérico. Sim, você pode, mas vamos olhar para a tela do navegador, as setas giratórias para cima / para baixo se parecem com nosso amigo fiel da caixa de seleção. Um usuário apresentado com um botão giratório pela primeira vez vai presumir, visto que se assemelha a uma caixa de seleção, que eles não podem digitar nela.
Meu conselho é ficar longe até que eles se tornem um lugar comum ou até que os desenvolvedores do navegador resolvam o design padrão.
3. Ter apenas um tipo de botão ou melhor ainda, apenas um botão por formulário
Existe um princípio de psicologia pouco conhecido chamado Lei de Hick. A Lei de Hick afirma que quanto mais opções temos, mais difícil é fazer uma escolha. Não é ciência de foguetes, eu sei, mas uma regra que vale a pena manter em mente.
Você pode ajudar seu bom usuário, ajudando-o a fazer uma escolha. Tornar todos os botões primários uma cor e ter apenas um deles por página torna a escolha mais fácil. Qual é o botão que eu deveria apertar? Oh, é fácil, é o grande colorido.
4. Campos de pedaços
Estudei neurociência em uma vida anterior e, portanto, estudei a psicologia da memória - especificamente a memória de curto prazo ou de trabalho. Agora, antes que você diga; não, a capacidade de memória de curto prazo não é 7 +/- 2, 4 +/- 1 ou em humanos falam três a cinco blocos. Nós, como humanos, somos ótimos para avaliar estímulos visuais, a restrição é que somos melhores quando o número é menor. Dividir um formulário em grupos menores torna a avaliação mais fácil, já que muitas vezes o que o usuário precisa inserir no formulário vem de sua memória.
Certifique-se de que seus grupos de campos tenham cerca de quatro de comprimento.
5. Pense por que você está perguntando algo e como é para o usuário
Este é provavelmente o conselho mais direto que dou, mas geralmente é o menos utilizado.
Vamos pegar o seguinte:
Questione cada pergunta que você fizer. Isso é necessário? Qual é a sensação de ser perguntado sobre isso?
Na maioria das vezes, há uma necessidade comercial de fazer uma pergunta e nós, como designers, podemos discutir sobre a necessidade até ficarmos roxos. A pergunta tem que ser feita. Ao compreender a necessidade comercial desses dados, podemos freqüentemente comprometer.
Podemos ajudar dizendo ao nosso bom usuário por que precisamos fazer essa pergunta. Tranquilize sobre o uso e o compartilhamento desses dados e, em geral, seja legal.
Tomando nosso exemplo novamente:
Ainda é uma pergunta difícil, mas espero que tenhamos adoçado a pílula.
6. Os encontros estão confusos, amiguinhos
Inserir datas pode ser um verdadeiro desafio e existem algumas armadilhas que você pode evitar. O maior problema é lidar com os erros.
A abordagem mais fácil é lançar um calendário. É importante notar que as semanas começam em uma segunda-feira no Reino Unido e um domingo nos EUA. Se o seu usuário não estiver concentrado, ele pode muito bem selecionar um domingo, quando significa uma segunda-feira.
Também vale a pena mencionar os formatos de data internacionais. Os EUA colocam o mês em primeiro lugar, no Japão o ano em primeiro. Portanto, uma data como 5/4/12 pode ser interpretada de três maneiras.
É por isso que é melhor usar caixas de seleção.
7. Formulários como ofício do desenvolvedor
Os formulários são criados tanto para desenvolvedores quanto para designers. Compreender quais erros podem ser cometidos ao inserir dados e projetar seu código de back-end para lidar com isso é um desafio.
Aqui está um simples. Inserindo um valor de moeda. Os possíveis erros que o usuário pode cometer são enormes. Forçar formatos de dados que os usuários precisam atender é frustrante para o usuário e, vamos encarar, um pouco preguiçoso da parte dos desenvolvedores.
Que melhor desafio para um desenvolvedor do que construir um formulário à prova de balas.
8. Não use colunas em formulários
O grande problema em usar colunas em formulários é o fluxo. Começamos um formulário na parte superior e terminamos na parte inferior. Ao introduzir colunas, o fluxo do formulário pode ser interrompido.
Não presuma que os usuários percorram os formulários e, portanto, o foco é uma forma de navegar pelos formulários em colunas. É raro que eu tenha visto isso em testes com usuários. Na maioria das vezes, vemos inserir os detalhes, clicar no próximo campo com o mouse / trackpad / dedo e inserir os detalhes e assim por diante.
9. Não use dois campos quando um fará
A maioria das pessoas não é datilógrafa. Nos testes de usuário, vemos pessoas olhando para o teclado enquanto digitam.
Ao inserir um número de telefone, a divisão do campo do formulário, digamos, para adicionar o código de área e o número, causa problemas reais. Os usuários não veem ou não se lembram de que existem dois campos, então insira o número completo no primeiro campo, pior se o campo for limitado a um determinado número de caracteres.
Use apenas um campo para o número de telefone, o mesmo se aplica ao número da casa / rua - use apenas uma caixa de entrada de texto.
10. Seja legal
Você ficaria surpreso com a quantidade de mensagens de erro bastante rudes que existem por aí.
Aqui está um exemplo de um que encontrei recentemente.
O próprio fato de eles estarem sugerindo que você entraria voluntariamente em uma data no futuro e, em seguida, uma resposta um tanto jocosa, bem, não é muito bom.
Coloque-se novamente no lugar do usuário, como você se sentiria ao ver esse erro? Incomodado? Talvez até pior. Ser legal é fácil.
Eu produzi um berço / folha de referências para download para ajudá-lo a criar formulários melhores. Inclui muitas outras formas de práticas recomendadas para projetar formulários melhores.