Visualização de Informação+ Interacção Homem-Máquina	    Realizado	  por:	  Celso	  Alexandre	  /	  João	  Simão	  /	  Tia...
Perspectiva Geral         COMUNICAÇÃO	  VISUAL	  &	  VISUALIZAÇÃO	  DE	  INFORMAÇÃO	           « 	  O	  que	  é?	   « 	 ...
Visualização de Informação      “	  INFORMATION VISUALIZATION PROMISES TO HELP US                 SPEED OUR UNDERSTANDING ...
Visualização de Informação             “	  REPRESENTAÇÃO VISUAL DE QUANTIDADES                 SIGNIFICATIVAS DE DADOS ABS...
Comunicação Visual                                                    çã   o	  	                                          ...
Informação Digital            “	  INFORMAÇÃO REPRESENTADA ATRAVÉS DE BITS                                            (CONJ...
ÊNFASE	  NOS	  DADOS	                                                ORGANIZAÇÃO	  E	  COMPREENSÃO	                       ...
Utilidade da Comunicação Visual   SIMPLIFICAR	       REPRESENTAR	           CONDENSAR	       REALÇAR	                     ...
Utilidade da Visualização de Dados                                                                   UM EXEMPLO:          ...
Interacção Homem-Máquina  “	  HUMAN-COMPUTER INTERACTION IS A DISCIPLINE CONCERNED        WITH THE DESIGN, EVALUATION AND ...
Interacção Homem-Máquina                 “	  ESTUDO DA INTERACÇÃO ENTRE                 UTILIZADORES E COMPUTADORES ”	    ...
Características e Tipos             ALGUMAS CARACTERÍSTICAS/COMPONENTES                          Comunicação,	  Feedback,	...
Exemplo: CAVE          CAVE AUTOMATIC VIRTUAL ENVIRONMENT                          ambiente	  de	  realidade	  imersiva	  
Primórdios da Informação Digital                                                         CARTÕES PERFURADOS               ...
Primórdios da Informação Digital                                         SUBSTITUÍDOS                              Fita	  ...
title	  command	  line	  interface	  (cli)	  >q 	  program	  halted.	                                                     ...
Graphical User Interface (GUI)                 File Browser!   EC files                      stuff                  16 bit...
Graphical User Interface (GUI)    PARADIGMA DE INTERACÇÃO HOMEM-MÁQUINA WIMP                                           win...
Natural User Interface (NUI)           PRATICAMENTE INVISÍVEL AO UTILIZADOR                    Interacção	  e	  visualizaç...
NUI BASEADAS EM TOUCHSCREENS E MULTITOUCH                  Exemplo:	  10/GUI	  -­‐	  hip://10gui.com/	  
NUI BASEADAS EM AMBIENTES IMERSIVOS                    Exemplo:	  Project	  Natal	  
NUI E REALIDADE AUMENTADAsobreposição	  de	  objectos	  virtuais	  no	       ambiente	  xsico,	  em	  tempo	  real	  
Exemplos de Sistemas de Visualização           PERMITEM VISUALIZAR E/OU INTERAGIR COM                 A INFORMAÇÃO DE FORM...
Microsoft Surface
Wolfram Mathematica
Live from the App Store
Trabalhos Citados[Card,	  2008]	  Card,	  S.	  (2008).	  InformaUon	  visualizaUon.	  In	  A.	  Sears,	  J.	  A.	  Jacko,	...
Fontes: Imagens                        +	  hip://www.flickr.com/photos/dscene/820346821/	  ©	  Markus	  Krisetya	       +	 ...
Upcoming SlideShare
Loading in …5
×

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

1,857 views
1,781 views

Published on

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.

Published in: Education, Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,857
On SlideShare
0
From Embeds
0
Number of Embeds
44
Actions
Shares
0
Downloads
30
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • Segundo StuartCard -> ler
  • É, portanto,....
  • A visualização de informação é uma forma de comunicação visual, que se constitui como...
  • É importante salientar que a comunicação visual e a visualização de dados não são uma e a mesma coisa. Embora partilhem características (entre as quais, o meio de difusão de informação, visual)...
  • Porque é, então, importante a comunicação visual? Se for digital pode ser dinâmica, com manipulação de dados em tempo real
  • Atenção que se trata de uma teoria. Na realidade, o que deriva deste estudo é a ideia de que, tendo em conta a população global total, estamos todos interligados por um número comparativamente pequeno de relacionamentos.
  • O Primeiro modo “UNIFORMIZADO” de introdução de dados e programas nos computadores foi o cartão perfurado. É a HermanHollerith que se deve a implementação destes cartões de modo a conterem informação que pudesse ser lida pelas máquinas. (O QUE TÁ NO SLIDE? NÃO ESTÁ A ENFEITAR...)
  • Em meados do século XX começaram a ser substituídos pelas fitas magnéticas como meio de armazenamento. Com o início da separação entre a interacção e visualização dos dados e o seu processamento e armazenamento, surgiu um dos primeiros aparelhos de input e output de dados, o terminal de computador.
  • Com um funcionamento input semelhante a uma máquina de escrever e o output feito num ecrã CRT (catodicraytube).OS CLI baseam-se apenas em texto, tornando-se pouco práticos quando é necessária a manipulação de muita informação. Têm a vantagem de ser flexíveis.São hoje usados a par com as (next slide)
  • GUI. Com a evolução da informática e das capacidades dos computadores, estes ficaram mais acessíveis ao público em geral, o que levou à necessidade de criar uma forma mais prática e intuitiva de visualizar e interagir com o computador. A primeira interface gráfica apareceu no Xerox Alto, e permitia a interacção com o ambiente virtual através da manipulação gráfica invés de usar apenas texto
  • Este produto da Xerox PARC introduziu o paradigma de interacção homem-máquina WIMP (janela, ícone, menu e aparelho apontador).
  • Uma Natural User Interface é um tipo de interface que é praticamente invisível ao utilizador, isto é, a interacção e visualização é de tal forma natural e espontânea que se aproxima muito à forma como visualizamos e manipulamos os objectos no mundo real.
  • Vídeo. Outro exemplo: iPhone
  • Mais direccionada á indústria do entretenimento. Pretendem que o utilizador se sinta o mais integrado possível no ambiente virtual.
  • Consiste na sobreposição de objectos virtuais no ambiente físico, mostrada ao utilizador, em tempo real, com recurso a algum aparelho tecnológico
  • 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  

    ×