O documento fornece uma introdução sobre UX/UI para programadores, discutindo o que é UX, UX design, a diferença entre UX e UI, e dicas para evitar frustrar os usuários. O documento também inclui um exemplo de protótipo de um sistema de curso online.

1. UX / UI
para programadores
por Mônica Mesquita

2. Mônica
Mesquita
▪Sou Publicitária
▪UI/UX Designer
▪Youtuber nas horas vagas
▪Fã da Apple
▪Palmeirense
▪Cristã

4. Vamos começar

5. O que é
UX?
User / Usuário
eXperience / Experiência

6. Usuário
É a pessoa que usa determinado produto ou serviço.
Se ele usa, ele é usuário!

8. Experiência
Qualquer conhecimento obtido por meio dos sentidos. {google}
Algum sentimento bom ou ruim ao fazer algo.

13. E o que é
UX Design?

14. “O UX Design é a área que realiza pesquisas e testes
com pessoas para saber a MANEIRA IDEAL para criar
interfaces fáceis e inovadoras.”

15. IMPORTANTE!
Não podemos projetar a experiência do usuário.
Nós podemos projetar PARA a experiência do usuário.

16. Quem
faz Parte?

17. Design
CENTRADO
no Usuário
é o processo onde mantemos o
foco nas necessidades, desejos
e limitações dos usuários
durante todo o projeto.

18. Toda boa
experiência
deve atender a 3 pontos:

19. Utilidade
preciso usar?

20. Usabilidade
consigo usar?

21. Desejabilidade
quero usar?

22. Lembre-se:
“O papel do UX Design não é apenas em criar boas experiências,
mas sobre evitar experiências ruins.”
Luiz Mizutani

24. Diferença entre
UX e UI?
Experiência do Usuário
Interface do Usuário

25. VAMOS ENTENDER

30. UX / UI
NO MUNDO DIGITAL

32. O usuário
não é burro!
O que para você é óbvio
para ele pode não ser

33. “Para uma
experiência ideal
é preciso oferecer o
que o usuário deseja ou
procura de forma simples
e direta”
Donald Norman {Apple 1990}

34. PROGRAMADOR DESIGNERVS

35. IT´S A CRUSH!
PROGRAMADOR DESIGNER

36. DESIGN
NÃO É
TUDO

37. Cliente Designer Team UX

38. Não existe uma boa UI (interface)
sem um bom desenvolvimento

39. EXEMPLOS!

40. Software Financeiro

41. Instagram

42. TECNOLOGIA
E USUÁRIO

43. 25% das pessoas
estão conectadas em 4 ou mais devices por semana
Pew Research Center 2015

45. Fluxo de UX Design
Definição Pesquisa ProtótipoEstratégia TesteDesenvolvimento

46. Definição Pesquisa ProtótipoEstratégia TesteDesenvolvimento
Fluxo de UX Design

47. Protótipos
e Testes

48. Protótipo em Baixa Fidelidade

49. Protótipo em Alta Fidelidade

50. Teste com usuários

51. O custo para consertar um erro num produto
depois de lançado é 100 vezes maior que fazer
isso durante o processo de desenvolvimento.
EEEITA!

52. HORA DA
PAUSA

53. COMO EVITAR QUE SEU
USUÁRIO SE FRUSTRE?

54. Performance
74% dos usuários
abandonam o site/aplicativo após esperar 5 segundos
para que ele carregue.
Funcionalidade
Se algo não funcionar, a experiência do usuário já
está comprometida.

55. NÃO SE ESQUEÇA:
VOCÊ TEM 5 SEGUNDOS
PARA CHAMAR A ATENÇÃO
DO USUÁRIO
Carregue o que
for útil primeiro

56. Renderização Progressiva

57. Indicadores de Progresso

58. Converse
com seu usuário

59. Botões
Inteligentes

60. Utilize ícones

61. Oi?

62. Crie
atalhos

63. Tipografia
Nada é mais irritante para um usuário do que ter que se
esforçar para ler algo de seu interesse.
OLATUDO BOM?

64. Essas dicas o ajudarão a
não frustrar o usuário
"Little Pig"

65. Com UX todo mundo fica feliz!

66. Mão na massa!
Desenhar o protótipo (wireframe)
de um sistema de curso online
Telas exigidas:
1) Login 2) Home 3) Assistir ao curso selecionado.
Dicas para o conteúdo:
Meus vídeos, Últimos assistidos, Últimos adicionados, Recomendado, Mostrar avaliação do vídeo,
Mostrar tempo de duração, Categorias: Iniciante ou Intermediário, Adicionar comentários e notas.

67. Livros

68. Obrigada!
→ Facebook: momesquita
→ Twitter: momesquita
→ Snapchat: moonicamesquita
→ Instagram: momesquita_