.png)
.png)
VR Starter Kit: Igniting Design Students' Creativity Through Gamified, Multimodal VR Onboarding
Students are interested in using VR as a creative tool, but learning on their own isn’t easy. The school invested in headsets, yet they remain unused.
Pratt Institute School of Design invested in VR headsets for students to borrow and use. However, they remain unused because students face challenges in getting started. This VR starter kit project aims to help creative students explore VR.
.svg)
.svg)
.svg)
I created a hands-on, multimodal tutorial experience where students learn VR prototyping by creating their own virtual portfolio exhibition
This VR starter kit project was created to help creative students explore VR, as many don’t take advantage of the school's available headsets due to the challenges of getting started.
Website
VR Tutorial Demo
The tutorial must be self-guided and was limited by Google Sites' functionality.
Due to limited department staff availability, the VR tutorial must be self-guided, requiring no staff assistance during the learning process. Also, we utilized the platform available at Pratt Institute to avoid additional costs for the website. However, Google Sites had limitations in functionality and design flexibility.
We researched how VR can be integrated into students' creative processes and identified the most suitable VR creative tools to teach for beginners.
First, we aimed to select the VR creative apps to introduce to students. To do so, we researched 33 VR-related tools and understand how VR could enhance students' creative processes across diverse student fields and which VR tools would be the most accessible and effective starting points.
As a result of our research, we chose ShapesXR and Gravity Sketch as the VR tools to cover in our tutorials. During the design phase, I focused on teaching ShapesXR, while my coworker focused on Gravity Sketch.
How might we teach design students to use ShapesXR and inspire further exploration through quick, engaging tutorials tailored to their interests?
Designing the first version with 4 key approaches
After identifying the VR tools to teach during the research phase, I designed the tutorial. The initial iteration of the tutorial was guided by the following 4 key approaches across the following areas.
Inspire and engage design/art students through portfolio exhibition building experience.
The tutorial is about creating a life-sized 3D exhibition space where students can import and showcase their work. I aimed to tailor the tutorial to design/art students, aligning with their interests and making it relevant and engaging. Since portfolios are a common interest among them across various creative disciplines, I chose this prompt.
Use website and VR formats for a seamless, immersive, multimodal learning experience.
I used both a website and VR for the tutorial. Google Sites serves as the entry point, providing written and video instructions for steps students need to complete on their computer, such as account setup. For the main instructions, I created a ShapesXR tutorial space inside VR, as students cannot easily access the website while wearing a headset. They can duplicate & use this sample space, which includes step-by-step audio and written instructions on VR.
.svg){kind=icon}
%20(1).png)
Seamless and structured learning experience
The experience consists of setting up (Website & VR), practicing basic feature (VR), and exhibition building (VR). By gathering all the website setup tasks first, I aimed to create a seamless transition from the website to VR, minimizing the need to switch between devices. Additionally, by separating the practice and exhibition building phases, I designed the tutorial to encourage students to take breaks in between phases and maintain focus.
Design an inspiring and functional VR space that guides users along the intended path.
I designed the space to enhance onboarding both functionally and aesthetically. To ensure a clear instructional flow without confusion, I got inspiration from museums, where space guides visitor movement. Also, since students may not know how to move at first, I placed key instructions within their immediate view, requiring no movement. Aesthetically, I created a museum-like environment and incorporated yellow, Pratt Institute’s primary color, to align with the stakeholder’s branding.
.png)
Testing revealed the tutorial felt too long and overwhelming. Students often strayed from the intended order and got stuck.
I conducted the first round of testing with 3 students. I asked them to explore the tutorials on their own, as if they were learning independently, and observed their behavior. As a result, I gathered the following insights.
The average time on task was 91.7 minutes. While this was within our planned timeframe, participants felt that the experience was too long and overwhelming due to the many steps.
While we expected users to browse the website from top to bottom, 2 out of 3 participants explored the website non-linearly—jumping back and forth and skipping steps that were prerequisites for later actions. They also put on the headsets before completing the setup on the website.
How might we improve the tutorial to make it feel shorter, and less confusing for students who tend to consume information nonlinearly?
Shortened the page by making some steps optional and moving them to separate pages
To make the website shorter, I made the less important steps, such as the Figma import step optional. Applying progressive disclosure, I moved the optional steps to subpages. I also removed explanations that are covered in the VR version of the tutorial from the website, as participants found VR one more intuitive. As a result, I shortened the main page by more than 50%.
.png)
.png)
Improved the stepper and let students use the VR headset earlier to encourage them to follow the intended flow
The tutorial required a specific step order, but students were unaware of this. It was also hard for them to tell which step they were on within the website and which device to use to complete the step (PC or VR). To fix this, I made the stepper clearer and added tags indicating which device to use for each step.
.png)
.png)
I had originally included all the PC setup steps at the beginning to ensure a seamless transition from the website to VR. However, many students were eager to use the VR headset immediately, and the long setup caused frustration and disrupted the intended flow. To fix this, I kept only the essential steps upfront and moved the rest later, allowing students to start using the VR headset 15 minutes earlier.
Gamify the practice phase to make the tutorial engaging and keep students' attention.
In ShapesXR, it is essential to learn basic features like teleporting, grabbing, and transforming objects before starting to create. That is why I included a practice step. However, the original practice was monotonous. It simply explained each feature and asked students to try it on their own. As a result, it felt overwhelming, long, and boring.
.png)
To improve this, I designed 3 mini-games that allow students to practice in a more interactive way. My goal was to maintain their attention and make the learning experience more enjoyable.
Website
VR Tutorial Demo
I successfully made the tutorial feel shorter and more engaging. It broadened students’ perspectives on VR and increased their interest in using it.
I conducted round 2 testing with 4 participants. The average time on task was 91.5 minutes, nearly the same as our initial design. However, all participants gave positive feedback on the tutorial length, suggesting the learning experience was engaging.
(Round2 Testing)
(Round2 Testing)
Testing showed that the tutorial broadened participants' understanding of VR and increased their interest in using it for their creative process, meeting the initial goals.
"I would encourage other designers to try out the VR tutorial."
"The tutorial made me more interested in borrowing a VR headset for my coursework or my own design explorations"
The tutorial was launched at Pratt Institute and made available to headset borrowers.
The tutorial was launched at Pratt Institute and made available to headset borrowers. We attached a flyer to each headset box to inform users about the tutorial. While we are still waiting for data on its impact, such as borrowing numbers and user feedback, our key stakeholder, the Chair of the School of Design, expressed satisfaction with our work.
I would incorporate opinions from students in different fields of study earlier.
As we conducted more testing, I received feedback from students in 3D-related majors such as interior design. They noted VR's limitations in reproducing material textures, which are essential in their fields. I realized their expectations for VR were higher than we thought.
I chose the VR portfolio exhibition prompt because creating portfolios is a common interest among students. However, user feedback made me realize that this prompt may have carried the assumption that ShapesXR is suitable for the final stage of the creative process and that VR can deliver high-quality rendering.
If I were to do this project differently, I would define our user groups at a more granular level and conduct interviews in the research phase to explore more suitable prompts. This experience reinforced the importance of involving users early in the design process.
%20(2).jpeg)
.jpeg)
Journey map
We also created the journey map.
Style Guide
We made a style guide to keep the consistency of the product.
We prioritized the issues identified during testing and refined our design to address the critical ones.
After finding 47 issues, we sorted and prioritized the issues to maximize improvements within a limited timeframe. We considered factors such as how many participants encountered the same issue and whether the issue impacted key or subsequent steps. (I applied my knowledge gained from work experience as a software developer here!)
.png)
.png)
%20(1).png)
%20(1).png)
