Smart Desk
Designing educational functions to create an immersive learning and teaching experience in Unreal Engine VR.
Designing educational functions to create an immersive learning and teaching experience in Unreal Engine VR.
UX Research • Product Design • Internship
UX Research • Product Design • Internship
Project • 1
The Smart Classroom project is part of Cyber-Archaeology Warehouse based in Qualcomm Institute-UCSD Division of Calit2 to create AR/VR experiences for virtual classroom settings. As a design intern, I worked with three other interns and a project leader to design the layout of user interface and interactive functions to be implemented into the Smart Desk, an interactive desk for each user in the VR classroom.
Project • 1
The Smart Classroom project is part of Cyber-Archaeology Warehouse based in Qualcomm Institute-UCSD Division of Calit2 to create AR/VR experiences for virtual classroom settings. As a design intern, I worked with three other interns and a project leader to design the layout of user interface and interactive functions to be implemented into the Smart Desk, an interactive desk for each user in the VR classroom.
Project • 1
The Smart Classroom project is part of Cyber-Archaeology Warehouse based in Qualcomm Institute-UCSD Division of Calit2 to create AR/VR experiences for virtual classroom settings. As a design intern, I worked with three other interns and a project leader to design the layout of user interface and interactive functions to be implemented into the Smart Desk, an interactive desk for each user in the VR classroom.
Overview • 2
The Challenge
Create an immersive VR environment for students and professors to access 3D materials and lectures from multiple locations in real-time.
Enhance learning by offering live hands-on sessions that simulate real-world processes like CPR, surgery, and artifact extraction.
The Solution
Through research and iterative prototyping, our team has developed a highly engaging desk layout optimized for multiple users.
This design allows for interactivity, productivity, and incorporates various educational functionalities, resulting in a experience that promotes collaboration and learning.
Overview • 2
The Challenge
Create an immersive VR environment for students and professors to access 3D materials and lectures from multiple locations in real-time.
Enhance learning by offering live hands-on sessions that simulate real-world processes like CPR, surgery, and artifact extraction.
The Solution
Through research and iterative prototyping, our team has developed a highly engaging desk layout optimized for multiple users.
This design allows for interactivity, productivity, and incorporates various educational functionalities, resulting in a experience that promotes collaboration and learning.
Info • 3
My Role
A (UI/UX) design intern responsible for research, conceptualization, prototyping, design, and showcasing the prototype for exhibition
Team
2 UI/UX designers
2 3D modelers
(4 researchers)
1 team lead designer
Timeline
March 2023 - May 2023
Tools
Figma
Figjam
Unreal Engine’s UI (UMG)
Info • 3
My Role
A (UI/UX) design intern responsible for research, conceptualization, prototyping, design, and showcasing the prototype for exhibition
Team
2 UI/UX designers
2 3D modelers
(4 researchers)
1 team lead designer
Timeline
March 2023 - May 2023
Tools
Figma
Figjam
Unreal Engine’s UI (UMG)
Design Process • 4
Design Process • 4
01 Research & Findings
Week 1-4:
02 Ideation & Iterations
Week 5-8
03 Final Design
Week 9-11:
• Research
• User tests
• Persona
• Key Findings
• Sketches
• Ideation
• Iterations
• High-fidelity
Designs
• Integrations
• Final Design
01 Research & Findings
Week 1-4:
02 Ideation & Iterations
Week 5-8
03 Final Design
Week 9-11:
Research & Findings • 5
In pursuit of enhancing the user experience in virtual education, we conducted user interviews with UCSD college students and professors to evaluate Oculus VR apps like Horizon Workrooms, ShapesXR, and MeetinVR."
Usability Research & Testing
Usability Research & Testing
We ran four in-person usability tests to pinpoint user challenges, note down desired elements, and determine what features had enhanced the learning engagement in VR.
We ran four in-person usability tests to pinpoint user challenges, note down desired elements, and determine what features had enhanced the learning engagement in VR.
"I enjoyed the drawing space as it was convenient for taking notes. However, I eventually forgot how the whiteboard worked, and the interface wasn't very intuitive, making it difficult to find the shortcuts."
"I really appreciate that relevant buttons on the menu are highlighted in colors and have labels, making it easy to understand their functions."
"I believe there should be less physical motion required for discarding items, perhaps just a click of a button. It could be risky to swing your arm around when wearing a headset."
"I think it would be fantastic to have a storage box where other professors could bring their teaching materials into the classroom in real-time. For example, being able to pull a 3D object like an excavation artifact from a drive into the virtual space."
Research & Findings • 5
In pursuit of enhancing the user experience in virtual education, we conducted user interviews with UCSD college students and professors to evaluate Oculus VR apps like Horizon Workrooms, ShapesXR, and MeetinVR."
Usability Research & Testing
We ran four in-person usability tests to pinpoint user challenges, note down desired elements, and determine what features had enhanced the learning engagement in VR.
"I enjoyed the drawing space as it was convenient for taking notes. However, I eventually forgot how the whiteboard worked, and the interface wasn't very intuitive, making it difficult to find the shortcuts."
"I really appreciate that relevant buttons on the menu are highlighted in colors and have labels, making it easy to understand their functions."
"I believe there should be less physical motion required for discarding items, perhaps just a click of a button. It could be risky to swing your arm around when wearing a headset."
"I think it would be fantastic to have a storage box where other professors could bring their teaching materials into the classroom in real-time. For example, being able to pull a 3D object like an excavation artifact from a drive into the virtual space."
Key Findings
01 Discoverability
01 Discoverability
Some users encountered difficulties when trying to find features. There was no way to revisit the tutorials from the menu, and they often forgot how certain functions worked.
Some users encountered difficulties when trying to find features. There was no way to revisit the tutorials from the menu, and they often forgot how certain functions worked.
02 Interactivity
02 Interactivity
Users preferred minimal movement requirements for accessing objects or toggling items. They found it easier to work when the interface was well-organized and readily accessible.
Users preferred minimal movement requirements for accessing objects or toggling items. They found it easier to work when the interface was well-organized and readily accessible.
03 Immersive Experiences
03 Immersive Experiences
Users noted that they felt most engaged when their experience resembled an actual classroom setting. This included taking notes by typing or writing on a virtual whiteboard. They appreciated having 3D objects appear in front of them, enhancing the sense of immersion.
Users noted that they felt most engaged when their experience resembled an actual classroom setting. This included taking notes by typing or writing on a virtual whiteboard. They appreciated having 3D objects appear in front of them, enhancing the sense of immersion.
User Persona
Background
• A history & archaeology professor
• Taught over a decade and is eager to explore new ways to
engage students in the learning process
Background
• A history & archaeology professor
• Taught over a decade and is eager to explore new ways to
engage students in the learning process
Goal
• Incorporate VR technology effectively into her history and
archaeology classes.
• Find a VR platform that offers engaging and safe learning
experiences.
• Explore new ways to make historical artifacts and concepts
come to life in the classroom.
Goal
• Incorporate VR technology effectively into her history and
archaeology classes.
• Find a VR platform that offers engaging and safe learning
experiences.
• Explore new ways to make historical artifacts and concepts
come to life in the classroom.
Stephanie, 40 year-old professor
Stephanie, 40 year-old professor
Ideation & Iteration• 6
Ideation & Iteration• 6
Low-Fidelity Sketches
Low-Fidelity Sketches
Low-Fidelity Sketches
Following our user research and findings, we worked together to draw out different concepts and ideas to be integrated into the smart desk!
Following our user research and findings, we worked together to draw out different concepts and ideas to be integrated into the smart desk!
Following our user research and findings, we worked together to draw out different concepts and ideas to be integrated into the smart desk!
Ideation
Ideation
Design Inspiration:
We drew inspiration from various sources, including articles on skeuomorphism, to inform our design. By referencing articles and media online, we were able to shape the visual aesthetics and overall look of the project.
Design Inspiration:
We drew inspiration from various sources, including articles on skeuomorphism, to inform our design. By referencing articles and media online, we were able to shape the visual aesthetics and overall look of the project.
Brainstorming:
We brainstormed and refined a range of innovative features to enhance the learning experience in a virtual classroom, such as shared drawing spaces, chat functionality, and personalized options .
Brainstorming:
We brainstormed and refined a range of innovative features to enhance the learning experience in a virtual classroom, such as shared drawing spaces, chat functionality, and personalized options .
Iteration
Iteration
We worked on several iterations for the Smart Desk, including the widget icons to match the neumorphic style we wanted to achieve. We experimented with different styles to mimic the 3D buttons and it being pushed in.
We worked on several iterations for the Smart Desk, including the widget icons to match the neumorphic style we wanted to achieve. We experimented with different styles to mimic the 3D buttons and it being pushed in.
Final Design• 7
Final Design• 7
High-Fidelity Design
High-Fidelity Design
High-Fidelity Design
For our last iteration of the smart desk, we developed distinct pages that align with specific project features, all presented in a Neumorphic design.
For our last iteration of the smart desk, we developed distinct pages that align with specific project features, all presented in a Neumorphic design.
For our last iteration of the smart desk, we developed distinct pages that align with specific project features, all presented in a Neumorphic design.
High-fidelity designs of the pages with different functionalities.
High-fidelity designs of the pages with different functionalities.
default
default
default
hover
hover
hover
pressed
pressed
pressed
The final design of the buttons in the default, pressed, and hovered state.
The final design of the buttons in the default, pressed, and hovered state.
Some highlights of our project:
Personal Storage
Files are saved here and can be accessed in any meeting. Users can upload files, such as 3D objects, from here to the meeting storage for sharing
Meeting Storage Files
Users can download files to their personal storage for individual use and export them externally. Users can easily switch between personal and meeting storage.
Personal Storage
Files are saved here and can be accessed in any meeting. Users can upload files, such as 3D objects, from here to the meeting storage for sharing
Meeting Storage Files
Users can download files to their personal storage for individual use and export them externally. Users can easily switch between personal and meeting storage.
Drawing and Writing Whiteboard
• Users can engage with a whiteboard by physically
. writing or drawing, creating an immersive note-
taking experience
Drawing and Writing Whiteboard
• Users can engage with a whiteboard by physically
. writing or drawing, creating an immersive note-
taking experience
Integration to Unreal Engine on VR
Integration to Unreal Engine on VR
Picture from Oculus VR Smart Classroom
Picture from Oculus VR Smart Classroom
The final design integrates a collaborative experience that enables students and professors to engage within a virtual classroom environment. It facilitates real-time connections among individuals in various locations, enhancing the immersive learning experience.
The final design integrates a collaborative experience that enables students and professors to engage within a virtual classroom environment. It facilitates real-time connections among individuals in various locations, enhancing the immersive learning experience.
Lessons Learned • 8
Lessons Learned • 8
Reflection
This project has been a truly enriching experience that has deepened my passion for emerging technology and the world of UI/UX design. It provided me with a unique opportunity to not only enhance my design and research skills but also to explore entirely new dimensions of user engagement within a VR setting.
Throughout this journey, I discovered the immense potential and challenges associated with creating immersive experiences in virtual reality. It demanded a shift in my thinking, as I had to consider not just the visual aesthetics and usability but also the psychology of user engagement in a completely different context.
Experiences on different devices
An important lesson from VR design is the paramount importance of user comfort and safety. Excessive text and complex interfaces can induce motion sickness. Prioritizing simplicity and clarity is vital, as "less is more" holds true in VR, where users are often in constant motion, necessitating an interface that adapts to their movements.
Reflection
This project has been a truly enriching experience that has deepened my passion for emerging technology and the world of UI/UX design. It provided me with a unique opportunity to not only enhance my design and research skills but also to explore entirely new dimensions of user engagement within a VR setting.
Throughout this journey, I discovered the immense potential and challenges associated with creating immersive experiences in virtual reality. It demanded a shift in my thinking, as I had to consider not just the visual aesthetics and usability but also the psychology of user engagement in a completely different context.
Experiences on different devices
An important lesson from VR design is the paramount importance of user comfort and safety. Excessive text and complex interfaces can induce motion sickness. Prioritizing simplicity and clarity is vital, as "less is more" holds true in VR, where users are often in constant motion, necessitating an interface that adapts to their movements.
Copyright © 2024 by Sandy Vo • Made with Framer & lots of coffee • Thanks for visiting my portfolio!