SlideShare uma empresa Scribd logo
1 de 27
Baixar para ler offline
Familiarity to
3D Interface
Design
Sonya Seddarasan
Principal Product Design
The Challenge
for “Goodbye
frame UI “
3rd Person 1st Person
VS
3D Spatial
UI Designer
180 Degree
90 Degree
20 Degree
Possibility Canvas : 360°
Affordance Canvas : 180°
Working FOV : 90°
Foveated Rendering : 20°
Do not
reinvent
UI
Pattern
Tools
Paper and Pen
Softwares
Unity | Unreal Engine
VR Frameworks
Mozilla A- Frame
Google Cardboard,
Samsung Gear & Oculus Rift
Daydream VR
Mobile Phone VR
Unity / Unreal
High Ends VR for Oculus
Rift, HTC Vive, Hololens AR
2D UI 3D UI
Canvas, Frame
Mouse
----
Goal
Affordance
Flows
States
Field of View
Gaze, Sound, Gesture
----
Direction
Affordance
Narratives
Episodes
VS
2D UI 3D UI
Emotions
Navigation
Tools
Non Diegetic
Emotions
Spatial Navigation
Body / World Lock
Diegetic UI
VS
The reality within
User’s Brain in 3D
Welcome to
The reality of Brain in 3D
Factors Building Presence
Agency
The amount of control
you give to your users
Environment
Richness
The amount of realism
we put in to the
environment
Multimodal
Acts
The amount of
cognitive sense we
provide to the users
Multimodal
Acts
“We are a team, Please do
not separate us“
- Brain
Speech Gaze Gestures 6 DOFAudio
3D UI
play important role
in VR future
User Field of View
Affordance Canvas: 180°
Working FOV: 90°
Foveated Rendering: 20°
Placement Guidelines in 3D UI
Personal
Space
A natural arm rules
between user and the
other object
Action Space
A space where action
can be taken without
limiting the capabilities
Vista Space
Non controllable space
for users
Text Neck & Headset Force
3D Multimodal Interaction
Gaze SpeechGestures
Gaze as Interaction
Gaze in VR
Avoid:
Gaze angle > 10°above horizon
Gaze angle > 60° below horizon
Neck rotation > 45 °above horizon
Working FOV: 90°
Gaze Angle: 10° - 20°
below horizon
Gesture as Interaction
Arm Height
Try not to go above elbow
Faster Interaction
The higher the hand goes
against the body, the faster
the interaction needs to be
Principles in Building Gesture
Speech as Interaction
Relying on Speech for
actionable item inside
immersive experience is
still being discovered
The reality within
Designer’s Brain in 3D
...and now to
The Common Bias
Familiarity
Designers vs Users
Comfort Level
Designers vs Users
Never Assume
TEST, TEST, TEST
Familiarity from 2D UI to 3D Spatial Interface

Mais conteúdo relacionado

Semelhante a Familiarity from 2D UI to 3D Spatial Interface

Augment Works - Augmented Reality and Virtual Reality Development Company
Augment Works - Augmented Reality and Virtual Reality Development CompanyAugment Works - Augmented Reality and Virtual Reality Development Company
Augment Works - Augmented Reality and Virtual Reality Development Company
Ghanshyam Sharma
 

Semelhante a Familiarity from 2D UI to 3D Spatial Interface (20)

Virtual reality
Virtual realityVirtual reality
Virtual reality
 
Virtual reality and its Types
Virtual reality and its TypesVirtual reality and its Types
Virtual reality and its Types
 
Augment Works - Augmented Reality and Virtual Reality Development Company
Augment Works - Augmented Reality and Virtual Reality Development CompanyAugment Works - Augmented Reality and Virtual Reality Development Company
Augment Works - Augmented Reality and Virtual Reality Development Company
 
Augment works
Augment works  Augment works
Augment works
 
Sam Frish: MR molecular game for scientists
Sam Frish: MR molecular game for scientistsSam Frish: MR molecular game for scientists
Sam Frish: MR molecular game for scientists
 
