Successfully reported this slideshow.

Visualização de Informação e Interacção Homem-Máquina

1.894 visualizações

Publicada em

Apresentação realizada para Expressão e Comunicação, 1º Semestre, 2009/2010

Algum texto pode aparecer deslocado. Recomenda-se que se efectue o download para ver correctamente a apresentação.

Publicada em: Educação, Tecnologia
  • Seja o primeiro a comentar

Visualização de Informação e Interacção Homem-Máquina

  1. 1. Visualização de Informação+ Interacção Homem-Máquina   Realizado  por:  Celso  Alexandre  /  João  Simão  /  Tiago  Valente  
  2. 2. Perspectiva Geral COMUNICAÇÃO  VISUAL  &  VISUALIZAÇÃO  DE  INFORMAÇÃO   «   O  que  é?   «   Como  se  relaciona  com  a  informação?  «   Para  que  serve?   INTERACÇÃO  HOMEM-­‐MÁQUINA   «   Em  que  consiste?   «   Qual  a  uUlidade?   «   Exemplos   IMPACTO  E  EVOLUÇÃO  DA  VISUALIZAÇÃO  DE  DADOS  DIGITAIS   «   Os  primórdios   «   As  CLI   «   As  GUI   «   Ambientes  Imersivos  e  NUI   «   O  futuro   EXEMPLOS  
  3. 3. Visualização de Informação “  INFORMATION VISUALIZATION PROMISES TO HELP US SPEED OUR UNDERSTANDING AND ACTION IN A WORLD OF INCREASING INFORMATION VOLUMES ”   [Card,  2008,  p.  542]  
  4. 4. Visualização de Informação “  REPRESENTAÇÃO VISUAL DE QUANTIDADES SIGNIFICATIVAS DE DADOS ABSTRACTOS, DE FORMA ESTRUTURADA ”  
  5. 5. Comunicação Visual çã o     informa visual   “  TRANSMISSÃO DE INFORMAÇÃO ATRAVÉS DE UM MEIO VISUAL: CORES, FORMAS, ORGANIZAÇÃO ESPACIAL ”  
  6. 6. Informação Digital “  INFORMAÇÃO REPRESENTADA ATRAVÉS DE BITS (CONJUNTOS DE 0 E 1) ”   NÃO É INFORMAÇÃO VISUALnecessário um dispositivo de visualização para efectuar a conversão e.g. LCD
  7. 7. ÊNFASE  NOS  DADOS   ORGANIZAÇÃO  E  COMPREENSÃO   VISUAL   IZAÇÃO  DE  DADOS  COMUNICAÇÃO   VISUAL  ÊNFASE  NA  INFORMAÇÃO  VISUAL  VALORIZAÇÃO  ESTÉTICA  
  8. 8. Utilidade da Comunicação Visual SIMPLIFICAR   REPRESENTAR   CONDENSAR   REALÇAR   MENOS  DEPENDENTE   MAIS   DO  IDOMA   UNIVERSAL  
  9. 9. Utilidade da Visualização de Dados UM EXEMPLO: TEORIA DOS SEIS GRAUS DE SEPARAÇÃO qualquer  indivíduo  encontra-­‐se  separado  de  outro   por,  no  máximo,  seis  graus  de  relacionamento   NÃO  SE  ENCONTRA  COMPROVADA!  
  10. 10. Interacção Homem-Máquina “  HUMAN-COMPUTER INTERACTION IS A DISCIPLINE CONCERNED WITH THE DESIGN, EVALUATION AND IMPLEMENTATION OF INTERACTIVE COMPUTING SYSTEMS FOR HUMAN USE (...) ”   [Hewei,  et  al.,  1992-­‐1996]  
  11. 11. Interacção Homem-Máquina “  ESTUDO DA INTERACÇÃO ENTRE UTILIZADORES E COMPUTADORES ”   ocorre  através  das  interfaces  de  uUlizador   objecUvo:  melhorar  a  user  experience  (UX)  
  12. 12. Características e Tipos ALGUMAS CARACTERÍSTICAS/COMPONENTES Comunicação,  Feedback,  Adaptabilidade ALGUNS TIPOS linear,  sobre  objectos,  de  hiperligação  
  13. 13. Exemplo: CAVE CAVE AUTOMATIC VIRTUAL ENVIRONMENT ambiente  de  realidade  imersiva  
  14. 14. Primórdios da Informação Digital CARTÕES PERFURADOS input  e  output:  armazenamento,  visualização  e  interacção   informação  digital  representada  pela  presença  ou  ausência  de   buracos  em  posições  predefinidas     pouco  dispendiosos  mas  perecíveis,  pouco  intuiUvos,  pouco  flexíveis    
  15. 15. Primórdios da Informação Digital SUBSTITUÍDOS Fita  magnéUca:  armazenamento   Terminais:  visualização  e  interacção    
  16. 16. title  command  line  interface  (cli)  >q  program  halted.   SURGIU COM OS TERMINAIS teclado  para  introdução  de  dados   primeira  vez  que  um  ecrã  (CRT)  é  usado  para  visualizar  dados  digitais     permite  interagir  em  tempo  real  com  o  computador,  através  de  um   modo  gráfico  limitado  e  baseado  somente  em  texto    
  17. 17. Graphical User Interface (GUI) File Browser! EC files stuff 16 bits FTW homework awesome letters MIDI files NES games APARECEU PELA PRIMEIRA VEZ NO XEROX ALTO permite  ao  uUlizador  interagir  com  o  computador  através  da   manipulação  de  gráficos,  imagens  e  outros  indicadores  visuais   (ícones,  botões,  janelas...),  em  vez  de  apenas  texto  
  18. 18. Graphical User Interface (GUI) PARADIGMA DE INTERACÇÃO HOMEM-MÁQUINA WIMP window,  icon,  menu,  poinUng  device   Pressupõe  o  uso  de  um  “aparelho  apontador”,  como  o  rato  
  19. 19. Natural User Interface (NUI) PRATICAMENTE INVISÍVEL AO UTILIZADOR Interacção  e  visualização  tão  naturais  que  a   manipulação  é  semelhante  à  de  objectos  reais  
  20. 20. NUI BASEADAS EM TOUCHSCREENS E MULTITOUCH Exemplo:  10/GUI  -­‐  hip://10gui.com/  
  21. 21. NUI BASEADAS EM AMBIENTES IMERSIVOS Exemplo:  Project  Natal  
  22. 22. NUI E REALIDADE AUMENTADAsobreposição  de  objectos  virtuais  no   ambiente  xsico,  em  tempo  real  
  23. 23. Exemplos de Sistemas de Visualização PERMITEM VISUALIZAR E/OU INTERAGIR COM A INFORMAÇÃO DE FORMA DINÂMICA
  24. 24. Microsoft Surface
  25. 25. Wolfram Mathematica
  26. 26. Live from the App Store
  27. 27. Trabalhos Citados[Card,  2008]  Card,  S.  (2008).  InformaUon  visualizaUon.  In  A.  Sears,  J.  A.  Jacko,  A.  Sears,  &  J.   A.  Jacko  (Eds.),  The  Human-­‐Computer  Interac9on  Handbook:  Fundamentals,  Evolving   Technologies,  and  Emerging  Applica9ons  (2nd  ed.,  p.  542).  CRC  Press.   [Hewei,  et  al.,  1992-­‐1996]  Hewei,  Baecker,  Card,  Carey,  Gasen,  Mantei,  et  al.   (1992-­‐1996).  Human-­‐Computer  Interac9on.  ObUdo  a  Dezembro  29,  2009,  de  ACM   SIGCHI  Curricula  for  Human-­‐Computer  InteracUon:  hip://old.sigchi.org/cdg/cdg2.html    
  28. 28. Fontes: Imagens +  hip://www.flickr.com/photos/dscene/820346821/  ©  Markus  Krisetya   +  hip://bhturismo.files.wordpress.com/2008/12/sinalizacao-­‐turisUca-­‐belo-­‐horizonte-­‐ turismo-­‐placa.jpg   +  hip://www.flickr.com/photos/thomashawk/161547780/  ©  Thomas  Hawk   +  hip://www.flickr.com/photos/thomashawk/161547780/  ©  ntr23   +  hip://www.flickr.com/photos/23941865@N02/3938326087/©  Ian  Smith   +  hip://commons.wikimedia.org/wiki/File:Books_by_maciekSz_(1).jpg   +  hip://www.vdtc.de/images/vdtc-­‐cave-­‐gr.jpg   +  hip://froxen.files.wordpress.com/2009/03/surface2.jpg   +  hip://www.nsf.gov/news/mmg/media/images/visualizaUon1_h.jpg   +  hip://upload.wikimedia.org/wikipedia/commons/1/19/System_3_punch_card.jpg   +  hip://www.operaUongadget.com/images/apple_imac_g5.jpeg   +  hip://media.svennerberg.com/2009/06/layar-­‐app.jpg  

×