Princípios de Design de Interface de Usuário

"Design é muito mais do que simplesmente montar, ordenar ou até mesmo editar, é adicionar valor e significado, para iluminar, para simplificar, para esclarecer, modificar, dignificar, dramatizar, persuadir, e talvez até mesmo para se divertir." - Paul Rand

Clareza é o primeiro e mais importante trabalho para qualquer interface. Para ser eficaz utilizando uma interface que você projetou, as pessoas devem ser capazes de reconhecer o que ela é, preocupe-se com o porque iriam utilizá-la, entenda com o que a interface ajuda interafir, preveja o que vai acontecer quando eles usarem-na, e então interaja corretamente com isso. Ao mesmo tempo que existe espaço para o mistério e recompensa nas interfaces, não há espaço para confusão. Clareza inspira ainda confiança que leva a usa-la. Cem telas claras são preferíveis do que uma única desordenada.

Interfaces existem para permitir a interação entre os seres humanos e nosso mundo. Elas podem ajudar a esclarecer, iluminar, ativar, mostrar as relações, nos unir, nos separar, gerenciar nossas expectativas, e dar-nos acesso aos serviços. O ato de projetar interfaces não é uma arte. Interfaces não são monumentos de si mesmas. Interfaces fazem um trabalho e sua eficácia pode ser medida. Elas não são apenas utilitários, no entanto. As melhores interfaces podem inspirar, evocar, mistificar, e intensificar a nossa relação com o mundo.

Vivemos em um mundo da interrupção. É difícil ler em paz sem algo mais tentando nos distrair e dirigir a nossa atenção para outro lugar. Atenção é preciosa. Não jogue lixo ao lado de suas aplicações com material distrativo... Lembre-se por que a tela existe, em primeiro lugar. Se alguém está lendo deixe-o terminar de ler antes de mostrar a propaganda (se for preciso). Honre a atenção e não só seus leitores ficaram mais felizes como seus resultados serão melhores. Quando o uso é o principal objetivo, a atenção torna-se o pré-requisito. Conserve-a a todo custo.

Os seres humanos ficam mais confortáveis quando se sentem no controle de si e de seu ambiente. Software Thoughtless tira esse conforto, forçando as pessoas a interações não planejadas, caminhos confusos e resultados surpreendentes. Mantenha os usuários no controle regularmente à tona do estado do sistema, descrevendo a causa (se você fizer isso o que vai acontecer) e dando dicas sobre o que esperar em cada turno. Não se preocupe com o óbvio... o óbvio quase nunca é.

A melhor interface é nenhuma, quando somos capazes de manipular diretamente os objetos físicos em nosso mundo. Uma vez que este nem sempre é possível, e os objetos são cada vez mais informacionais, nós criamos interfaces para nos ajudar a interagir com eles. É fácil adicionar mais camadas do que o necessário para uma interface, a criação de botões excessivamente forjados, cromo, gráficos, opções, preferências, janelas, anexos e outras bugigangas que acabamos manipulando elementos de interface de usuário ao invés do que é importante. Em vez disso, trabalhe para que o objetivo original seja pela manipulação direta... projete uma interface com menor rastro possível, reconhecendo, tanto quanto possível naturais gestos humanos. Idealmente, a interface é tão pequena que o usuário tem uma sensação de manipulação direta com o objeto de seu foco.

Cada tela que nós projetamos deve apoiar uma única ação de real valor para a pessoa usa-la. Isto faz com que seja mais fácil de aprender e fácil de utilizar, e mais fácil de adicionar ou construir quando necessário. Telas que suportam duas ou mais ações primárias tornam-se confusas rapidamente. Como um artigo escrito deve ter uma tese única, forte, cada tela do projeto deve apoiar uma única ação, forte, que é a sua razão de ser.

Telas com uma única ação principal pode ter várias ações secundárias, mas elas precisam ser mantidas secundárias! A razão pela qual o seu artigo existe não é para que as pessoas possam compartilhá-la no Twitter... ele existe para as pessoas leiam e compreendam. Manter as ações secundárias, secundárias, tornando-as mais leves visualmente ou apresentado a seguir à ação primária tendo sido alcançada.

Muito poucas interações são destinadas a serem as últimas, então cuidadosamente projete um próximo passo para cada interação que uma pessoa tem com sua interface. Antecipar o que a próxima interação deve ser e projetar para apoiar. Assim como nós gostamos numa conversa humana, proporcione uma abertura para mais interação. Não deixe uma pessoa esperando porque eles fizeram o que você queria... Dê-lhes um próximo passo natural que ajude-os ainda mais a alcançar os objetivos dela.

Os seres humanos ficam mais confortáveis com as coisas que se comportam da maneira que esperamos. Outras pessoas, animais, objetos, software. Quando algo ou alguém se comporta de forma consistente com as nossas expectativas sentimos que temos um bom relacionamento com ele. No fimelementos projetados devem parecer como se comportam. Na prática, isso significa que alguém deve ser capaz de prever como um elemento da interface vai se comportar apenas olhando para ele. Se parece com um botão que deveatuar como um botão. Não se preocupe com a beleza nos princípios de interação... mantenha a sua criatividade para preocupações de ordem superior.

Seguindo o princípio anterior, os elementos da tela não devem aparecer consistentes com cada outro, a menos que se comportem de forma consistente um com outro. Elementos que comportam o mesmo devem olhar o mesmo. Mas isso é tão importante quanto para o elementos diferentes parecerem diferentes (sendo inconsistente), pois é como aparecessem elementos consistentes. Um esforço considerável sendo designer novato, quando frequentemente obscurecem importantes diferenças, utilizando o mesmo tratamento visual (muitas vezes para re-utilização de código), quando o tratamento visual apropriado seria diferente.