Think beyond keyboard and screen xr day 2019
Think beyond keyboard and screen   xr day 2019Think beyond keyboard and screen   xr day 2019
Think beyond keyboard and screen xr day 2019
 
Augmented reality ppt
Augmented reality pptAugmented reality ppt
Augmented reality ppt
 
VR presentation APKOMINDO 2016
VR presentation APKOMINDO 2016VR presentation APKOMINDO 2016
VR presentation APKOMINDO 2016
 
3D in Android
3D in Android3D in Android
3D in Android
 
VRamazon
VRamazonVRamazon
VRamazon
 
Virtual Reality and Augmented Reality
Virtual Reality and Augmented RealityVirtual Reality and Augmented Reality
Virtual Reality and Augmented Reality
 
Design for VR - workshop for IDF Bangalore
Design for VR - workshop for IDF BangaloreDesign for VR - workshop for IDF Bangalore
Design for VR - workshop for IDF Bangalore
 
Hihihihihihihivivivirtual reality.ppt.pptx
Hihihihihihihivivivirtual reality.ppt.pptxHihihihihihihivivivirtual reality.ppt.pptx
Hihihihihihihivivivirtual reality.ppt.pptx
 
2013 Lecture 6: AR User Interface Design Guidelines
2013 Lecture 6: AR User Interface Design Guidelines2013 Lecture 6: AR User Interface Design Guidelines
2013 Lecture 6: AR User Interface Design Guidelines
 
Presentation1
Presentation1Presentation1
Presentation1
 
Augmented-Reality-ppt.pptx
Augmented-Reality-ppt.pptxAugmented-Reality-ppt.pptx
Augmented-Reality-ppt.pptx
 
Learning The Rules to Break Them: Designing for the Future of VR
Learning The Rules to Break Them: Designing for the Future of VRLearning The Rules to Break Them: Designing for the Future of VR
Learning The Rules to Break Them: Designing for the Future of VR
 
How much does it cost for virtual reality app development
How much does it cost for virtual reality app developmentHow much does it cost for virtual reality app development
How much does it cost for virtual reality app development
 
Portland vr-meetup-deck-final-shareable
Portland vr-meetup-deck-final-shareablePortland vr-meetup-deck-final-shareable
Portland vr-meetup-deck-final-shareable
 
From Cardboard to Daydream - The Evolution of VR on Android
From Cardboard to Daydream - The Evolution of VR on AndroidFrom Cardboard to Daydream - The Evolution of VR on Android
From Cardboard to Daydream - The Evolution of VR on Android
 

Último

一比一原版谢菲尔德大学毕业证成绩单如何办理
一比一原版谢菲尔德大学毕业证成绩单如何办理一比一原版谢菲尔德大学毕业证成绩单如何办理
一比一原版谢菲尔德大学毕业证成绩单如何办理
cyebo
 
Knowing, Understanding and Planning Cities- Role and Relevance Physical Plan...
Knowing, Understanding and Planning Cities- Role and Relevance  Physical Plan...Knowing, Understanding and Planning Cities- Role and Relevance  Physical Plan...
Knowing, Understanding and Planning Cities- Role and Relevance Physical Plan...
JIT KUMAR GUPTA
 
Heuristic Evaluation of System & Application
Heuristic Evaluation of System & ApplicationHeuristic Evaluation of System & Application
Heuristic Evaluation of System & Application
Jaime Brown
 

Último (20)

CADD 141 - BIRD Scooter - Cup Holder Photos.pdf
CADD 141 - BIRD Scooter - Cup Holder Photos.pdfCADD 141 - BIRD Scooter - Cup Holder Photos.pdf
CADD 141 - BIRD Scooter - Cup Holder Photos.pdf
 
Bit Dhrumi shah Graphic Designer portfolio
Bit Dhrumi shah Graphic Designer portfolioBit Dhrumi shah Graphic Designer portfolio
Bit Dhrumi shah Graphic Designer portfolio
 
Eric Parein CV. Parein in English is best pronounced as PARE-IN
Eric Parein CV. Parein in English is best pronounced as PARE-INEric Parein CV. Parein in English is best pronounced as PARE-IN
Eric Parein CV. Parein in English is best pronounced as PARE-IN
 
