pictoblox

Designing a Gateway to Immersive Tech: The 3D & XR Experience

COMPANY

STEMpedia

ROLE

UI/UX Designer

EXPERTISE

UI/UX Design

YEAR

2023-Present

  • Product Workshop

  • Design System

  • Desktop App

  • Web App

  • User Testing

  • User Testing

  • UX Research

  • Market Research

Project Overview

Project Overview

Project Overview

Project Overview

For this project, I designed an intuitive platform that empowers students aged 12 and above to create immersive 3D, AR, and VR experiences. The goal was to make advanced technology accessible and fun for young creators, while also providing schools and institutions a robust tool for engaging students in creative learning.

Our customers are schools and educational institutions, while our consumers—the students—are the ones engaging with the platform directly. The goal was to create an easy-to-use yet powerful tool that would meet the demands of both these groups, providing schools with advanced, educational tools and giving students an exciting, intuitive learning experience.

Key Features

  • Build 360° environments easily.

  • Create interactive 3D models with advanced physics simulation and animations.

  • Export projects to devices like Google Cardboard and Meta Quest.

Understanding User Engagement: The Product Funnel

Understanding User Engagement: The Product Funnel

Understanding User Engagement: The Product Funnel

Understanding User Engagement: The Product Funnel

In this case study, I’ll take you through the journey of designing PictoBlox’s 3D & XR Studio, aligning it with the Product Funnel—a framework used to understand the stages of a user's interaction with a product. Each stage helps inform design decisions, ensuring that we address the needs and expectations of users and business stakeholders.

Awareness: Identifying the Need

Awareness: Identifying the Need

Awareness: Identifying the Need

Awareness: Identifying the Need

The first stage of the Product Funnel is identifying the need. Through user & market research, it became clear that existing educational tools didn’t offer advanced features like physics simulations or animations. This gap limited students’ ability to create dynamic and immersive projects.

Designing the platform focused on addressing this unmet need, providing students with the tools to unleash their creativity in 3D, AR, and VR.

This slide deck presents a comprehensive comparison between leading 3D and XR platforms for education, highlighting the key gaps in features and functionality.

Interest: Researching User Needs

Interest: Researching User Needs

Interest: Researching User Needs

Interest: Researching User Needs

Once the need was identified, the next step was generating interest. I conducted surveys and interviews with both students and educators to discover what features would capture their attention and keep them engaged.


Key Insights from User Research:

Desire for Interactivity

Students wanted to create projects that were not just static but interactive and engaging.

Need for Instant Feedback

Immediate visual feedback was crucial for maintaining motivation and encouraging experimentation.

Complexity of Current Tools

Many tools were seen as overly complicated, making it difficult for students to get started.

Lack of Advanced Features

Users expressed a need for features like physics simulations and advanced animations to enhance their projects.

Accessibility and Support

Educators emphasized the importance of tutorials and guides to help students navigate the platform.

These findings shaped the user experience, ensuring the platform was both feature-rich and easy to use.

Consideration: Designing the Solution

Consideration: Designing the Solution

Consideration: Designing the Solution

Consideration: Designing the Solution

In the consideration stage, my primary goal was to design a platform that not only meets but exceeds user expectations, offering a rich and engaging experience. I prioritized the features using the MoSCoW framework to ensure essential tools are delivered in a phased approach:

⭐️

Connect to Content

Add layers or components to make infinite auto-playing slideshows.

Now, let me walk you through my design process, showcasing key artifacts like the sitemap, user flows, sketches, wireframes, and high-fidelity screens that emphasize a seamless and user-friendly experience.

Intent: Testing and Iterating

Intent: Testing and Iterating

Intent: Testing and Iterating

Intent: Testing and Iterating

To refine the platform, we moved into the intent phase, conducting usability testing with students and teachers from over five schools, including 25 students and six teachers. This process was crucial for gathering actionable feedback on various aspects of the platform.

Key Improvements Based on Feedback:

Icon Redesigns

We simplified the icons for better navigation and clarity, ensuring students could find what they needed quickly.

Screen Proofing

We tested the terminology and wording used throughout the software, changing complex physics terms to make them more understandable for young learners.

Improved Animation Flow

We refined the animation flow, ensuring smoother transitions that kept users engaged throughout their creative process.

New Features Added

Based on user feedback, we introduced tools like sketch, extrude, and boolean operations, enabling students to create more complex shapes with ease.

Expanded Low Poly Library

To provide users with more resources, we expanded the low poly model library, giving students a variety of options to incorporate into their projects.

These updates not only improved usability but also empowered students to push the boundaries of their creativity.

⭐️

Connect to Content

Add layers or components to make infinite auto-playing slideshows.

Conversion: Bringing Projects to Life

Conversion: Bringing Projects to Life

As we reached the conversion stage, students were able to easily bring their 3D creations to life. With just a few clicks, projects could be exported to VR devices like Google Cardboard, making the transition from idea to immersive reality seamless.

⭐️

Connect to Content

Add layers or components to make infinite auto-playing slideshows.

⭐️

Connect to Content

Add layers or components to make infinite auto-playing slideshows.

Loyalty: Measuring Success

Loyalty: Measuring Success

Loyalty: Measuring Success

Loyalty: Measuring Success

The platform quickly resonated with users, leading to impressive outcomes:

  • Over 200 AR/VR projects created within the first few months.

  • A 25% increase in student engagement, reflecting a deeper interest in creative learning.

  • 80+ schools expressed interest in using PictoBlox 3D and XR Studio to teach students.

  • GESS Education Award 2023 in the AR/VR and XR Startup Category, recognizing our innovative approach.

  • Secured funding from investors, highlighting the platform's potential for growth and impact.

Advocacy: Looking Forward

Advocacy: Looking Forward

Advocacy: Looking Forward

Advocacy: Looking Forward

After the success of PictoBlox 3D and XR Studio, we are excited to take the next steps:

  • Enhancing Features: We aim to include more advanced 3D modeling tools and improve 3D animations to provide users with even greater creative capabilities.

  • Launching a Junior Version: We plan to launch a simplified version specifically designed for kids aged 8-11 years, featuring basic tools that make 3D modeling and coding accessible and fun.

Our commitment to inspiring young creators continues, and we look forward to expanding our impact in the educational technology space.