Princípios fundamentais para UI Designer

10 princípios de design de interface de usuários para te guiar em futuros projetos

ui-designOlá! Aqui é o Ed Francisco e eu estou aqui para falar para você UI Designer.

Você ficaria feliz em saber que os usuários utilizam a interface que você criou sem dificuldades? Que as soluções de interações que você projetou diminuiu a taxa de rejeição de uma aplicação, aumentou a taxa de retenção de usuários e consequentemente elevou o número de cadastros de seu cliente?

Algumas ações de UI podem refletir em melhorias nos resultados. Você já desenhou uma interface? O que você imagina durante esse processo?

Nós já tivemos a oportunidade de mostrar aqui no blog uma introdução sobre UI Design, porém acredito que necessitamos também mostrar como você pode, através de certos princípios decorrentes de valores compartilhados por vários UI Designers pelo mundo, de soluções bastante testadas e reconhecidamente destacadas como práticas comum, e também, humildemente, por experiências por mim vividas, pensar em soluções que garantam que você se torne um Designer de interface que efetivamente proporciona um ótima experiência de interação para os usuários.

Mas para você que chegou aqui neste artigo e mal sabe que um UI Designer faz. Então antes de adentrar nos princípios vou de forma sucinta explicar o que este profissional faz em seu dia a dia.

O que faz o UI Designer?

UI Designer

Um UI Designer tem como especialidade tratar da interação entre a interface e o usuário. Sendo que a interface é o meio pelo qual o usuário interage com a aplicação projetada.

Ao tratar da interação o UI Designer se preocupa em estruturar visualmente elementos na interface de forma que se anule quaisquer possíveis dificuldades e atenda as necessidades dos usuários. Hoje em dia uma das principais tarefas de um UI Designer é justamente interfaces web.

Existem alguns elementos comuns, quando se projeta uma interface web, pensando na interação com usuários são menus, botões, links, formulários e qualquer elemento na interface que deve direcionar o usuário a uma meta.

Talvez agora você deve estar confuso pois citei elementos que são manipulados também por Web Designers. Pois saiba que praticamente um Web Designer é um UI Designer só que especializado em aplicações Web. Aliás um Web Designer deve se preocupar com a interação usuário-interface sempre.

Então princípios que mostrarei aqui também se aplicam a Web Designer tanto que fiz questão de enfatizá-los também no meu curso de Web Design, o Web Designer Pro.

Quero que meus alunos entendam que a questão da interação usuário-interface é determinante para o sucesso dos futuros projetos web que eles assumirão.

10 princípios de UI Design para futuros UI Designers

Agora que você já sabe que um UI Designer faz chegou a hora de conhecer alguns princípios em uma seleção que eu separei para que você, atuando como UI Designer, fique mais antenado com boas práticas. Vamos a elas:

Utilize padrões familiares de UI

Ícone de Hambúrguer para menus

Padrões são soluções recorrentes para problemas comuns e por isso já foram implementados e testados. Você não precisa inventar soluções novas a todo momento.Basta adaptar uma solução aplicada em um ambiente similar para resolver o problema em sua interface.

Quando você utiliza padrões familiares de UI você faz que os usuários se sintam em casa, ganha tempo na criação e está próximo de estar correto em sua decisão.

E onde encontrar estes padrões?

Você encontrará nas interfaces onde o público-alvo do projeto passa a maior parte do seu tempo. Como em redes sociais, sites de notícias, sites de bancos, sites de universidades, aplicativos de mensagens instantânea, algum software específico, etc.

O ícone hambúrguer é um padrão que vem sendo bastante disseminado quando pensamos em mobile. Isso devido a limitação de espaço existente em interfaces destinadas a dispositivos menores que precisam suportar os tradicionais menus.

Mantenha a clareza

Useless button

Um excelente design de interface do usuário passa despercebido porque não possui elementos desnecessários. Se existe algum ruído que o usuário não entende para que serve é possível que ele não queira descobrir e isso resultará em um baixo engajamento para cumprimento das metas estabelecida para este elemento.

Deve-se então manter a clareza. Evite projetar elementos que não deixam claro sua função. Elementos necessários são sucintos e fazem sentido. Pergunte-se sempre se tal elemento é necessário, se o usuário precisa mesmo disso. Também verifique se ele é simples para o entendimento. Não adicione nada na interface porque apenas você achou legal.

Guie o usuário

guie o usuário

Não espere que o usuário descubra por si só o que fazer na interface. Você terá mais efetividade solicitando a ele o que executar e também continuar guiando-o nos passos seguintes. Saiba que provavelmente ele executará uma ação quando esta for solicitada.

Retorne com feedbacks

feedback

Enquanto você guia seus usuários você tem a possibilidade de deixá-los mais confiantes sobre o que eles estão fazendo e sobre a etapa que eles se encontram. Deixá-los confiantes é uma de suas atribuições como UI Designer.

Uma forma de deixá-los confiantes é fornecer feedbacks constantes e de forma clara. O sistema deve informar em real-time o que está acontecendo. Procure criar uma “conversa” entre os usuários e o sistema com notificações a cada ação que ele executar. Transmita a sensação que ele está no controle.

Permita-se tolerar erros de usuários

erros dos usuários

