StudioSIAT Motion Capture Library
An open-access mocap database for all users
Overview
Our team of three created a motion capture library platform for StudioSIAT at SFU. The studio had just introduced motion capture equipment and wanted an open-access database for users of this data. The project focused on developing a centralized platform for StudioSIAT staff to upload and organize assets, as well as for students and researchers to browse, preview, and download files for their own projects. We covered user research, wireframing, and style guide creation to ensure a scalable user experience.
Problem
Solution
Our team designed a motion capture library that provided clear categorization and easy access to assets, while ensuring consistency through alignment with SFU’s styleguide. By applying a unified design system, we created an interface that was both functional and visually cohesive, making the library scalable and accessible for all users.
Process
Ideation
User Research
Design
Reflection
Role & Team
UX/UI Designer
3 UX Designers
1 Prodcut Manager
Tools
Figma
Zoom
Timelie
10 Weeks
Ideation
User Research
Design
Reflection
Ideation
What's Motion Capture?
Motion capture (mocap) is a technique that records human movements and translates them into digital data for animation, film, and research. StudioSIAT had recently introduced mocap equipment and saw the need for a centralized platform to store, organize, and share the captured data. The goal of our project was to design an open-access mocap library that would make these assets freely available to students and researchers, while providing studio staff with an efficient way to upload and manage files.
Case Study
Since there were very few direct references for building a motion capture data library, we expanded our research to previous platforms. One key case study was Adobe’s family of creative apps and websites, which offered useful inspiration for organizing and delivering large amounts of content. We analyzed features such as update notifications, in-app tutorials, search filters, and content categorization, and identified parallels that could be applied to our project. These insights helped us envision how similar interaction patterns—such as filtering, previewing, and structured navigation—could support users in efficiently browsing and learning from motion capture assets.
User Research
Interview
To understand the direction of our interaction design solution, we first conducted a one-hour interview and two-hour workflow observations with owner Lucas and employee Debbie. This interview allowed us to gain insights into their customer pain points.
In-Person Workshop
We conducted a two-hour in-store observation session with two team members, focusing on interactions involving customers and store employees during dog drop-offs and pick-ups. Through this field observation, we gained valuable insights into the customer flow dynamics within the store environment.
We found that:
• Appointments: All appointments are written on an appointment book
• Price Setting: Dog owners know the final price when they pick up
• Pet snacks: One customer purchased pet snacks, which is a trial sale
Persona
Through interviews and field observations, we engaged in extensive discussions to outline potential solutions to the problems identified. This collaborative effort allowed us to brainstorm various approaches.
After careful consideration, we narrowed our focus to two key areas: the in-store interaction process and customer information presentation.
HMW
How Might We Visualize Grooming Process Information…
Visualizing the pet grooming process information to replace the current oral-based store-customer communication model. We aims to establish a standardized and efficient information display method, offering customers a more intuitive pet grooming experience.
Design
Userflow
After determining the "How Might We" (HMW) questions, we organized a participatory workshop to gather more suggestions for solutions.
We invited 12 participants, aged 20 to 40, to learn about our project and share their opinions through three activities: Role-Play, Brainstorming, and the Impact/Effort Matrix.
These activities helped us gain valuable insights and ideas for addressing the identified design challenges and confirmed our final design focus.
Wireframe
We asked our workshop participants to place themselves in a conversation between a customer looking for information about bathing service and a store employee having information about grooming services.
Participants were grouped into pairs to engage in conversation as customers and store employees. Each character has a card containing necessary information about their role.
Brainstorm
Six participants were asked to come up with at least three design solutions and the corresponding problems they wanted to solve within 15 minutes.
Each participant is encouraged to share their thoughts with other workshop members to spark further discussion and thinking.
Impact/Effort Matrix
All participants were invited to place their solutions on the matrix based on their potential impact and the effort required to achieve them. They were also asked to share their rationale for identifying them. Here is the digital version of how we organized their ideas after the workshop.
Final Design Focus
Concentrate on enhancing customer understanding of grooming service contents and setting expectations by redesigning the visualization of the service list.
Visual Design
In our visual design phase, we ensured all design elements aligned with the client's brand identity. This involved using the colours from the Okie Doggie Pet Salon logo as the primary palette for our design work. By maintaining a consistent colour scheme, we reinforced brand recognition and created a cohesive visual experience across all touchpoints.
Iteration
The iterative process was vital in refining our solution. Starting with initial prototypes, we tested and reviewed them with Lucas, the store owner, receiving valuable feedback that guided our design adjustments. Participatory workshops with volunteers further enriched our understanding, helping us address specific issues and improve the overall user experience. Each iteration brought us closer to a design that meets customer needs and business goals, resulting in an efficient and user-friendly appointment system.
DELIVER
Final Design
Here are the final screens for Okie Doggie Solutions
Onboarding Mible APP Page
Service List(Mobile)
Reservation Page (Mobile)
Home Page in Tablet
Service List(Tablet)
Art Gallery Present(Tablet)
Reflection ：
01 - Research Constraints :
We faced constraints during our research phase. Although we prepared an online questionnaire, we couldn't implement it for specific objective reasons, so we couldn't use that data.
02 - Limited Visual Design :
Our visual design process involved minimal discussion and options. We primarily based our design on the client's logo colour scheme, resulting in a straightforward, brand-consistent design.
03 - Future Opportunities :
Given the opportunity, we would enhance the backend reservation system to help the client attract more customers and streamline their operations. This would provide a more comprehensive and efficient solution for the business.
© Yan Wei. 2025
User Experience Designer