Um bom design exige uma arquitetura de informação limpa e visuais agradáveis, mas isso é apenas a ponta do iceberg. Para criar algo que traga resultados, você precisa se aprofundar e aprender sobre seus usuários.
É claro que não existem dois públicos-alvo iguais. Felizmente, existem alguns princípios psicológicos que podem ser usados como regra geral. Neste artigo, veremos algumas das regras mais úteis para web designers. Para entender melhor como aplicá-los em seu trabalho diário, também veremos alguns exemplos da vida real. Vamos mergulhar!
Lei de Jakob
Esse princípio levanta a questão: por que reinventar a roda? Existem muitas soluções de design comprovadas e testadas que você pode seguir. Muitas vezes, o ótimo é inimigo do bom. Você pode chegar a uma solução perfeitamente polida e perceber que seus usuários ainda preferem a versão antiga. Quando você tenta ser excessivamente inovador, pode acabar sendo mal compreendido.
O nome Jakob's Law vem de Jakob Nielsen, do Nielsen Norman Group , um aclamado instituto de pesquisa de UX. A própria lei é simples. Afirma que as pessoas passam a maior parte do tempo em outros sites e, portanto, já estão acostumadas com determinados padrões de design. Ao seguir esses padrões de design em sua página de destino, a experiência será mais familiar e intuitiva.
É fácil ver quando você olha para vários exemplos:
Esses exemplos vêm de líderes de mercado - e eles têm muito em comum:
A navegação: Nas versões desktop, o logotipo da empresa está no canto superior esquerdo, seguido pela barra de navegação. O canto superior direito é o local para os botões de login e inscrição, às vezes acompanhados da barra de pesquisa - ou seja, uma ferramenta para saber mais sobre o produto. Além do mais, todas as versões móveis apresentam um menu de hambúrguer. Essas três (ou mesmo duas) linhas horizontais são amplamente compreendidas pela grande maioria dos usuários. Novamente, não há necessidade de reinventar a roda.
O layout do conteúdo textual e das imagens: os layouts dessas páginas de destino ecoam a direção de leitura da esquerda para a direita dos idiomas latinos. Isso torna a estrutura mais intuitiva. O texto está na primeira coluna e também está alinhado à esquerda. A imagem ou vídeo principal está sempre à direita (ou abaixo do texto em dispositivos móveis).
Os modelos mentais: a Lei de Jakob alavanca os modelos mentais existentes do usuário. Em termos leigos, isso significa que o usuário já tem uma representação da experiência em sua mente. Eles esperam que certas funções sejam encontradas em certos lugares e funcionem de uma maneira específica. Quando se trata de páginas de destino, as pessoas tendem a digitalizá-las de acordo com o padrão Z :
As páginas que usamos como exemplos seguem esse design de perto. O logotipo e o botão de login permanecem no mesmo lugar, mas a estratégia mudou ligeiramente para o CTA principal. Em vez de colocar o CTA no quarto ponto focal, os designers se limitaram à quantidade mínima de informações e colocaram o botão de inscrição no terceiro ponto do padrão Z.
Essa descoberta nos leva a outro princípio:
Princípio de menor esforço
Não processamos mais informações do que o necessário, mas não é porque somos preguiçosos. Nós apenas temos muito o que fazer. Você sabia que processamos cerca de 100.000 palavras todos os dias ? É o equivalente a um romance de médio porte, como O Hobbit ou Harry Potter e o Prisioneiro de Azkaban.
Lembre-se de que cada Landing Page contribui para a sobrecarga de informações. Veja como você pode usar o princípio do mínimo esforço em seus esforços de design da web :
Encurte a experiência: analise a jornada do usuário e encontre os pontos mais fracos. Veja onde seus visitantes desistem. Isso pode significar que essa parte da experiência causa atrito e desencoraja o usuário de prosseguir. A solução? Você pode redesenhar a jornada, torná-la mais curta e remover possíveis pontos de frustração.
Use uma linguagem simples: não se trata apenas de design visual - trata-se também de conteúdo escrito. Quando seu público tem que ler o jargão da indústria e parágrafos complexos, isso adiciona tarefas extras à sua carga cognitiva. Use frases curtas e vocabulário simples para criar uma experiência melhor para seus usuários. Isso é particularmente importante em páginas de destino, onde o espaço para o texto é limitado e você precisa acertar todos os acordes certos com as palavras certas.
Agrupe itens em categorias: uma página de destino serve a um determinado propósito. Você não precisa acertar o usuário com todos os detalhes no início. Quando você tem uma oferta de produto para mostrar, pode agrupar diferentes recursos em três ou quatro categorias. É o suficiente se o usuário tiver uma ideia geral que seja fácil de processar e lembrar. Nesta fase, seu objetivo principal é fazer com que o usuário responda ao CTA. É aqui que entra outro princípio psicológico:
Lei de Hick
Quando se trata de opções, quanto mais, melhor?
Provavelmente funcionaria assim se nossas decisões fossem puramente racionais. A Lei de Hick afirma: quanto mais opções temos, mais tempo leva para tomar a decisão final. Isso se tornou a base para a sigla KISS. Não importa se você escolhe interpretá-lo como Keep it Short and Sweet ou Keep it Simple, Stupid , a ideia permanece a mesma.
Um fenômeno semelhante foi descrito por Barry Schwartz em seu livro The Paradox of Choice . O autor vai um passo além e afirma que limitar a escolha pode reduzir a ansiedade do usuário. Escolher entre uma variedade de opções oferece certa liberdade, mas também é uma responsabilidade. Quando não estamos felizes com a decisão final, colocamos a culpa em nós mesmos.
O takeaway? Quando tomamos certas decisões por nossos usuários, podemos estar fazendo um grande favor a eles. Veja como projetar com a Lei de Hick e o Paradoxo da Escolha em mente:
Concentre-se em um único objetivo: por que apenas um? Quase metade de todas as páginas de destino tem mais de uma oferta, embora incluir mais de uma opção possa diminuir as taxas de conversão em até 266%. Em vez de tentar inserir o máximo de informações possível, crie mais páginas de destino projetadas para um único propósito. Essa abordagem traz muitos resultados positivos, incluindo um aumento significativo de SEO. De acordo com o Hubspot , passar de 10 para 15 páginas de destino dedicadas provavelmente resultará em um aumento de 55% nos leads.
Experimente a divulgação progressiva: é mais fácil falar do que fazer, certo? Sabemos que algumas informações não podem ser totalmente omitidas. Felizmente, há uma solução alternativa para isso. A divulgação progressiva sequencia as informações em várias telas. Para manter suas páginas de destino limpas e simples, você pode incluir as categorias principais ou os detalhes essenciais na página de destino e, em seguida, orientar os usuários para obter mais informações. Se você precisa de inspiração para web design , aqui está uma ideia do LiveAgent , uma plataforma de suporte ao cliente:
Cada recurso é descrito com apenas uma frase. O usuário pode ir para outra página de destino dedicada para aprender mais sobre uma opção específica.
Figura / chão
No contexto das Landing Pages, a lei da "figura / fundo" é particularmente comum. Esse fenômeno é normalmente ilustrado com esta imagem popular:
Você pode ver dois perfis de rosto ou um vaso. O mesmo elemento pode ser percebido como figura ou como fundo. Este é um exemplo clássico de relação reversível entre a figura e o fundo. Dependendo do contexto, a mesma parte da imagem pode servir para os dois.
A lei da figura / fundo é um dos Princípios da Gestalt , uma mina de ouro de informações (e inspiração) para web designers. Essas leis foram criadas por psicólogos do grupo Gestalt. Eles estudaram como as pessoas dão sentido aos estímulos ao seu redor e como percebem e interpretam objetos para dar sentido a toda a imagem.
Kurt Koffka, um dos membros do grupo, apresentou um breve manifesto. Ele afirmou que “o todo é outro do que a soma das partes”. Esta frase é perfeitamente universal e funciona muito bem como uma referência para web designers. Isso nos mostra que não importa quanto tempo você gasta trabalhando em um elemento específico, não vai te levar muito longe se não for uma parte estratégica de um quadro mais amplo. Cada elemento que você projeta é percebido de maneira diferente quando faz parte de um conjunto maior de elementos.
No design de Landing Pages, você terá como objetivo uma relação estável entre a figura e o fundo. A figura deve se destacar. Isso pode ser alcançado por meio de contraste e cor. Dê uma olhada neste ótimo exemplo do HelpDesk :
O objetivo desta Landing é cristalino. Eles querem que o usuário se inscreva no serviço e tornam isso mais fácil para eles. O CTA principal é um botão laranja brilhante que está em contraste direto com o fundo, destacando-se com um matiz distinto.
Você também pode brincar com o tamanho dos elementos. Por exemplo, o InVision tornou o botão “Começar” significativamente maior do que outros componentes do site:
Princípio de Pareto
Todo processo de web design precisa de prioridades, especialmente quando seus recursos são limitados.
O princípio de Pareto pode ajudá-lo a definir sua estratégia de projeto. De acordo com essa abordagem, 20% dos esforços causam 80% dos resultados. Com isso em mente, você pode afirmar que 20% do seu projeto é responsável por 80% do sucesso.
Vamos examinar os dados mais de perto. Se você estiver usando um software de mapa de calor em seu site, provavelmente já percebeu que apenas uma pequena fração de todos os usuários rola até o final. Uma pesquisa de 2018 sugere que os usuários gastam 57% de seu tempo em um site acima da primeira dobra . 74% do tempo é dedicado às duas primeiras dobras. É aqui que você deve concentrar a maior parte de seus esforços.
É claro que não precisa funcionar exatamente da mesma maneira para todas as páginas de destino. Recomendamos que você teste novas soluções ou use um software de gravação de sessão e observe a interação dos usuários com o site.
Aqui estão algumas idéias sobre como usar o princípio de Pareto no design:
Sugerir opções: você nem sempre precisa exibir toda a lista alfabética por padrão. Em vez disso, você pode tornar as coisas mais fáceis para o usuário e mover as opções mais prováveis para o topo.
Priorize recursos: analise as solicitações mais comuns e os recursos mais usados em seu site. Isso o ajudará a construir páginas de destino com maior probabilidade de atender às necessidades do usuário. Se você estiver recebendo muitas perguntas sobre um determinado recurso, ou se um serviço específico gerar a maior parte do seu tráfego, é um sinal claro de que ele merece mais atenção.
Decida o que acontece primeiro no celular: Whimsical é um ótimo exemplo aqui. Esta ferramenta de colaboração foi projetada para usuários de desktop. Esta é a aparência de sua página de destino para desktop:
Como você pode ver, a navegação no canto superior direito é muito parecida com as outras páginas de destino que abordamos. As coisas parecem um pouco diferentes quando você vê a versão móvel:
Veja o que aconteceu? Os botões “entrar” e “inscrever-se” sumiram. Quando você procura por Whimsical no celular, não está pronto para começar a usar o aplicativo. Você provavelmente está apenas olhando ao redor para ver o que faz e quanto custa. É por isso que o botão “preços” está destacado, em vez de inscrever-se ou um menu de hambúrguer. Tudo depende de suas descobertas ao analisar o comportamento do usuário.
Prova social
Agora que discutimos uma série de princípios provenientes da ciência cognitiva, é hora de nos voltarmos para a psicologia social. Você deve ter ouvido falar de Influence: The Psychology of Persuasion , um livro clássico do Dr. Robert Cialdini . Embora este título tenha várias décadas, ainda é uma grande fonte de conhecimento sobre os principais mecanismos de persuasão.
Um dos fenômenos mais conhecidos descritos por Cialdini é a prova social. Descreve como as pessoas tendem a pensar que vale a pena seguir as ações realizadas por outras pessoas. Em outras palavras, é mais provável que façamos algo quando vemos outras pessoas fazendo isso. Além do mais, a prova social funciona melhor quando vemos outras pessoas como competentes. Este princípio é comumente usado em páginas de destino, até mesmo por gigantes da indústria, como Ahrefs :
A página principal está repleta de análises delirantes de influenciadores da indústria de SEO, como Brian Dean da Backlinko. Eles também estão usando um truque popular de adicionar logotipos de empresas que usam Ahrefs. Outra maneira interessante de usar a prova social é por meio de conteúdo gerado pelo usuário. Daniel Wellington , marca relojoeira, é uma das líderes nesta categoria. Eles usam fotos de pessoas reais usando seus produtos em seus sites. Isso gera confiança e faz com que seus clientes se sintam parte de uma comunidade:
Bônus: uma lista de leitura Quer se aprofundar na psicologia do design? Aqui estão alguns livros que o inspirarão: Design Emocional por Don Norman 100 coisas que todo designer precisa saber sobre pessoas por Susan Weinschenk Hooked: Como construir produtos formadores de hábitos por Nir Eyal Design de como as pessoas pensam, de John Whalen