Mesmo guiando o usuário e transmitindo feedbacks, e por mais que o design projetado seja claro, erros podem acontecer, o usuário pode executar uma ação de forma inadequada. E é exatamente neste momento que seu design deve efetivamente ampará-lo tornando seus erros toleráveis e fazendo disto uma oportunidade de crescimento ao mostra-lhe o caminho da correta execução. E o que considerar nesta abordagem?

  • Desenvolva maneiras de o usuário desfazer ações;
  • Por favor senhor futuro Designer de interface. Não puna o usuário caso ele tenha que retomar uma ação fazendo que ele recomece do zero depois de executar muitas etapas, por exemplo; só porque ele preencheu um campo de formulário de forma errada;
  • Assegure o aprendizado mostrando as ações erradas e garantindo que ele possa saber como evitar que o erro ocorra novamente.

Fale a língua do usuário

fale a língua do usuário

Como Designer você tem tudo para utilizar os conceitos de forma adequada afinal cada forma, cada pixel, cada tipo e cada cor importar muito. Entretanto o mínimo de copywriting será necessário para que a interface “converse” com o usuário, seja por forma de som, vídeo, animação e mais geralmente usando textos. E neste mínimo deve-se garantir o máximo de empatia falando a língua do usuário.

Falar a língua do usuário é garantir que ele se identifique com a mensagem transmitida facilitando o entendimento das “conversas” com a interface. Pesquise bastante sobre o público-alvo para estabelecer a maneira mais apropriada de orientar as ações.

Você pode conversar com o usuário de forma visual, com elementos como ícones, imagens e vídeos, sempre levando em conta o público-alvo do projeto.

Mantenha a consistência

consistência

Quanto se trata de design de interface de usuário falar de consistência é garantir que quando o usuário aprende a fazer algo na interface ele pode fazê-lo novamente sem surpresas.

Você, como UI Designer, pode garantir a consistência repetindo elementos e comportamentos da interface. Com isso usuários reduziram a necessidade de repensar o passa a passo para as ações e terão maior consciência de como as coisas funcionam.

Ofereça flexibilização das tarefas

flexibilização das tarefas

Faça com que as tarefas a serem executadas pelos usuários não sejam penosas. Facilite o manuseio. Quando, por exemplo, temos que preencher um formulário de cadastro a tarefa se torna mais árdua quando ele é extenso. Entretanto você, Designer de interface, pode, através da interface, passar a ideia que preencher este formulário pode ser mais agradável e ágil.

Entenda que as pessoas preferem cumprir várias etapas menores do que uma enorme. Ao projetar um formulário que possa ser preenchido em etapas menores você diminui a sensação de algo rígido e complexo de ser executado e flexibiliza a tarefa.

Use a hierarquia visual

hierarquia visual

É importante que o usuário se concentre no que é importante e uma forma de garantir isso é trabalhar adequadamente com a hierarquia visual.

Você pode estabelecer um caminho claro para as ações determinando através de formas, cores, tipos, contraste entre elementos, entre outras aplicações de Design que mostrem o que é prioritário na interface. O posicionamento de elementos de forma apropriada garantirá que o usuário perceba a informações mais importantes e indicará as possíveis decisões que o usuário deve escolher.

Estude sobre o usuário

Você pode ficar tentado a olhar para concorrência para imitar estilos e recursos modernos que ainda não são garantias de boas práticas. Então nessa hora atente-se primeiro as necessidades dos seus usuários para identificar os reais objetivos do projeto. Acredito que este é o princípio primordial entre os 10 apresentados.

Faça uma imersão no mundo do usuário para descobrir suas habilidades, experiências e anseios. Pesquise sobre as interfaces que eles se sentem a vontade, descubra como eles as usam, como se comportam diante delas.

Quando você foca no usuário as chances de você construir uma interface amigável crescem exponencialmente.

Conclusão

Os princípios citados neste artigo te ajudarão a conseguir ótimos resultados. Logicamente que não são regras rígidas, entretanto você tem que saber bem exatamente o que está fazendo para tentar fazer algo no sentido contrário. Senão isso pode resultar em usuários insatisfeitos abandonando seu cliente sem dar satisfação, deixando-o também insatisfeito.

O Design centrado no usuário exige sensibilidade apurada para que as decisões favoreçam a ótima intermediação entre a interface gráfica e a pessoa, que é a parte mais importante e para qual a interface foi projetada.

E o que mais você gostaria de considerar como princípio importante para um futuro UI Designer conhecer? Deixe sua opinião lá nos comentários. Aproveita também e compartilha este artigo com seus amigos.

Até mais!

Abraços!

Referências

https://99designs.com.br/blog/tips/7-unbreakable-laws-of-user-interface-design/

https://www.caelum.com.br/apostila-ux-usabilidade-mobile-web/principios/

https://www.chiefofdesign.com.br/ui-design/

Imagens

https://dribbble.com/shots/929894-Hamburger-Icon

https://play.google.com/store/apps/details?id=com.uselessbutton&hl=pt_BR

https://www.logicearth.com/blog/ux-design-for-elearning-10-tips

Ed Francisco

Olá! Aqui é Ed Francisco, colaborador do Chief of Design. Sou Paulistano. Me aventuro tentando desvendar os mistérios da web desde 2008.