micro-interacções em páginas web.

micro-interacções.

As micro-interacções, apesar de não fundamentais na construção de um website, são um factor claramente diferenciador, dotam o website proprietário de bastante personalidade e, acima de tudo, permitem o utilizador interagir com o website, aumentando o interesse pelo conteúdo e diminuindo a percentagem de bounce.

a intenção.

Como falado acima, o objectivo principal é dar alguma tridimensionalidade ao website, permitindo que este seja mais do que apenas imagens e texto num ecrã. Passa a existir alguma “jogabilidade” por parte do utilizador (por exemplo, caso o ponteiro do rato, ao passar, pinte o fundo de outra cor, o “jogo” passa a ser tornar todo o fundo da nova cor) e um sentimento de descoberta (“se aqui a página faz isto, o que fará nas outras? Deixa-me fazer scroll!”).

Neste artigo demonstramos dois exemplos em que implementamos estas micro-interacções.

Um deles é este mesmo site, o nosso da antisocial. Estando nós a trabalhar com uma paleta unicamente constituída por branco e preto, é importante escolher a forma ideal de destaque. No caso do nosso site optamos por criar uma transição para os nossos projectos onde estes ganham cor e tamanho com o passar do rato.
Num mundo onde o preto, branco e cinzento são ordem, estes pequenos apontamentos de cor, durante um scroll, poderão ser o suficiente para captar a atenção do visitante e, então, conhecer mais a fundo os nosso projectos. Também permite que cada projecto, apesar de estar inserido em grelha com os restantes, ganhe um especial destaque quando assim necessário.

Outro exemplo é o site da October.Gallery. Tratando-se de um website sobre obras de artes e tendo-se reproduzir o efeito de um museu (paredes brancas, peças isoladas e pequenos pedaços de informação sobre cada peça), o hover do rato é que permite ver a informação sobre a peça e o autor da mesma, numa localização semelhante à que se poderia encontrar num museu.

e agora?

Nos dois exemplos dados as micro-interacções são, sem dúvida, micro, mas acreditamos que são o factor diferenciador dos dois sites. Complementam a estética apresentada e, acima de tudo, incitam à exploração falada acima (a explosão de cor nos projectos da antisocial – “Qual será a cor deste outro que está ao lado?” – e o aparecer dos nomes na October.Gallery – “Que nome curioso! Este como é que se chama?”).

o nosso papel é transformar marcas através de uma comunicação coerente, relevante e direcionada.

vamos trabalhar juntos