UX para desenvolvedores

Ux design
for developers

Pedro Marques
Designer de Interfaces @ Plan B Comunicação
@pedro_designer | pedro@marksdesign.com.br

sábado, 22 de fevereiro de 14

QUEM SOU EU?
UI Designer
UX Designer
Usuário
Jamal


Quero criar um produto
O que é preciso?


O QUE É UX?
“Nossa é difícil usar isso”
“Que app lento”
“Má quê esso?”


Usuário não é burro
Mas o que para você é obvio
para ele pode ser complexo


O QUE É UX?
Arquitetura
Design de interação
Design Visual


O QUE É UX?
Arquitetura
Design de interação
Design Visual
PERFORMANCE

DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS

DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS

DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS
DEVELOPERS

‣ Seu código guia a experiência
‣ UI != UX
‣ Bom UX gera momentos agradáveis
‣ Você dá vida ao Design


Mas e na prática?
Como isso afeta o usuário?


Vamos criar um caso
Uma Rede Social


#partiu Dev In Company na Plan B Comunicação! o/


5 segundos
5 vezes/dia
22 dias/mês
264 dias/ano


Pessoas
Emoções


Pessoas
Emoções
Experiências


20 000
por dia


:) ou ;(


Enchant me.
Simplify my life.
Make me amazing.
Android Team


Boas Práticas


Boas Práticas
‣ Melhoria continua
‣ Feedback de erro/conﬁrmação
‣ Animações
‣ Considere a conexão
‣ Carregamento em ﬁla

Boas Práticas
‣ Faça sua aplicação consistente
‣ Sempre informe cada passo do usuário
‣ Deixe o usuário no controle
‣ Use sua própria aplicação
‣ Não conﬁe no seu código.

Lean UX
Metodologia ágil de UX

Conceito > Protótipo > Validação Interna > Teste externo > Aprender com
o comportamento > Repetir o processo


Lean UX Metodologia ágil de UX
•Enquadre uma visão do problema com toda a equipe.
•Compartilhe sua ideias o quanto antes com a sua equipe;
•Crie o MVP
•Incorpore a voz do cliente durante todo o ciclo do projeto;
•Misture o Lean UX com as Sprints do Scrum


Cases
Eu vi e vivi.


Cases

Eu vi e vivi.

OTC 2013
Petrobras

Páginas internas com cliques em pontos especíﬁcos para rolar o conteúdo
pois o projeto era responsivo e seria exibido em painéis touch no evento.
Animações de infográﬁcos que ajudam também no tempo de carregamento da
página


Cases

Eu vi e vivi.

Petrobras Conhecer
Petrobras

Revista digital Híbrida construída em HTML5 + CSS3 + JavaScript
Portal com mesmo conteúdo, porém responsivo.


#euindico
http://littlebigdetails.com/
http://houseofbuttons.tumblr.com/
http://ui-animations.tumblr.com/


Valeu!

que a força esteja com vocês.

Pedro Marques
Designer de Interfaces @ Plan B Comunicação
@pedro_designer | pedro@marksdesign.com.br


UX para desenvolvedores

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Andere mochten auch

Andere mochten auch (20)

UX para desenvolvedores