Como normalmente lidamos com cronogramas bem apertados, às vezes passamos batido por uma etapa que é superimportante em todo projeto de UX/design de interação: a definição de padrões.

Não vou entrar aqui na questão protótipos de alta fidelidade vs. protótipos de baixa fidelidade vs. rapid prototyping. Por mais ágil que seja a sua abordagem, você precisa de padrões para manter a consistência da experiência do usuário com o produto.

Já vi equipes desprezando esta etapa para ganhar tempo, e por considerá-la um pouco “burocrática”. No fim das contas, acabaram tendo muito retrabalho e o tempo que deveria ter sido economizado acabou sendo gasto com refações e discussões tardias de questões que deveriam ter sido abordadas no início do projeto.

O ideal é ter uma discussão profunda sobre quais são os direcionamentos gerais para produção dos protótipos e que padrões devem ser adotados, antes da equipe colocar a mão na massa. Esses direcionamentos devem ser consolidados em um documento (ou em vários documentos, ou em um site ou wiki) e compartilhado(s) com a equipe.

Os padrões devem ser transformados em uma biblioteca templates, com guidelines de utilização. Se você fizer tudo isso BEM direitinho, o resultado final deve ficar assim, assim, assim, assim ou assim.

Como nem sempre essa discussão profunda é possível, ao menos a equipe deve conversar sobre quais são os principais padrões a serem adotados, e ir ao longo do processo desenvolvendo e comunicando novos guidelines. Essa abordagem exige um pouco mais de atenção para o surgimento de novos padrões, e comprometimento para que eles sejam consolidados na biblioteca.

Independente da abordagem, seguem algumas dicas para uma boa definição de padrões de projeto:

• 1. Analise toda a documentação existente. Não deixe para analisar os documentos conforme o desenvolvimento do trabalho for realizado.

• 2. Se for um redesenho, dê uma olhada no estado atual do produto. Ele pode dar algumas dicas de padrões que a definição será necessária, mesmo que possam ser alterados depois. Antecipe a discussão.

• 3. É importante definir qual o grid mais adequado desde o início do projeto. É com base nele que todos os demais elementos serão construídos.

• 4. Comece olhando para as áreas mais comuns do produto. Por exemplo, em um site, comece definindo padrões para os elementos do cabeçalho e rodapé. Outras seções comuns são contato, mapa do site e busca.

• 5. Pense também em elementos reutilizáveis ao longo do projeto. Alguns mais comuns são: estilos de texto (texto normal, títulos, subtítulos, etc.), estilos de link, botões (ações primárias, secundárias, terciárias), estilo de parágrafo (entrelinhas, indentação, etc.), tabelas, boxes de apoio, modais/lightboxes/pop-ups, breadcrumbs, etc.

• 6. Se o produto contém formulários, é importante gastar um tempo pensando em quais as abordagens de construção. Deve-se definir desde questões como tipo, estilo e tamanho de campos, alinhamento (labels à esquerda, alinhados à direita ou acima dos campos), inline help e tooltips, campos obrigatórios, alinhamento de botões, até questões como adoção de progressive disclosure, passo-a-passo e mensagens de erro/sucesso.

• 7. Se o produto possui interações do tipo transição, é importante definir quais serão os padrões (fade, slide, expansão, etc.) e quando devem ser utilizados.

• 8. Um dos itens mais importantes em todo projeto é a questão dos rótulos. É imprescindível criar um vocabulário comum para call to action, nomes de seções e outros elementos utilizados ao longo da construção do produto. Dentro desse vocabulário, também vale a pena criar uma seção para ícones – quais são, o que significam e em que situações devem ser utilizados.

Independente de como esse processo é realizado ou entregue, o que importa mesmo é que essas regras e boas práticas sejam amplamente comunicadas e corroboradas por toda a equipe. Elas têm um papel superimportante nisso tudo, que é o de validar e melhorar os padrões existentes e sugerir novos sempre que necessário. [Webinsider]

Paulo Roberto Floriano

Paulo Roberto Floriano (paulo@neuestudio.com.br) é consultor em experiência do usuário, arquitetura de informação e design de interação. É proprietário da Neue Studio, co-autor de dois livros e palestrante.