You are on page 1of 103

UX DESIGN

WORKSHOP
Suzi Sarmento • UI/UX Designer •
Trabalha com visual design e experiência do
usuário há mais de 6 anos.

Já passou pelas áreas de publicidade, portal de


notícias, e-commerce, e agora faz parte do time
de UX da startup Youse.
E me conta de você:

● Qual o seu nome?

● O que faz da vida?

● E qual é o seu aplicativo favorito? (Ou


quais)
vamos falar sobre o

Comportamento
humano
Hoje as pessoas estão mais

Conectadas do
que nunca
25% das pessoas estão conectadas
em 4 ou mais devices por semana.

Pew Research Center, April , 2015


Essa campanha foi baseada em
pesquisas que revelaram que 84%
das pessoas não ficam sem celular
um único dia sequer.
Já parou pra
pensar o
porquê?
Facilita,
poupa seu tempo e
melhora sua vida.
De onde veio
esse lance de
UX?
Titio Don
Normam

;P
"I invented the term because I thought Human Interface and
usability were too narrow: I wanted to cover all aspects of
the person's experience with a system, including industrial
design, graphics, the interface, the physical
interaction, and the manual."
Don Normam
Ou talvez bem antes, com:
"If the point of contact between the product and the people
becomes a point of friction, then [the designer] has failed.
If, on the other hand, people are made safer, more
comfortable, more eager to purchase, more efficient-or just
plain happier-the [the designer] has succeeded.
"
Designing for People - Henry Dreyfuss (1904 – 1972)
Henry Dreyfuss
Designer Industrial
Alguns estudos antropométricos feitos por Henry
Sobre interfaces ou

Designers
(ou DAs)
egoístas
E o UX designer

O que faz?
O que você precisa saber para se tornar um bom

UX Designer?
1.Ter empatia
Acima de tudo, bons UX Designers sentem empatia por
outras pessoas.

Empatia é incrivelmente importante quando se desenha


uma interface.

Você precisa entender as necessidades e dores das pessoas,


só assim conseguirá desenvolver soluções adequadas.
2.Questionar
Questione tudo.

Isso abrirá sua mente para novas perspectivas. Novas


soluções. Novas alternativas e novos problemas também.

Questione tudo.
3.Manjar dos paranauê
de princípios de design
& Usabilidade
Esses princípios vão te ajudar a encontrar melhores soluções
e oferecer a melhor experiência para os usuários.
Closure
exemplo aplicado
4.Experiências ≠
Buscar conhecimento em outras áreas ajuda a entender e
conhecer mais sobre o comportamento humano.

Entender os pensamentos e sentimentos dos usuários ajuda


os UX designers a guiar suas decisões de projeto para a
direção certa.
5.Processos de UX
O processo de experiência do usuário normalmente consiste
em cinco fases principais: estratégia, pesquisa, análise,
concepção e produção.
Check list de um projeto de UX
Como podemos
desenhar experiências
que respeitem,
empoderem e melhorem
a vida das pessoas?
partiu
aomozo!
projeto do curso

E-commerce de
esportes
Análise
Heurística
Como e por que?
Uma das técnicas mais importantes para começar a projetar
experiências de usuário (UX).

A Análise Heurística se trata de uma técnica de pesquisa e


avaliação da usabilidade de um determinado projeto ou dos
projetos concorrentes.
Design thinking,
a gourmetização do design?
Design centrado no
usuário
É o processo onde mantemos o foco nas necessidades,
desejos e limitações dos usuários.
Imagine agora que cada grupo faz parte do time de UX
de um e-commerce de produtos esportivos.

A partir dessa ideia vamos realizar as seguintes técnicas:

1 - Planejamento do "the brief"'


2 - Criação de Personas (proto personas)
3 - Jornada do consumidor
4 - Teste de usabilidade.
Exercício 1

The Brief
The design brief
Quais as soluções, os diferenciais do seu produto?
Quais os atributos e a personalidade do seu produto?
Para qual público ele foi desenhado?
Qual o propósito do seu produto?
The design brief
é algo que você cria para o seu time, para os stakeholders,
para qualquer um que esteja envolvido com o projeto. Ele
ajuda a manter todos com a mesma visão e compartilhar a
essência da experiência do usuário.
Visão (Why) Requisitos (What)
Uma breve história que contextualize Quais as características que fazem dele tão
o porquê do produto ser tão especial?
importante para a vida das pessoas.

Princípios do produto (How)


Como esse produto vai interferir na vida das pessoas de maneira positiva.
Exercício 2

Crie Personas
(ou proto personas)
Alan Cooper

"Personas são personagens fictícios de produtos e