Webhost NVME Cloud VPS Hosting1234455678
Webhost NVME Cloud VPS Hosting1234455678Webhost NVME Cloud VPS Hosting1234455678
Webhost NVME Cloud VPS Hosting1234455678
 
Heidi Livengood's Professional CADD Portfolio
Heidi Livengood's Professional CADD PortfolioHeidi Livengood's Professional CADD Portfolio
Heidi Livengood's Professional CADD Portfolio
 
Spring 2024 wkrm_Enhancing Campus Mobility.pdf
Spring 2024 wkrm_Enhancing Campus Mobility.pdfSpring 2024 wkrm_Enhancing Campus Mobility.pdf
Spring 2024 wkrm_Enhancing Campus Mobility.pdf
 
BIT Khushi gandhi project.pdf graphic design
BIT Khushi gandhi project.pdf graphic designBIT Khushi gandhi project.pdf graphic design
BIT Khushi gandhi project.pdf graphic design
 
Latest Trends in Home and Building Design
Latest Trends in Home and Building DesignLatest Trends in Home and Building Design
Latest Trends in Home and Building Design
 
一比一原版谢菲尔德大学毕业证成绩单如何办理
一比一原版谢菲尔德大学毕业证成绩单如何办理一比一原版谢菲尔德大学毕业证成绩单如何办理
一比一原版谢菲尔德大学毕业证成绩单如何办理
 
Naer VR: Advanced Research and Usability Testing Project
Naer VR: Advanced Research and Usability Testing ProjectNaer VR: Advanced Research and Usability Testing Project
Naer VR: Advanced Research and Usability Testing Project
 
Design lessons from Singapore | Volume 3
Design lessons from Singapore | Volume 3Design lessons from Singapore | Volume 3
Design lessons from Singapore | Volume 3
 
spColumn-Manual design column by spcolumn software.pdf
spColumn-Manual design column by spcolumn software.pdfspColumn-Manual design column by spcolumn software.pdf
spColumn-Manual design column by spcolumn software.pdf
 
The Impact of Artificial Intelligence on Modern Healthcare.pptx
The Impact of Artificial Intelligence on Modern Healthcare.pptxThe Impact of Artificial Intelligence on Modern Healthcare.pptx
The Impact of Artificial Intelligence on Modern Healthcare.pptx
 
Claire's designing portfolio presentation
Claire's designing portfolio presentationClaire's designing portfolio presentation
Claire's designing portfolio presentation
 
And that's about to change! (Service Design Drinks Berlin May 2024)
And that's about to change! (Service Design Drinks Berlin May 2024)And that's about to change! (Service Design Drinks Berlin May 2024)
And that's about to change! (Service Design Drinks Berlin May 2024)
 
Design Portofolios - Licensed Architect / BIM Specialist
Design Portofolios - Licensed Architect / BIM SpecialistDesign Portofolios - Licensed Architect / BIM Specialist
Design Portofolios - Licensed Architect / BIM Specialist
 
FW25-26 Fashion Key Items Trend Book Peclers Paris
FW25-26 Fashion Key Items Trend Book Peclers ParisFW25-26 Fashion Key Items Trend Book Peclers Paris
FW25-26 Fashion Key Items Trend Book Peclers Paris
 
Knowing, Understanding and Planning Cities- Role and Relevance Physical Plan...
Knowing, Understanding and Planning Cities- Role and Relevance  Physical Plan...Knowing, Understanding and Planning Cities- Role and Relevance  Physical Plan...
Knowing, Understanding and Planning Cities- Role and Relevance Physical Plan...
 
Heuristic Evaluation of System & Application
Heuristic Evaluation of System & ApplicationHeuristic Evaluation of System & Application
Heuristic Evaluation of System & Application
 
Recycled Modular Low Cost Construction .pdf
Recycled Modular Low Cost Construction .pdfRecycled Modular Low Cost Construction .pdf
Recycled Modular Low Cost Construction .pdf
 

Familiarity from 2D UI to 3D Spatial Interface