EURIPEDES MAGALHÃES - @EURIPEDESMUser Experience
DO QUE SE TRATA?Se trata de gerar “o momento em que tudo estáperfeito” se trata de fazer com que tudo o que ousuário use s...
USER EXPERIENCE“Algumas pessoas dizem que design é solução deproblemas. É óbvio que designers resolvemalguns problemas, ma...
FERRAMENTA DE TRABALHO,ACESSÓRIO? COMUNICADOR?
“Design is not just whatit looks like and feels like. Design is how it works.”          Steve Jobs
USER EXPERIENCEO iPhone ganhou espaço pela sua curva deaprendizado pequena e pela integração que elepermite com outros dis...
Visual    Sonoro     Olfativo                      ?Gestual    Tátil   E o que mais?
USER EXPERIENCEEm quase tudo que usamos há design, de revistas àembalagens, de cadeiras a mouses de computadores,de maçane...
http://nymag.com/nymetro/health/features/11700/
1. Fácil identificação                                            O nome do medicamento é impresso                        ...
5. Identificação por cor                                            Por cores customizadas é possível                     ...
Packaged               APIs                  Design                Deliverables                                           ...
Experiência do Usuário           Encontrabilidade                     ContinuidadeArquitetura da Informação               ...
USER EXPERIENCE HONEYCOMBPeter Morville
EMOCIONAL...David Armano
CRIATIVIDADE “EM T”
A MENTE EM FORMA DE TDavid Armano
ILUVUXDESIGN PART Ihttp://vimeo.com/19131028
ILUVUXDESIGN PART IIhttp://vimeo.com/21691333
PLANEJANDO UXBasicamente nada é criado sem uma base sólida depesquisa, imersão e entendimento do público e douso do que se...
Estudo da Nokia sobre tv móvel
FERRAMENTASExistem muitas ferramentas para pesquisa e definiçãode caminhos, um processo de design thinking maiscomplexo po...
MOOD BOARDFerramenta muito utilizada no processo de designestratégico, é um “facilitador de pensamento”, porconter informa...
MIND MAPDentre muitas funções do Mind Map, uma delas édefinir os caminhos de um projeto, ação, comunicaçãoou até mesmo fun...
Mind Map
DIAGRAMA DE AFINIDADESMétodo para ordenar idéias, informações ou ações, apartir de uma classificação por grupos, as inform...
PERSONASA definição de um “personagem” para pesquisa,na técnica de personas, é traçado um perfil de umpossível usuário, su...
http://wiki.openmoko.org/wiki/Main_Page
ÁRVORE DE TAREFAS E ETAPASÉ a listagem de todas as ações necessárias para ainteração no sistema ou site.Pode conter os ite...
ESTUDOApp para economia de combustível.Por intermédio da colaboração entre os usuários,o sistema apontaria os melhores loc...
ESTUDO/CASEApp para interação entre os amigos.Com o conceito de integrar os amigos e fazer coisasdiferenciadas, o app para...
DIAGRAMA SEQUENCIALMostra as interações entre os usuários e a sequênciade tarefas para fazer determinada ação.Ex.: compras...
@EURIPEDESMLinks úteis e bibliografia• http://www.designthinkingforeducators.com/• http://www.uxnet.org/• http://mitworld....
User Experience
User Experience
User Experience
User Experience
User Experience
User Experience
User Experience
User Experience
User Experience
User Experience
User Experience
User Experience
User Experience
User Experience
User Experience
User Experience
User Experience
Upcoming SlideShare
Loading in...5
×

User Experience

740

Published on

Aula de User Experience, baseada no documento do Instituto Faber Ludens.

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
740
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
95
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

