Quando se trata de projetar um website verdadeiramente intuitivo, responsivo e coerente que também é único e interessante, muitas vezes parece difícil conciliar os dois conjuntos de prioridades. Mas, na verdade, nada está mais longe da verdade: existem apenas algumas idéias fundamentais que precisam ser empregadas para facilmente fazer as melhores escolhas em seus projetos.

O mais essencial desses conceitos é que designs bonitos e fáceis de usar não são difíceis de fazer quando o UX é dado prioridade, e o design é adaptado para se adequar a ele. Afinal, a natureza da experiência do usuário determina que existem certas regras inflexíveis, enquanto o design é quase infinitamente flexível. Uma vez que você aprende as maneiras e meios pelos quais você deve adaptar seus projetos, você deve estar bem no seu caminho para transformar uma batalha em um tratado de paz.

Antecipar erro do usuário; diminuir a irritação do usuário

Sempre considere o que poderia acontecer se o usuário se perdesse em sua página da Web. Mensagens de erro não deve ser obscurecido no jargão técnico, mas deve dar uma explicação sobre qual pode ser o problema e, se for o caso, onde eles devem procurar ajuda. Equilibre estas considerações com o que pode ser melhorado no seu fim. Não importa o quão bonito um site seja, se demorar muito para carregar, não vale a pena o esforço. Especialistas dizem que se uma página levar mais de 3 segundos para ser carregada, ela precisa ser simplificada.

Mantenha os formulários tão curtos e não intimidantes quanto possível; se a informação não for necessária, não peça. Se você ainda não o fez, considere oferecer um login opcional através do Facebook ou Twitter; Os sites que oferecem isso geralmente consideram suas taxas de conversão aumentadas porque o usuário acha isso mais conveniente e, portanto, é mais provável que ele reserve um tempo para se inscrever. Além disso, certifique-se de que o restante do seu site tenha uma presença integrada na mídia social, que não conflite ou domine seu design, mas que também seja facilmente identificável, como o Trabalhe no Play local na rede Internet. Pequenas adições como essa são o que se soma a uma simplificação cumulativa da experiência do usuário.

Para este fim, é importante ter em mente alguns padrões que devem permanecer bastante consistentes em qualquer tipo de site.

Manter padrões da web

Alguns elementos comuns de um site, como links de rodapé ou uma barra de pesquisa, podem sofrer ativamente de criatividade excessiva. Embora haja espaço para a originalidade em muitos desses elementos, é importante mantê-los mais ou menos da mesma forma que você vê em todos os outros sites, porque eles são onipresentes o suficiente para os usuários esperarem que eles sejam apresentados de uma determinada maneira. . Siga estas diretrizes:

  • Certifique-se de que as áreas clicáveis ​​sejam imediatamente identificáveis ​​(como os links esse site ) e são grandes o suficiente para serem ativados facilmente;
  • Divida blocos de texto com imagens e outros estímulos visuais;
  • Usar pão ralado quando aplicável;
  • Tente evitar espalhar o mesmo artigo ou pesquisa de produto em várias páginas;
  • Faça informações de contato, perguntas frequentes, uma barra de pesquisa e outros recursos padrão fáceis de encontrar e usar.

Apesar Grip Limited website é atraente e emocionante, também é incrível confuso. Embora exista uma explicação sobre como arrastar as colunas para revelar o conteúdo, ele é perdido na confusão de outra tipografia. Um menu tradicional é acessível, mas apenas se você espiar o minúsculo menu suspenso. É um design de site tão bacana que alguns usuários não se importariam com o quão difícil é usar, mas muitos outros seriam desconsiderados. Mas se o site incorporasse as sugestões acima em seu design, ele ainda poderia manter seu fator legal e fornecer uma boa experiência de usuário.

Por exemplo, embora o Soda Comic outros elementos de design do site são bastante perturbadores, o usuário ainda é facilmente capaz de encontrar a barra de pesquisa; é a rotulagem e a posição é clara o suficiente para que a confusão seja minimizada. Essas pequenas submissões à confusão do usuário são o que faz toda a diferença.

Onde traçar a linha

Existem outras regras de UX que podem ser dobradas, mas não quebradas. Mas em que ponto um designer vai longe demais? Os elementos de navegação são um bom exemplo para trabalhar, porque cada site tem alguma forma deles. Convencionalmente, eles são organizados de duas maneiras:

  • Horizontalmente ao longo do topo da página; isso permite uma aparência espaçosa para listas curtas;
  • Verticalmente ao longo do lado esquerdo de uma página; Esse arranjo pode acomodar listas mais longas.