serviços que representam as necessidades de um grupo
maior de usuários. Devem ser criadas com base em dados
reais e atuam, nos projetos de design, como
representantes dos usuários reais ajudando a equipe a
tomar decisões sobre funcionalidades e design"
Leah Buley

"Proto Personas é uma versão modificada das personas e


simula o mesmo tipo de empatia e pensamento centrado
no usuário. Porém com muito menos investimento de
tempo. É baseado em insights, em menos dados reais,
mas pode ajudar o time a ter um mindset que atenda às
necessidades dos usuários.
Como criar?

Discuta com o grupo o que eles sabem ou supeitam


sobre os usuários do site e então foque em um tipo em
particular para desenvolver como proto-persona.

Descreva com detalhes a história dessa "pessoa". Onde


vive? O que faz da vida? Quais as suas frustrações. Como
seria a rotina dessa pessoa? Como era a vida dela antes
de usar o produto/site ?
infos importantes

Trate essas proto-personas como hipóteses que podem


ser validadas ou invalidadas.

Não confunda proto-personas com personas de verdade,


esse processo rápido que executamos serve apenas
como oportunidades de investigação, um norte para
você continuar o processo de pesquisa de verdade.
Exercício 3

Jornada do
usuário
Exercício 3

Jornada do
usuário
Por que criar?

● Para mapear possíveis comportamentos dos usuários


dentro do site;

● Para antecipar possíveis melhorias e novas


funcionalidades;

● Ajuda a definir a taxonomia e a interface;


Como criar?
Com base nos dados das personas que você criou, crie um mapa com a
jornada do consumidor.

Post-it verde - para o que motivou a pessoa a entrar no site

Post-it amarelo - para o que fez a pessoa continuar no processo de compra

Post-it rosa - problemas ou atitudes tomadas depois da compra


Ativação Avaliação Compra Pós-compra
Entenda o modelo
mental dos usuários.
Como?
Card Sorting.
Cafézinho?
Exercício 4

Teste de
usabilidade
Um teste de usabilidade é uma técnica de pesquisa muito
utilizada para validar hipóteses, dúvidas e
questionamentos sobre as interfaces.

Essa técnica segue um roteiro que contém tarefas


relacionas com as hipóteses que queremos validar.
testes de
usabiliade
é uma eterna arte de praticar o desapego
Exemplo de cenário e tarefas

Você é uma pessoa que gosta de fazer exercícios físicos e


sua nutricionista indicou whey protein para sua nova
dieta.

Tarefa 1 - O que você faria para comprar esse produto?

Tarefa 2 - Entre no site X e procure esse produto.

Tarefa 3 - Compre o whey de sabor morango.


Ferramentas online que ajudam a

entender os
usuários
Heatmaps
exibem clicks, mapas de calor e até
onde o usuário fez o scroll na
página.
Gravação das
visitas feitas no
site
Funis de conversão
Para desenhar e prototipar interfaces

para os usuários
Cursos
http://arquiteturadeinformacao.com/user-experience/cursos-de-ux-design-no-exterior-e-tambem-
online/

No Brasil eu não encontrei nenhum ainda =,(

Na gringa
http://www.cooper.com/training/
https://www.nngroup.com/training/

Online
http://www.lynda.com/User-Experience-training-tutorials/97-0.html
https://www.udacity.com/course/product-design--ud509
http://www.invisionapp.com/ecourses/principles-of-ux-design
Referências - UX
http://blog.usabilla.com/the-20-best-ux-articles-of-2015-part-1/

http://blog.usabilla.com/the-20-best-ux-articles-of-2015-part-2/

http://arquiteturadeinformacao.com/user-experience/os-vencedores-do-ixda-awards-2016/?
utm_content=buffer0192c&utm_medium=social&utm_source=facebook.com&utm_campaign=buffer

http://www.uxdesign.blog.br/usabilidade/10-licoes-de-usabilidade-de-steve-krug/

http://www.uxdesign.blog.br/user-experience/ux-ecommerce-jornada-do-consumidor/

http://samuraiux.com.br/blog/user-experience-samurai/guia-ux-o-que-e-jornada-do-usuario/

http://www.linhadecodigo.com.br/artigo/2355/abc-da-usabilidade-analise-heuristica.aspx

https://medium.com/ux-ui-design-1/analise-heuristica-o-que-e-fff5b7826ecb#.w049oo4oc

http://www.uxdesign.blog.br/user-experience/ux-por-onde-comecar/
Livros
Livros
Palestras e vídeos

Sobre os princípios de design aplicado a UX


Brigada e

Vlw. Flw.

You might also like