User Experience

  1. 1. EURIPEDES MAGALHÃES - @EURIPEDESMUser Experience
  2. 2. DO QUE SE TRATA?Se trata de gerar “o momento em que tudo estáperfeito” se trata de fazer com que tudo o que ousuário use seja mais fácil e melhor, se trata fazer comque o uso daquele sistema, ferramenta ou serviço sejao melhor possível, que gere aprendizado, afetividadee lembrança.
  3. 3. USER EXPERIENCE“Algumas pessoas dizem que design é solução deproblemas. É óbvio que designers resolvemalguns problemas, mas isso os dentistas tambémfazem. Design é uma forma de invenção cultural.”Jack Schulze
  4. 4. FERRAMENTA DE TRABALHO,ACESSÓRIO? COMUNICADOR?
  5. 5. “Design is not just whatit looks like and feels like. Design is how it works.” Steve Jobs
  6. 6. USER EXPERIENCEO iPhone ganhou espaço pela sua curva deaprendizado pequena e pela integração que elepermite com outros dispositivos da Apple.A interface é um ponto importante neste ponto. Issonos leva a pensar nas características do design, quesão cada dia mais abrangentes.O design agora é um espaço de multilinguagem, emuitos recursos podem ser utilizados.
  7. 7. Visual Sonoro Olfativo ?Gestual Tátil E o que mais?
  8. 8. USER EXPERIENCEEm quase tudo que usamos há design, de revistas àembalagens, de cadeiras a mouses de computadores,de maçanetas de porta à assentos de carros, tudode alguma forma foi pensado para atender umanecessidade.Essa necessidade deve ser levada em consideração, ealém dela, o USUÁRIO também, o “rei” do designer.
  9. 9. http://nymag.com/nymetro/health/features/11700/
  10. 10. 1. Fácil identificação O nome do medicamento é impresso no topo da embalagem. 2. Cor vermelha A cor vermelha é o símbolo universal para alerta. 3. Hierarquia de informação Nome do medicamento, posologia, data de validade organizadas de acordo com sua importância e uso 4. Economia de papel A forma e posição do papel gera um melhor aproveitamento por folha e facilita a visualizaçãohttp://nymag.com/nymetro/health/features/11700/
  11. 11. 5. Identificação por cor Por cores customizadas é possível identificar e separar medicamentos quando usados por mais de uma pessoa em casa. 6. Card com informações extras Mais difícil de perder, o cartão fica atrás da embalagem e explica com detalhes as informações sobre o medicamento 7. Posologia Identificação da posologia, quantos dias dura o tratamento e quantas vezes por dia se utiliza.http://nymag.com/nymetro/health/features/11700/
  12. 12. Packaged APIs Design Deliverables Interaction Solutions Architecting the Usability Design Technology Prototyping Back-End Creative Design Information inking (Visual & UI) Architecture Flash Progra mming AJAX (JavaScript)Designing the Experience Content User Research DOM Front-End Scripting User Experience Development CSS Delivering the Problem Accessibility Experience Framing Business Intelligence User Markup Defi ning the Agents Problem Requirements Account Gathering / Project Mgmt. Research Mgmt. Managing the Project http://garrettdimon.com/pages/improving_interface_design
  13. 13. Experiência do Usuário Encontrabilidade ContinuidadeArquitetura da Informação Design de Serviços Usabilidade Socialidade Design de Interação Faber Ludens
  14. 14. USER EXPERIENCE HONEYCOMBPeter Morville
  15. 15. EMOCIONAL...David Armano
  16. 16. CRIATIVIDADE “EM T”
  17. 17. A MENTE EM FORMA DE TDavid Armano
  18. 18. ILUVUXDESIGN PART Ihttp://vimeo.com/19131028
  19. 19. ILUVUXDESIGN PART IIhttp://vimeo.com/21691333
  20. 20. PLANEJANDO UXBasicamente nada é criado sem uma base sólida depesquisa, imersão e entendimento do público e douso do que será criado.Por isso pode-se e deve-se fazer levantamentos sócio-demográficos, ver estatísticas de navegação, gerartestes de usabilidade, testes A/B, o que for possível.
  21. 21. Estudo da Nokia sobre tv móvel
  22. 22. FERRAMENTASExistem muitas ferramentas para pesquisa e definiçãode caminhos, um processo de design thinking maiscomplexo pode ser formatado, mas também itenspulverizados podem ajudar.Mood Boards, Mind Maps e diagramas podem serbons caminhos.
  23. 23. MOOD BOARDFerramenta muito utilizada no processo de designestratégico, é um “facilitador de pensamento”, porconter informações .As imagens contidas nele auxiliam o processo dedefinição dos caminhos a serem trabalhados.A idéia é criar esse processo de imersão, deatmosfera, humor. Imagens, tecidos, texturas, tudopode ser inserido nele.http://www.scrapblog.com
  24. 24. MIND MAPDentre muitas funções do Mind Map, uma delas édefinir os caminhos de um projeto, ação, comunicaçãoou até mesmo funcionamentos de um sistema.Ajuda a planejar as etapas e identificar os caminhosde uma forma visual e intuitiva.http://www.mindmeister.com
  25. 25. Mind Map
  26. 26. DIAGRAMA DE AFINIDADESMétodo para ordenar idéias, informações ou ações, apartir de uma classificação por grupos, as informaçõespodem ser agrupadas e classificadas.Facilita o arranjo das informações porque é intuitivo,rápido e ajuda na discussão dos resultados.http://nform.com/tradingcards/affinity-diagram
  27. 27. PERSONASA definição de um “personagem” para pesquisa,na técnica de personas, é traçado um perfil de umpossível usuário, suas características básicas, como elese relacionaria com o sistema e com o seu núcleo deconvivência, uma síntese da personalidade.Pode ser feito como uma descrição de um dia deatividades, somente como uma listagem ou atémesmo criando-se um perfil “fake” em uma rede socialpara testes.
  28. 28. http://wiki.openmoko.org/wiki/Main_Page
  29. 29. ÁRVORE DE TAREFAS E ETAPASÉ a listagem de todas as ações necessárias para ainteração no sistema ou site.Pode conter os itens de curva de aprendizado, podeconter as interações principais ou as interações entreos usuários do sistema.Serve como guia para programação, paraentendimento do tempo de interação e quantidade depáginas a serem criadas.
  30. 30. ESTUDOApp para economia de combustível.Por intermédio da colaboração entre os usuários,o sistema apontaria os melhores locais paraabastecimento, os melhores caminhos e também orendimento médio do veículo.
  31. 31. ESTUDO/CASEApp para interação entre os amigos.Com o conceito de integrar os amigos e fazer coisasdiferenciadas, o app para Facebook instigava aspessoas a convidar os amigos para atividades nomínimo estranhas.
  32. 32. DIAGRAMA SEQUENCIALMostra as interações entre os usuários e a sequênciade tarefas para fazer determinada ação.Ex.: compras em um B2B ou B2C ou C2C
  33. 33. @EURIPEDESMLinks úteis e bibliografia• http://www.designthinkingforeducators.com/• http://www.uxnet.org/• http://mitworld.mit.edu/video/357/• http://designthinking.ideo.com/• http://arquiteturadeinformacao.com/• http://www.usabilitycounts.com/• http://www.intuitionhq.com/• http://nform.com/tradingcards/affinity-diagram
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×