Mas existem outros estilos e sistemas de navegação que podem funcionar se usados ​​com cuidado e atenção. Por exemplo, este site do portfólio tem uma lista de navegação que ocupa a maior parte da página e cada palavra é parcialmente obscurecida. Além disso, os elementos não permanecem estacionários; eles caem e se separam para exibir o conteúdo dentro de cada seção. Todos esses floreios podem ter se combinado para formar um sistema confuso que frustraria rapidamente o usuário. No entanto, o design evita ser problemático em virtude de ser tão simples; as palavras ainda são legíveis; os drop-downs têm uma quantidade tão pequena de informação que o resto da lista de navegação não corre o risco de ser perdido. Tudo somado, é um sistema ousadamente diferente que evita ser problemático.

Do outro lado da linha é um conceito que tem sido referido como navegação de carne de mistério, em que as considerações estéticas do design superam completamente a usabilidade. No caso do Site da FlatPak, a navegação tem que ser rolada para ler o que está se referindo; um recurso de usabilidade terrível que nunca deve ser emulado.

Familiaridade versus funcionalidade

De muitas maneiras, a verdadeira batalha do design da web atual parece ser entre novas idéias novas que contribuem para uma interação menos intuitiva e práticas antigas e indigestas que podem não ser a melhor solução, mas são o que os usuários estão acostumados. Um exemplo desse problema geralmente surge quando você considera o design skeuomorphic; que é um estilo que imita o predecessor de um item que foi feito em outro meio.

Esse tipo de design acontece o tempo todo na Web, desde a calculadora da área de trabalho, que parece e funciona como sua contraparte da vida real, até os botões de um site que têm um efeito realístico de sombreamento e chanfro. Faz sentido até certo ponto, porque a familiaridade desses projetos faz com que os usuários se sintam imediatamente à vontade para usá-los. No entanto, eles não são necessariamente a melhor solução porque são incrivelmente limitantes.

O conflito entre essas duas prioridades pode ser ilustrado pela tecnologia realista de "virada de página" da Apple, que é usada para leitura digital. É uma ideia atraente porque faz com que a experiência pareça um pouco mais como transformar páginas físicas em papel, algo que os usuários podem achar confortavelmente familiar. No entanto, apesar do comprimentos ridículos a empresa foi para, a fim de criar esse efeito, diminui a experiência do usuário. Demora um pouco mais para carregar, e folhear a página é um movimento mais difícil de executar que um simples empurrão; um movimento pesado pode enviar o usuário para o lado errado.

Use um funil de conversão claro

Se você estiver trabalhando em um site complexo com muitos caminhos de navegação, é muito importante permitir que o usuário se mova logicamente pelo site e os mantenha informados sobre onde eles estão no mapa do site como um todo. É aqui que os breadcrumbs e outros dispositivos de navegação são úteis. Os temidos links padrão roxos não precisam ser empregados para mostrar a um usuário que eles já visitaram; Há muitas outras soluções mais atraentes que produzem o mesmo efeito.

Os sites de comércio eletrônico costumam ser os mais prejudicados por causa de seus funis de conversão mal concebidos, mas há muitos exemplos excelentes de lojas da Web otimizadas para UX com um belo design. Tomemos por exemplo o Fruta do Tear site, que tem uma interface limpa e amigável que ainda é logicamente construída. Não é nem mesmo o resultado de um desenvolvimento de backend customizado e complicado; o site foi criado usando simples Software de comércio eletrônico da Amazon, que qualquer pequena empresa seria capaz de aproveitar.

Acomode a digitalização e adicione interesse visual

Tenha em mente que as pessoas lêem páginas da Web de uma maneira diferente da mídia impressa. Estudos de rastreamento ocular mostre que os usuários da Web vasculham a página inteira (concentrando-se primeiro no conteúdo no canto superior esquerdo), procurando elementos atraentes como títulos, citações ou imagens. Então eles se aprofundam em seções que parecem interessantes. É crucial projetar esse tipo de mentalidade, e certifique-se de empregar uma hierarquia visual que direcione o usuário para onde você quer que ele vá.

o Prosperar o blog do Solo tem muito conteúdo, mas mantém uma aparência interessante e espaçosa, usando muito espaço em branco, imagens grandes, ícones e tipos de letra variados. Os títulos grandes e centralizados são especialmente úteis para escanear os espectadores.

A linha de fundo

Enquanto a estética de um site cria uma primeira impressão, a funcionalidade é o que dá ao usuário uma experiência duradoura que, esperamos, desejará retornar. Não há situações em que considerações de design e funcionalidade não possam ser reconciliadas; Na verdade, é a interação entre essas duas prioridades que acaba criando os melhores e mais memoráveis ​​sites da web.

Você já comprometeu a usabilidade pela estética? O design pode ser bom sem usabilidade? Deixe-nos saber seus pensamentos nos comentários.

Imagem em destaque / miniatura, imagem funcional via Shutterstock.