Uma hierarquia visual forte é obtida quando há uma ordem clara para uma visualização dos elementos visuais na tela. Isto é, quando os usuários observarem os mesmos itens na mesma ordem sempre. Fracas hierarquias visuais dão poucas pistas sobre onde descansar o olhar e acaba dando uma impressão desordenada e confusa. Em ambientes de grande mudança é difícil manter uma hierarquia visual forte porque o peso visual é relativo: quando tudo está em negrito, nada é ousado. No caso de um único elemento visualmente pesado ser adicionado a uma tela, o designer pode necessitar repor o peso visual de todos os elementos para alcançar novamente uma forte hierarquia. A maioria das pessoas não percebe hierarquia visual, mas é uma das maneiras mais fáceis para fortalecer (ou enfraquecer) um projeto.

Como John Maeda diz em seu livro Simplicidade, organização inteligente de elementos da tela pode fazer muitos aparecer como poucos. Isso ajuda as pessoas a entenderem a sua interface mais facilmente e rapidamente, de como você já projetou as relações inerentes de conteúdo em seu projeto. Grupo juntos como elementos, mostram as relações naturais por colocação e orientação. Por organizar inteligentemente o conteúdo que você reduz a carga cognitiva sobre o usuário... que não tem que pensar sobre como os elementos são relacionados porque você fez isso por eles. Não force o usuário a descobrir as coisas... Mostre-lhes através do design dessas relações em suas telas.

A cor das coisas físicas muda com a mudanças de luz. Em plena luz do dia, vemos uma árvore muito diferente do que aquele delineado contra um pôr do sol. Como no mundo físico, onde a cor é uma coisa sombreada, a cor não deve determinar muito em uma interface. Ela pode ajudar, ser utilizada para o destaque, ser usadoa para guiar a atenção, mas não deve ser apenas o diferenciador de coisas. Em uma longa leitura ou tela prolongado, usar cores fundo claro ou silenciado, economizando tons mais fortes para as cores do seu sotaque. É claro que há um tempo para cores de fundo vibrantes, só não se esqueça do que é adequado para o seu público.

Mostre apenas o que é necessário em cada tela. Se as pessoas estão fazendo uma escolha, mostre informações suficientes para permitir-lhes a escolha, em seguida mergulhenos detalhes em uma tela subseqüente. Evite a tendência do excesso de explicar ou mostrar tudo de uma vez. Quando possível, adie decisões para as telas subseqüentes, progressivamente a divulgue as informações, se necessário. Isto irá manter suas interações mais claras.

Em interfaces ideais a ajuda não é necessária, pois a interface é aprendível e utilizável. O passo abaixo disto, a realidade, é aquele em que a ajuda está contextualmente em linha, disponível apenas quando e onde é necessária, escondida da vista em todas as outras. Pedindo para as pessoas ajudarem a encontrar uma resposta para suas perguntas coloca o ônus sobre elas para saber o que elas precisam. Em vez de construir ajuda onde ela é necessária... apenas se certifique de que ela está fora do caminho de pessoas que já sabem como usar a sua interface.

A primeira experiência com uma interface é fundamental, mas muitas vezes ignorada pelos designers. A fim de melhor ajudar os nossos usuários terem êxito sobre nosso design, é melhor projeta-lo para o estado zero, o estado em que nada ocorreu ainda. Este estado não deve ser uma tela em branco... deve fornecer direção e orientação para chegar até ter êxito. Grande parte do atrito de interação é nesse contexto inicial... uma vez que as pessoas compreenderam as regras elas têm uma probabilidade muito maior de sucesso.

As pessoas procuram soluções para os problemas que elas já têm, não problemas potenciais ou problemas do futuro. Portanto, resista à criação de interfaces para problemas hipotéticos, observe o comportamento existente e projete para resolver os problemas existentes. Isso não é tão emocionante como imaginar o céu azul, mas pode ser muito mais gratificante, já que as pessoas vão realmente usar sua interface.

Uma curiosa característica de um bom design é que normalmente passa despercebido pelas pessoas que o utilizam. Uma razão para isso é que, se o projeto for bem sucedido, o usuário pode se concentrar em seus próprios objetivos e não na interface... Quando eles completarem seu objetivo eles estarão satisfeitos e não precisarão refletir sobre a situação. Como designer isso pode ser difícil... como nós recebendo menos elogios quando nossos projetos são bons. Mas grandes designers estão contentes com um design bem usado... e sabemos que os usuários felizes são muitas vezes silenciosos.

Design visual e gráfico, a tipografia, a editoração, arquitetura de informação e visualização... todas estas disciplinas fazem parte do design de interface. Elas podem ser abordadas superficialmente ou especificamente. Não entre em guerras territoriais ou olhe por baixo em outras disciplinas: agarre a partir delas os aspectos que ajudam a fazer o seu trabalho e siga em frente. Puxe em insights de disciplinas aparentemente não relacionadas, bem... o que podemos aprender escrevendo, programando, encadernando, andando de skate, combatendo incêndios, praticando karatê?

Como na maioria das disciplinas de design, o design de interface é bem sucedido quando as pessoas estão usando o que você projetou. Como uma bela cadeira que é desconfortável para sentar, o design fracassou quando as pessoas optam por não usá-la. Portanto, design de interface pode ser tanto sobre a criação de um ambiente para o uso quanto estar criando um artefato que vale a pena usar. Não é o suficiente para uma interface satisfazer o ego de seu criador: ela deve ser usada!