3D User Interfaces http://www.tecgraf.puc-rio.br/~abraposo/inf2792/ Aula 01 – Introdução Alberto Raposo Tecgraf, Depto de Informática., PUC-Rio - Rio de Janeiro Aula 01 – Introdução abraposo@
3D User Interfaceshttp://www.tecgraf.puc-rio.br/~abraposo/inf2792/
Aula 01 – Introdução
Alberto Raposo
Tecgraf, Depto de Informática.,PUC-Rio - Rio de Janeiro
Aula 01 – Introdução
abraposo@
Tipos de interface
1980s interfaces
Command
WIMP/GUI
1990s interfaces
Advanced graphical (multimedia, virtual reality, information visualization)
Web
Speech (voice)
Pen
Appliance Appliance
2000s interfaces
Mobile
Gesture and touch
Multimodal
Shareable
2010s interfaces
Multi-touch
Game consoles: Wiimote, Kinect (device-free)
Tangible ?
Augmented and mixed reality ?
Wearable ?
Robotic ?
User Experience
• Como o produto se “comporta” e como é usado pelas pessoas no mundo real– Opinião das pessoas sobre o produto e sua satisfação ao
usá-lo, olhá-lo, manuseá-lo, etc.
– “todo produto que é usado por alguém provê uma experiência de usuário: jornais, garrafas de catchup, roupas, experiência de usuário: jornais, garrafas de catchup, roupas, etc.” (Garrett, 2003)
• Não se pode projetar uma experiência de usuário, mas se pode projetar para uma experiência de usuário
User Experience
experiências
aplicações Interaction
Usability, accessibility
aplicações
ferramentas
componentes Hardware devices
APIs, frameworks, etc.
Interaction
Digital < Interfaces > Real
GUI DesktopMetaphor
TUI
Virtual | Real
Real Desktop + Virtual data
Forms3D
Bodylanguage
Command LineGUI
GUI + Visual & Interactions inspiredin physical laws
Multi-touchWIMP
Virtual data Forms
3D
Hybridinterfaces
Interfaces de comandos
• Commands such as abbreviations (e.g., ls) typed in at the prompt to which the system responds (e.g., listing current files)
• Some are hard wired at keyboard, e.g., delete
• Efficient, precise, and fast• Efficient, precise, and fast
• Large overhead to learning set of commands
• Form, name types and structure are key research questions
• Consistency is most important design principle
– e.g., always use first letter of command
WIMP/GUI interfaces
• Xerox Star: first WIMP
• Windows
– could be scrolled, stretched, overlapped, opened, closed, and moved around the screen using themousemouse
• Icons
– represented applications, objects, commands, and tools that were opened when clicked on
• Menus
– offering lists of options that could be scrolled through and selected
• Pointing device
– a mouse controlling the cursor as a point of entry to the windows, menus, and icons on the screen
Digital < Interfaces > Real
GUI DesktopMetaphor
TUI
Virtual | Real
Real Desktop + Virtual data
Forms3D
Bodylanguage
Command LineGUI
GUI + Visual & Interactions inspiredin physical laws
Multi-touchWIMP
Virtual data Forms
3D
Hybridinterfaces
Desktop PC
• Display do computador como representação visual de
uma mesa onde documentos e pastas são organizados
• Vantagem: organização!
Digital < Interfaces > Real
GUI DesktopMetaphor
TUI
Virtual | Real
Real Desktop + Virtual data
Forms3D
Bodylanguage
Command LineGUI
GUI + Visual & Interactions inspiredin physical laws
Multi-touchWIMP
Virtual data Forms
3D
Hybridinterfaces
Leis físicas
Denoue (2003)WebBook - Card(1996) WebForager- Card(1996)
BumpTop (2006)
Digital < Interfaces > Real
GUI DesktopMetaphor
TUI
Virtual | Real
Real Desktop + Virtual data
Forms3D
Bodylanguage
Command LineGUI
GUI + Visual & Interactions inspiredin physical laws
Multi-touchWIMP
Virtual data Forms
3D
Hybridinterfaces
3D interfaces
• Espaço de um único display é pequeno. Se
considerássemos a equivalência a um desktop físico:
• Soluções:
– Múltiplos monitores
– 3D interfaces
3D interfaces
Microsoft’s Task Gallery Windows Vista
3D Desktops
http://www.youtube.com/watch?v=4QokOwvPxrE&feature=related
Digital < Interfaces > Real
GUI DesktopMetaphor
TUI
Virtual | Real
Real Desktop + Virtual data
Forms3D
Bodylanguage
Command LineGUI
GUI + Visual & Interactions inspiredin physical laws
Multi-touchWIMP
Virtual data Forms
3D
Hybridinterfaces
Escritoire
• Papéis digitais tratados como reais
– Aparência similar
– Interação similar (caneta rastreada)
Digital < Interfaces > Real
GUI DesktopMetaphor
TUI
Virtual | Real
Real Desktop + Virtual data
Forms3D
Bodylanguage
Command LineGUI
GUI + Visual & Interactions inspiredin physical laws
Multi-touchWIMP
Virtual data Forms
3D
Hybridinterfaces
TUI - Tangible User Interfaces
MetaDESK (1997)
Sensetable (2001)
Digital < Interfaces > Real
GUI DesktopMetaphor
TUI
Virtual | Real
Real Desktop + Virtual data
Forms3D
Bodylanguage
Command LineGUI
GUI + Visual & Interactions inspiredin physical laws
Multi-touchWIMP
Virtual data Forms
3D
Hybridinterfaces
Multi-Touch
Microsoft Surface (2007)
SmartSkin(2002)iP*
Digital < Interfaces > Real
GUI DesktopMetaphor
TUI
Virtual | Real
Real Desktop + Virtual data
Forms3D
Bodylanguage
Command LineGUI
GUI + Visual & Interactions inspiredin physical laws
Multi-touchWIMP
Virtual data Forms
3D
Hybridinterfaces
Interface híbridas
• Diferentes formas de interação em um único
espaço de interação
Butz, et al. (1999)Rekimoto and Saitoh (1999)
Digital < Interfaces > Real
GUI DesktopMetaphor
TUI
Virtual | Real
Real Desktop + Virtual data
Forms3D
Bodylanguage
Command LineGUI
GUI + Visual & Interactions inspiredin physical laws
Multi-touchWIMP
Virtual data Forms
3D
Hybridinterfaces
MS Kinect / Wii U
http://www.youtube.com/watch?v=4e3qaPg_keg
E ainda...
• Mobile + AR
E ainda...
• Haptics / tactile interfaces
E ainda...
• Shareable (interfaces compartilhadas)
Smartboard
E ainda...
• Wearable
E ainda...
• Robotic
Giraffe Video Conferencing Robot
E ainda...
• O que mais inventarem
Alguns contínuos que ajudam a entender
• Milgram & Kishino 1994
Mixed Reality (MR)Mixed Reality (MR)
Virtual
Environment
Real
EnvironmentAugmented
Virtuality (AV)
Augmented
Reality (AR)
Definições
• Realidade Virtual (VR):
– “computer generated interactive tridimensional
environment, into which a person is immersed”
– “immersive and interactive experience based on – “immersive and interactive experience based on
3D graphical images generated in real-time by
computers”
– “a form of post-WIMP
interface”
Definições
• Realidade Virtual:
– Combinação de 4 elementos
• Mundo virtual
– Espaço imaginário geralmentemanifestado através de um meio
• Imersão• Imersão
– Mental
– Física: estímulo sintético de sentidos do corpo
• Feedback sensorial
– Baseado na posição física do usuário
» Geralmente feedback visual, às vezes auditivo e háptico (toque)
• Interatividade
– Capacidade de afetar o mundo virtual
Definições
• Realidade Aumentada (AR):
– Um sistema de AR apresenta as seguintes
caracterísitcas
• combina objetos reais e virtuais em um ambiente real
• opera interativamente, em tempo real• opera interativamente, em tempo real
• registra (alinha) objetos reais e virtuais
Definições
• Virtualidade Aumentada:
– Ambiente Virtual aumentado com elementos do
mundo real
E ainda...
• Realidade diminuída
Alguns contínuos que ajudam a entender
• Molina 2008
Mixed Reality (MR)Mixed Virtuality (MV) Mixed Reality (MR)
Virtual
Environment
Real
EnvironmentAugmented
Virtuality (AV)
Augmented
Reality (AR)
Mixed Virtuality (MV)
Digital
Environment Hybrid 2D/3D
interfaces
Molina´s continuun
Molina´s continuun
Molina´s continuun
Looking Glass [Sun]
Molina´s continuun
E, afinal, o que é 3DUI ?
Definição formal de 3DUI
• 3DUIs geralmente não são chamadas por este
nome, mas por outros termos como, por
exemplo, post-WIMP, non-WIMP, post-PC,
Virtual Reality (VR), Virtual Environments
(VE), Augmented Reality (AR), interactive 3D (VE), Augmented Reality (AR), interactive 3D
graphics, ou simplesmente 3-D.
• Todos esses termos estão relacionados ao uso
de tecnologia 3D como uma interface entre o
usuário e o computador, como entrada, saída,
ou ambos.
Definição formal de 3DUI
• 3D como entrada
– Mouse 3D
– Rastreamento
• Cabeça
• Mãos• Mãos
• Movimentos, gestos
– Mapeamento de 3D em dispositivos 2D
• 3D como saída
– Virtual environments
– Estereoscopia
– AR
Definição formal de 3DUI
• Uma definição formal para 3DUI
…a human-computer interface in which the
language used by the user to introduce commands
and information into the computer, and/or the
language used by the computer to present language used by the computer to present
information to the user, are based on the physical
space and its three dimensions.
• Cobre as várias maneiras em que 3DUI pode aparecer
em diferentes tipos de aplicações.
Refinando um pouquinho mais
• Interação 3D: Interação Humano-Computador em que as tarefas do usuário ocorrem em um contexto espacial 3D– Dispositivos de entrada 3D
– Dispositivos de entrada 2D com mapeamento direto para 3D3D
• 3DUI: UI que envolve Interação 3D
• Técnica de interação 3D: método (hardware ou software) que permite ao usuário realizar uma tarefa numa 3DUI
Curso CHI 2008 (D. Bowman et al.) http://people.cs.vt.edu/~bowman/3dui.org/CHI_2008.html
Por que 3D UI é útil?
• Reforça sentimento de imersão
• Usa habilidades naturais do usuário
• Baixa distância cognitiva entre ação e visualização �permite montar modelos mentais complexos
• Problema: o que “funciona” atualmente são interações 3D bem simples: walkthroughs, games, etc. Interações 3D mais complexas (design imersivo, visualização científica, etc) ainda têm muitas limitações de usabilidade
Por que 3DUI demorou tanto?
Fonte: S. Feiner, course notes: http://monet.cs.columbia.edu/courses/csw4172/
BRETAM: Modelo de Evolução da Tecnologia
ko
wn
led
ge
time
B. R. Gaines. Modeling and forecasting the information sciences.Information Sciences: an International Journal, 57-58: 3-22. 1991.
BRETAM: Modelo de Evolução da Tecnologia
VR
AR
BRETAM: VR
1960’s
1970’s-1980’s
1980’s – 1990’s
1990’s – 2000’s
Now
1990’s – 2000’s
BRETAM: AR
1970’s
1980’s – 1990’s
Now
Trabalho para turma 2009.1
• Assim como foi feito para VR e AR, “desenhar” o
modelo BRETAM para o desenvolvimento de 3DUIs,
indicando em que fase nos encontramos hoje e como
os exemplos históricos se encaixam nas fases
anteriores do BRETAM anteriores do BRETAM
– Refs sobre BRETAM
• http://pages.cpsc.ucalgary.ca/~gaines/reports/MFIT/InfSci/index.ht
ml
• B. R. Gaines. Modeling and forecasting the information sciences.
Information Sciences: an International Journal, 57-58: 3-22. 1991.
Multi Touch
1982: Flexible Machine Interface
2007~
1990’s~2000’s
http://www.billbuxton.com/multitouchOverview.html
3DUI no modelo BRETAM3DUI no modelo BRETAM
Rodrigo Veiga
Diversos estágiosDiversos estágios
• 3DUI pode ser encontrada em diversos
estágios do BRETAM, principalmente em:
– Research
– Product Innovation– Product Innovation
– Product Line
– Low-Cost Products
– Depende do tipo de interface que estamos tratando
3DUI 3DUI -- ResearchResearch
• Variação de dispositivos
• “Finger Tracks”
3DUI 3DUI –– Product InnovationProduct Innovation
• Entrevistas por “holograma” (usadas pela
CNN)
• Sonda usada em marte• Sonda usada em marte
• Wearable
3DUI 3DUI –– Product LinesProduct Lines
• MS Surface Table
• Captura de movimentos 3d
(para jogos de simulação)
• Wii
• Wii Fit?
3DUI 3DUI –– Low Cost ProductsLow Cost Products
• Multitouch em celulares
• Utilização de acelerômetro para detectar
posiçõesposições
• “Fliperamas” 3D (luta, futebol, etc)