Abstract

This project was completed as part of my Interactive Design course, where I was tasked with creating a data-driven experience using a minimum of 100 data points. I chose to explore the diverse world of footwear by visualizing the types of shoes people wear on a given day, including data on brand, style, material, color, price, condition, and weather. The outcome was an engaging and interactive 3D web experience designed to help users explore trends and patterns in shoe choices.

The Challenge

Designing an interactive and informative data visualization posed several key challenges:

  • Collecting and analyzing detailed data from at least 100 individuals within a short timeframe.

  • Creating a visually compelling and user-friendly experience that communicates insights effectively.

  • Integrating 3D interaction in a way that feels intuitive and enhances data exploration.

  • Designing a responsive site that works across multiple platforms, including virtual environments.

My Role

I served as the sole designer, researcher, and developer on the project. My responsibilities included:

  • Conducting user research and collecting data

  • Analyzing and organizing data for visualization

  • Designing UX wireframes and UI elements

  • Developing a 3D interactive experience using Spline

  • Testing and refining the design based on user feedback

Timeline

The project spanned 4 weeks, each focused on a specific phase of the design process:

  • Week 1: Data collection and analysis

  • Week 2: Wireframing and prototyping

  • Week 3: 3D design and development

  • Week 4: Usability testing and iteration

Defining Project Goals

The high-level objectives of the project included:

  • Data Visualization: Create an immersive and interactive experience to explore shoe-related data.

  • Trend Analysis: Reveal patterns in footwear choices influenced by style, brand, weather, and other variables.

  • Usability: Design a platform that is both accessible and easy to navigate, including considerations for VR interaction.

Constraints

Several limitations shaped how I approached the project:

  • Time Constraints: Gathering 100 complete data entries required quick outreach and streamlined collection methods.

  • Limited VR Knowledge: Since the project touched on virtual interaction design, I needed to rapidly research and understand best practices in spatial UI.

  • Technical Complexity: Integrating 3D interactivity added layers of complexity, from navigation design to performance optimization.

Research & Data Collection

I surveyed 100 participants, gathering data on the following variables:

  • Brand

  • Style

  • Material

  • Color

  • Price

  • Condition

  • Weather on the day of wear

This comprehensive dataset enabled the visualization to surface rich trends, such as seasonal preferences or brand popularity under specific weather conditions.

I also conducted background research on spatial and 3D interaction design to ensure a smooth experience within the chosen platform.

Wireframes and Initial Mockups

Early wireframes were designed to structure the user journey, focusing on:

  • Clear navigation paths within a 3D space

  • Layered data presentation to avoid cognitive overload

  • Responsive layouts that translated from desktop to immersive environments

Build & Design

3D Interactive Design

I used Spline to build a dynamic 3D environment where users could explore the dataset interactively. Users navigate through different "bento box" data zones, each revealing a different aspect of the dataset.

UI Design

  • Designed and prototyped interface elements in Figma and Adobe XD

  • Created clean, readable typography and interactive cues for intuitive navigation

  • Ensured responsive behavior across screen sizes and devices

Data Visualization Features

  • Interactive hover states provide detailed insights on each data point

  • Color coding and iconography clarify categories like shoe condition and weather influence

  • Smooth transitions between sections guide exploration

Usability Testing

To validate the user experience, I conducted usability tests with 5 participants of varying familiarity with data visualizations and 3D tools.

Key Findings

  • All participants successfully navigated and interacted with the visualization

  • Some found the 3D controls confusing on first use

  • Users requested richer detail when hovering over data points

Improvements Made

  • Simplified navigation and added an onboarding tutorial for first-time users

  • Enhanced hover interactions to include more descriptive data labels

  • Streamlined the UI to improve responsiveness and loading performance

High-Fidelity Design

The final high-fidelity prototype offered an immersive yet simple way to explore a complex dataset. Users could intuitively explore shoe preferences influenced by style, price, and environmental factors—all in an engaging spatial interface.

Closing Thoughts

This project was a deep dive into interactive data visualization and spatial UI design. It pushed me to learn new tools, balance aesthetics with usability, and build a project that turns raw data into a compelling user experience.

The combination of user feedback, iterative design, and emerging technology made this an exciting and educational challenge.

What I Learned

  • Detail-Oriented Research: Quality visualizations begin with intentional, structured data collection.

  • User Testing is Crucial: Iterative feedback helped me refine confusing elements and uncover new opportunities for improvement.

  • 3D Environments Have Power: Spatial design can elevate engagement when used with clear purpose and intuitive interaction patterns.