Os sites da Web são criados para executar uma função e se comunicar com seus usuários. Mas além disso, os sites também podem ser envolventes, empolgantes e até mesmo divertidos de usar.

Adicionar interesse visual a um site ajuda a manter nosso compromisso com ele, seja por tipografia, gráficos ou fotografia. Mas acredito que há também o potencial de elementos de interação para fornecer estimulação visual e feedback, até mesmo encantar o usuário. Neste artigo, argumentarei que adicionar alguns efeitos para divertir, surpreender e estimular seus usuários pode tornar seus websites e aplicativos melhores e manter os usuários retornando.

Deleite

O design do site é muitas vezes um tópico seco, carregado com o jargão UX e as jornadas do usuário da Arquitetura da Informação. Mas por que não deveria haver alguma diversão ao longo do caminho? Adicionar prazer a um site é uma ótima maneira de tornar um site não apenas mais humano, mas também tornar seu site único.

Eu vou diminuir minha definição de prazer aqui dizendo que é a adição de funcionalidade não requerida .

Com isto quero dizer que não é uma parte essencial da função do site. No entanto, isso pode ter um efeito poderoso na maneira como o site é percebido e experimentado. Na verdade, eu diria que o modo como você lida com os elementos estritamente desnecessários da interface do usuário é tão importante quanto a tipografia e outros elementos visuais, ao definir o tom de um site.

Uma interação livre

Em um artigo para o Cooper Journal, Chris Noessel chama de "Uma interação livre" um padrão de design "que dá ao software uma sensação mais humana".

Parte disso é o reconhecimento de que os seres humanos são criaturas inquietas, muitas vezes propensas a repetir pequenas ações. Tradicionalmente, com caneta e papel, rabiscávamos ou retraívamos continuamente as canetas. Eu sou um spinner spinner inveterado por exemplo.

As pessoas muitas vezes carregam essa inquietação na navegação na web, muitas vezes rolando para cima e para baixo, selecionando pedaços de texto ou repetindo ações.

O padrão One Free Interaction engloba essa necessidade humana inata de mexer, criando elementos interativos que dão resultados inesperados ou agradáveis. Precisa de um exemplo? Tente passar o cursor sobre o logotipo do Web Designer Depot 'W' no topo desta página.

Como Noessel diz, as interações livres ficam fora do desempenho da tarefa e, em vez disso, ficam nos espaços intermediários. Mas eles são poderosos em moldar nossa resposta emocional aos sites que usamos.

Efeitos de rolagem

Como dito anteriormente, uma das "fidgets" mais comuns é a rolagem para cima e para baixo, de modo que os sites que adicionam interesse visual ao rolar são geralmente deliciosos.

O site de uma página para o Nizo O aplicativo de fotografia da Image Mechanics possui componentes de câmera 'Knolled' que se movem enquanto você rola para baixo e para fora enquanto rola para baixo. Se você é como eu, você passará bastante tempo apenas rolando para cima e para baixo, tocando com a linda interface. (Não prenda a respiração esperando que o aplicativo seja lançado embora.)

nizo_01

Usar efeitos de paralaxe na rolagem também adiciona prazer, criando a ilusão de profundidade. eu amo o menino-coy website, onde os efeitos de rolagem combinam perfeitamente com o estilo visual e visual do site.

boycoy_01

Estou surpreso que não existam mais sites com efeitos de rolagem horizontal, já que a rolagem lateral é um tema tão comum no design de jogos. Mas um bom exemplo é o Nintendo Mario Kart site que analisa a história do jogo ao longo de 20 anos de consolas da Nintendo.

mariokart_01

O site polonês Misture adiciona camadas de elementos gráficos que fazem a transição à medida que você rola, uma maneira high-tech de obter uma sensação de um sketchbook de baixa qualidade.

mashup_01

O rei dos sites de efeitos de rolagem é provavelmente Acko . Aqui, o elemento de cabeçalho do site é um objeto de grafite 3D animado. É o logo animado levado para o próximo nível - imersivo, interativo, divertido. Há até conquistas para "desbloquear" na interface do usuário - embora a gamificação seja um assunto completamente diferente.

acko_01

Design para emoção

Adicionar prazer ao seu site ajuda a criar uma conexão emocional com um usuário. O poder da emoção no design é algo que estamos apenas começando a entender, mas isso ajuda a explicar por que gostamos de usar certos objetos e ter uma conexão tão poderosa com eles. Aplica-se ao design físico do produto, bem como ao design interativo.

Eu acho que uma razão forte pela qual os produtos da Apple são tão respeitados é que os usuários se tornam emocionalmente ligados a eles, e há muitos exemplos de prazer no hardware e no software da Apple. Eu sei que muitas pessoas adoram a 'borracha-banda' rolando no Safari móvel do iOS tanto que eles irão distraidamente fazer o ping para cima e para baixo.

OK por 'muitas pessoas' eu quero dizer, mas Steve Jobs adorou patentear, e formou parte do litígio da Apple contra a Samsung.

Aaron Walter, em seu livro Projetando para a emoção, analisa o modo como os sites de sucesso envolvem as emoções dos usuários, impregnando-os de personalidade. Adicionar elementos que encantam o usuário é uma maneira muito poderosa de fazer isso. Simplificando, nós preferimos ferramentas que nos encantem, por isso é bom para os negócios também.

Delícia não é um truque

Adicionar prazer não significa adicionar efeitos intencionais como um truque. Os efeitos estão lá para ajudar a moldar a personalidade do site. Eles não têm que ser brincalhões ou peculiares (embora possam ser, se essa é a personalidade que você quer transmitir), eles podem ser sutis e contidos se se adequarem melhor ao personagem. Dê uma olhada pictet.com. Eu adoro a maneira como a barra de pesquisa aparece quando você clica no link de pesquisa - ela impede que o campo de texto de pesquisa seja um elemento dominante, até que você peça que seja. É sutil e elegante, e combina com o tom do site - uma empresa de serviços financeiros suíça - perfeitamente.

pictet_01

Às vezes os efeitos são tão sutis que você nem percebe. Você sabia, por exemplo, que o controle de volume no IPlayer da BBC vai até 11? É um pequeno aceno para a Spinal Tap.

Não exagere

Adicionar muitas interações inesperadas pode ser contraproducente, criando um excesso visual. A menos que você esteja tentando criar um ambiente parecido com um jogo hipercinético, muitos efeitos visuais, com invertidos, pop-ups, whizzbangs e bombas estranhas por todo lado, prejudicam seriamente qualquer engajamento significativo com o conteúdo. Dê uma olhada no LEDbow site por exemplo. Tecnicamente é brilhante, mas não creio que comunique de forma eficaz. Há muita coisa acontecendo.

ledbow_01

Ligue para o prazer

Eu amo sites que tratam a tela como um visor ou uma superfície, em vez de um visualizador de página. Camadas movendo-se em diferentes velocidades criam profundidade e interesse. Elementos se movendo para a posição chamam a atenção para eles.

O movimento torna a experiência mais imersiva, mas esteja ciente de que esse tipo de interatividade, por si só, não equivale a um engajamento maior.

A adição de prazer torna os sites mais humanos e também mais táteis, envolvendo nossa necessidade de cérebro de macaco para mexer e brincar enquanto pensamos e aprendemos. Na próxima vez que você criar um site, pense em como criar algo exclusivo para encantar seus usuários.

Você projeta para emoção? Como você adiciona prazer a um site? Deixe-nos saber nos comentários.