Opa, galera, tudo bom?
Nesta aula, eu vou falar de refinamento de layout,
trazendo dicas e ferramentas que vão te ajudar a aplicar esses conceitos.
Para mim,
a capacidade de refinar algo está diretamente ligada ao treino do olhar.
Assim como qualquer atividade prática, o desenvolvimento do olhar para o
designer é uma questão de criação de referencial, de repertório.
Ver tanta coisa boa e ruim sobre algo até que você naturalmente passa a ter domínio
sobre aquilo.
É aquele negócio que beira o feeling da percepção de feio e bonito: bater o olho
algo e identificar que precisa melhorar.
Inclusive, quando a gente fala disso,
a gente está diretamente falando do conceito de design visceral do Don Norman.
A experiência visceral é instintiva, imediata,
afetiva e acontece a nível biológico.
É o que nos faz gostar de coisas alinhadas e simétricas, transmissões gostosinhas,
gatinhos fofos e cores brilhantes, é subconsciente.
Da mesma forma, quando o usuário entra em contato com uma interface e se depara com
um mau design, ele vai se sentir incomodado e vai embora,
ainda que ele não consiga dizer o que está exatamente ruim.
Isso também vem do referencial, as diferentes vivências dele,
sua história, visão, cultura e sensibilidade interferem na forma como
ele percebe e experiencia um produto.
Com o profissional de design não é diferente.
Só construindo uma bagagem é que você vai treinar a sua capacidade de perceber e se
incomodar com detalhes que antes te passavam batido.
E o mais importante: conseguir propor uma solução diferente a partir disso,
que é o que te tira do feeling, o domínio da técnica e da teoria.
" Maelle, então o quê que eu faço?
Eu durmo até ser acordado pelo beijo da experiência?".
Não, querida!
Você tem que praticar, ler bastante,
seguir bons designer e botar os seus projetos na rua para receber feedback.
E é por isso que no vídeo de hoje, meninas, eu escolhi dar ferramentas para
que vocês possam desenvolver o seu olhar e criar essa bagagem tão necessária.
"E onde eu encontro boas referências de UI?".
Na internet, óbvio.
Nada mais coerente que estudar design digital em seu próprio suporte.
O Dribble, por exemplo, é a rede social primordial do designer de interfaces.
Diferente do Behance ou do Pinterest, onde você também encontra referências de
interface, a comunidade do Dribble é muito mais voltada a essa especialidade e,
por permitir que o designer disponibilize apenas uma screenshot do projeto,
o que a moçada acaba se focando muito mais é no resultado do que no processo.
Então, você entra lá e fica babando nas interfaces animadas do Pixel Perfect,
tudo lindo, tudo muito bem acabado.
O site pages ponto xyz é um outro bom repositório.
Ele faz uma espécie de curadoria de landing pages.
O site seleciona as melhores páginas de demonstração de produtos, preços,
apps e e-commerces e disponibiliza para consulta.
A mesma coisa é o site Really Good Mails, só que como o nome já diz,
ele é focado referências de e-mails.
Tem os newsletters, abandono de carrinho, boas vindas, tem de tudo.
E o melhor desses dois é que eles trazem páginas e e-mails já implementados,
disponibilizando inclusive o acesso ao link deles.
Isso é ótimo para que você produza coisas que realmente possam ser implementadas.
Ultimamente, a ferramenta que eu mais tenho usado para a coleta de referências é
o Muzli.
O diferencial dele é que a sua interação acontece de forma passiva.
Eu vou explicar: o Muzli é um plug-in para o Chrome que faz da sua
nova guia um feed de inspirações de design e tecnologia.
Ele pega conteúdos de sites, como os que eu citei e cria uma timeline.
Isso faz com que você esteja sempre consumindo bons conteúdos,
mesmo quando não está caçando referência.
E nas redes sociais mais populares você também pode seguir perfis que encham a sua
timeline de inspiração.
No Instagram, por exemplo, perfis como Winseui,
Users.co e o Myinterface fazem posts diários de referências de interface.
Além de procurar referências quando você precisa,
é importante também estar sempre em contato com bons serviços.
Seja curioso, baixe apps aleatórios só para testar, olhe as interfaces de apps,
como o Uber, Spotify, Twitter e Nubank, de forma crítica.
Tem algum motivo para eles serem considerados empresas referências de
design, certo?
Só usando é que você vai conseguir perceber que o sucesso de uma interface
vai muito além do design estático, opa, do layout estático.
Tem as transmissões, os feedbacks e uma série de outras coisas.
Para finalizar, a última dica que eu quero deixar aqui é: teste as suas interfaces.
Por mais que refinamento de layout não gere necessariamente uma
métrica quantitativa,
ele interfere sim na forma como o seu usuário interage com o seu produto.
No mercado, existem várias ferramentas de análise qualitativa que
podem te ajudar a entender melhor o comportamento do seu produto.
O Hotjar, por exemplo, gera vídeos de navegação, mapas de calor, clique,
movimento do mouse e permite a coleta de feedbacks escritos, entre outras coisas.
Você vai ver ali o seu usuário navegando e interagindo com o seu site.
Outro serviço que eu recomendo é a ferramenta de teste AB da Freshworks,
antes conhecida como Zarget.
Por ter editor visual, ela permite que o próprio designer crie variáveis do
teste AB, podendo testar desde mudanças grandes a coisas menores,
como qual cor de botão converte melhor?
Será que se eu jogar esse conteúdo aqui para baixo o meu usuário vai rolar até lá?
Coisas simples que você consegue implementar sem a necessidade de
deploy ou da interação de TI, gerando métricas qualitativas que vão
te ajudar inclusive a defender melhor as suas escolhas de design.
Bom, galera, eu falei bastante, o vídeo está acabando e de brinde eu vou deixar
aqui a indicação de um site chamado Resource Cards, que reúne uma lista de
recursos gratuitos com o propósito de ajudar criativos em seus projetos.
Tem desde bancos com imagens grátis para uso comercial a ícones,
fontes, mockups, pedaços de código HTML.
E, agora que você já têm referências,
ferramentas e recursos, eu quero ver você botar tudo em prática.
Sabe aqueles desafios de Pinktober que os designers de
interface sempre ficam de fora?
Pois é, a gente tem o Daily UI.
É muito legal.
Você acessa o site dele, cadastra o seu e-mail e durante
100 dias você vai receber um desafio de desenho de interface diferente.
Quer um spoiler?
O primeiro é um sign-up form.
Empolgante, não é?
Eu tenho certeza de que, ao chegar no 100º layout,
você vai olhar para o primeiro e falar: "Mano, como eu evoluí".
E no site Collect UI você confere os desafios já postados.
Só não vale colar.
É isso, gente.
Espero que vocês tenham gostado.
Eu vou deixar esses e outros links legais listados junto ao vídeo.
E não deixem de compartilhar e ajudar o Coursera a divulgar esse trabalho
tão legal.
Beijão!
Artur Vilas Boas
André Leme FleuryProfessor
