CM-You Board
David and Susan Coulter Welcome Center
I led the tangible design and prototyping of the CM-You board, an interactive table for prospective students and families to explore Carnegie Mellon University and Pittsburgh based on their interests and receive personalized recommendations. I was also responsible for the concept video production and the space design, and conducted user research and generative user workshops.
Objective
How might we highlight CMU's unique educational opportunities and Pittsburgh's vibrant community environment to foster feelings of belonging among prospective students and their families?
Outcome
The CM-You board, a tangible, interactive table for prospective students and families to explore CMU and Pittsburgh based on their interests and receive personalized recommendations.
Main Features
Main Interactions
1.
Project Background
What is our client's core requirement?
The David and Susan Coulter Welcome Center, located in the David A. Tepper Quadrangle, opened to the public in the fall of 2018. As a starting point for campus tours, the space is often the first in-person point of contact between prospective students and their families and Carnegie Mellon University. The Welcome Center's mission is to showcase CMU's culture and character to visitors through spatial layout, visual presentation, use of technology, and human interaction, to help prospective students and their families understand what makes the university unique, and to inspire their vision of being a part of CMU.
Although the Welcome Center has fulfilled its essential function over the past five years, they believe that there is a certain disconnect between the current way the space is used and the original design intent. In particular, there is room for improvement in telling the story of the university, building an emotional connection with visitors, and showcasing the university's culture and brand.
To optimize this critical touchpoint, the Welcome Center approached us with the following core requirement:
Expressing Carnegie Mellon University’s culture, brand, and hospitiality in a way that fosters feelings of belonging in prospective students and their families.
In response to the client's needs, our team focused on the following tasks:
1. Dig deeper into the Welcome Center's needs and their expectations for brand, culture, and belonging.
2. Understand the needs, emotions, and behaviors of potential students and their families as target users.
3. Synthesize research insights to propose achievable design goals and create solutions that meet needs.
User Research
Understand the real needs and concerns of prospective students and their families.
campus tour observation
User interview
Through observation of campus tours and in-depth interviews with prospective students and their families, we found that
University Research
Identify the key brand values and messages CMU wants to communicate
Social analysis
Competitor analysis
Brand analysis
By conducting brand analysis, social analysis, and competitor analysis, we discovered that
Uniqueness Research
Uncover "what's so CMU" through a co-design workshop
Research Method
Participants:
• 20 undergraduate students from various academic years and majors (refer to the charts for detailed demographic breakdown).
Activity:
• Students were asked the question: “What’s so CMU?”
• They were provided with a variety of images and materials to create a collage that represented CMU’s academic, extracurricular, and social aspects based on their personal experiences.
• After completing their collages, students shared their thoughts and explained the messages they wanted to convey.
Participants' years
20 participants in total
Participants' majors
80% of participants major cross disciplines
Collage notes and synthesis
Through the analysis of participants’ collages and their accompanying reflections, several key themes emerged in response to the question, “What’s so CMU?” Participants emphasized their connection with Pittsburgh, core academic strengths, the demanding academic workload, hands-on learning opportunities, and so on. Among these, two recurring themes stood out as defining aspects of the CMU experience:
Synthesizing Research into Design Strategy
Through the research process, we identified significant overlaps between the findings of the three research areas, which became the foundation of our design goals:
Design objective
How might we highlight CMU's unique educational opportunities and Pittsburgh's vibrant community environment to foster feelings of belonging among prospective students and their families?
2.
Eight Initial Design Concepts
During the ideation phase, we developed eight preliminary concepts for potential interventions. To gather early feedback and validate our ideas, we conducted a speed dating session, allowing us to evaluate each concept quickly.
Experience Prototyping
Based on insights from the speed dating session, we narrowed our focus to three design concepts. These were further explored through experience prototyping methods, including wireframing, puppet play, and full-body prototypes. These prototypes provided valuable opportunities to simulate interactions and gain a deeper understanding of the prospective students’ and families’ experiences.
Client Presentation and Final Concept
Design solution
The CM-You board, a tangible, interactive table for prospective students and families to explore CMU and Pittsburgh based on their interests and receive personalized recommendations.
User Journey: Explore CMU and Pittsburgh on an Interactive Table
The user journey of the CM-You Board includes three phases:
Discovery: Users are introduced to the CM-You Board through engaging wall projections and an instructional banner that provide an overview of the experience. An onboarding animation guides them on how to interact with the system.
Exploration: Users engage with seven CMU-themed pawns and three Pittsburgh-specific pawns, placing them on the interactive table to trigger content showcasing CMU’s academic, cultural, and community offerings, as well as Pittsburgh’s unique highlights.
Reflection: The journey concludes with users receiving a personalized souvenir card, summarizing their exploration and providing a unique code to continue their journey online, extending the experience beyond the Welcome Center.
Discovery
Step Into the Experience
Immerse yourself in our world with large, wall-projected animations.
Engage with a Gesture
Master simple gestures with easy-to-follow instructions at the table.
Exploration
Choose Your Path
Choose a red pawn for CMU schools or a yellow pawn for Pittsburgh’s lifestyle.
Explore Your Passion
Rotate your CMU pawn to explore majors that spark your curiosity.
Discover Student Stories
Push your pawn to reveal student projects, with images and videos.
Reveal Cross-Disciplinary Connections
Place two CMU pawns together to unlock collaborative projects across disciplines.
Connect with City Life
Pair a Pittsburgh pawn with a CMU pawn to explore city life tailored to your interests.
Reflection
Revisit Your Journey
Print a personalized card with must-see spots at CMU and Pittsburgh. Use the unique code to revisit your custom CM-You board online anytime.
Design Challenge 1
How to redesign the space of the welcome center
Problem Identification: Fragmented and Ambiguous Space Usage
Through our spatial analysis, we identified several issues with the existing Welcome Center layout:
Redundant and Confusing Reception Areas: The Welcome Center is divided into two separate areas: the main space and the secondary space. However, both currently function as reception desks, leading to redundancy and confusion.
Disjointed Spatial Experience: A physical wall completely separates the two spaces, preventing natural movement between them and disrupting the continuity of the visitor experience.
Lack of Clear Boundaries Between the Welcome Center and Public Spaces: The boundary between the Welcome Center and surrounding public areas is not well-defined. As a result, current students sometimes occupy the secondary space, reducing its availability for those intending to use it as part of the Welcome Center experience.
Design Solution: Creating a Cohesive and Functional Space
To address these challenges, we implemented a clear spatial organization and enhanced connectivity between the two areas:
Establishing Spatial Continuity: A curved carpet design extends across the entire Welcome Center, visually and physically connecting the two previously separate spaces. This carpet not only unifies the two sections but also helps guide visitor flow, creating a more intuitive and seamless experience.
Defining Functional Zones: The left side is designated as the Reception & Meeting Area, providing a dedicated space for visitor check-ins and informal gatherings. The right side is transformed into an Interaction & Exploration Area, where prospective students, families, and other visitors can engage with interactive displays to learn about CMU’s culture, history, and core values while waiting for their campus tour.
By implementing these design changes, we created a more intuitive, unified, and engaging environment, ensuring that visitors experience the Welcome Center as a cohesive and inviting space rather than two disconnected areas.
Design Challenge 2
How to design the onboarding experience
Problem Identification: Introducing Users to a New Interaction Paradigm
Unlike familiar touchscreen devices such as smartphones or tablets, the CM-You Board—an interactive table with physical pawns—is an unfamiliar interface for most visitors. Without proper onboarding, users might struggle to understand how to interact with the system effectively.
To ensure a seamless experience, we needed to design a multi-layered onboarding process that guides users at different touchpoints, progressively helping them understand how to use the interactive table and pawns.
Design Solution: A Multi-Layered Onboarding System
We developed a three-tiered onboarding approach that provides instructions across multiple modalities, places, and moments in the user journey. This ensures that visitors receive continuous guidance from the moment they approach the interactive table until they fully engage with the system.
1.
Projected Background – Setting the Context
A large-scale wall projection serves as an ambient backdrop, creating an immersive environment that visually introduces visitors to the CM-You Board experience.
The projection helps visitors develop an initial mental model of the experience and gives them a high-level understanding of what each pawn represents before they even begin interacting.
2.
Instruction Banner – Providing Clear Guidance
As visitors step closer to the interactive table, they encounter a prominent instruction banner that provides more detailed usage instructions.
The banner clearly explains how to place, rotate, and push the pawn, and print souvenir to interact with the system.
During interaction, the banner remains visible, serving as an ongoing reference so users don’t feel lost at any stage.
3.
Onboarding Animation – Step-by-Step Guidance
When visitors engage with the table, an onboarding animation on the screen prompts them to take the first step—placing a pawn on the surface.The
Design Challenge 3
How to designing the UI for a Large Interactive Screen
Problem Identification: Adapting UI Design for Large Screens
Unlike smartphones or tablets, where users interact up close, designing UI for a large interactive screen requires careful consideration of user distance, readability, and interaction ergonomics. Users engage with the CM-You Board from various distances and angles, necessitating a design that is accessible, intuitive, and engaging.
Additionally, the UI and graphic design needed to align with CMU’s existing branding while also appealing to prospective students, particularly younger audiences who are drawn to dynamic, visually engaging graphics.
To address these challenges, we conducted multiple rounds of rapid prototyping on large-screen TVs, iterating on various UI elements, component sizes, color schemes, and graphical styles to optimize both usability and accessibility.
Solution: A Visually Cohesive and Engaging UI System
Our final design system was developed based on two key principles:
Consistency with CMU Branding: The core visual identity aligns with CMU’s established branding guidelines. A harmonious yellow accent was introduced to highlight Pittsburgh-related elements, ensuring a distinct yet cohesive look.
Inspiration from Student Perspectives: Drawing insights from co-design workshops with undergraduate students, we incorporated doodle and collage-style elements into the UI. This approach makes the interface more playful, youthful, and engaging, resonating with prospective students’ aesthetic preferences.
Pawn Design: Enhancing Recognition and Usability
The physical pawn design was also carefully crafted to reinforce the interactive experience:
Icon-Based Representation: We tested multiple graphic styles and finalized a set of easy-to-recognize icons representing CMU’s seven academic colleges and Pittsburgh’s three key aspects. CMU’s brand color, deep red, was chosen for academic pawns, while yellow was assigned to Pittsburgh-related pawns for clear visual differentiation.
Text Labels for Enhanced Clarity: To further improve recognition, text labels were added to the sides of the pawns, allowing users to quickly identify their meanings even before placing them on the table.
Outcome: A More Accessible and Visually Engaging UI
Through a research-driven, iterative design approach, we successfully developed a UI that:
✅ Optimizes usability on large screens by refining layout, colors, and element sizes.
✅ Maintains brand consistency while introducing playful, engaging elements for prospective students.
✅ Enhances user interaction with clear, well-designed pawns that seamlessly integrate with the system.
This comprehensive UI and pawn design strategy ensures a smooth, intuitive, and visually appealing experience for all visitors interacting with the CM-You Board.
Design Challenge 4
how to prototype a Functional Full-Scale Interactive Table
Whiteboard sketches of prototype ideas
Problem Identification: Developing a Functional Prototype Within Limited Resources
1. Prototyping the Pawn Mechanism
Recognize different pawns, detecting both their type and placement.
Support intuitive interactions, allowing users to rotate and press the pawns.
Display interactive UI feedback by integrating projection and computer vision technology.
Given these challenges, we iteratively tested multiple hardware and software solutions to find the most effective combination.
Prototyping Process and Key Technical Decisions
1.
Prototyping the Pawn Mechanism
The pawns needed to support both rotation and press interactions, requiring careful mechanical design.
I conducted multiple 3D-printed iterations, testing different heights, sizes, and internal structures.
Various spring mechanisms were explored to achieve optimal tactile feedback for pressing while maintaining stability for rotation.
The final pawn design successfully balanced functionality and usability, ensuring smooth interactions.
OptiTrack with infrared cameras
OpenCV with Unity
2.
Developing a System to Recognize Pawns
To enable the system to differentiate between pawns, we tested multiple tracking technologies:
OptiTrack with infrared cameras was initially considered but proved ineffective, as it is better suited for 3D motion tracking rather than detecting small objects on a 2D plane.
I then explored OpenCV-based computer vision, using triangular markers placed on the bottom of the pawns.
This approach successfully allowed webcams positioned beneath the table to detect pawn placement and identity.
3.
Testing Projection and Interaction on a Small Scale
Before scaling up, I conducted initial tests on a small frosted acrylic panel:
The frosted acrylic surface was chosen because it allows computer vision cameras to recognize markers while also displaying UI projections clearly.
A webcam underneath detected pawn markers, while a projector from below displayed the interactive UI onto the surface.
These tests validated the technical feasibility before committing to a full-scale build.
Building the Full-Scale Functional Prototype
With the core technology validated, we proceeded to construct a full-sized interactive table prototype with:
✔ A 6×4 ft frosted acrylic tabletop for marker recognition and UI projection.
✔ A webcam and OpenCV-based tracking system to identify and track pawn movements.
✔ A projector positioned beneath the table to display real-time UI feedback.
✔ A laptop running Unity and OpenCV to process interactions and render the UI.
✔ Ten uniquely marked pawns, each featuring distinct triangular markers for recognition.
✔ A sturdy table frame to support the system components.
✔ An instructional banner guiding users on how to interact with the system.
After multiple rounds of debugging, we successfully created a functional full-scale prototype, allowing users to interact with the CM-You Board dynamically.
Outcome: A Fully Functional Interactive Table Prototype
The final prototype effectively integrates hardware, computer vision, and interactive UI, creating a system where:
✔ Webcam-based tracking recognizes pawns by detecting unique triangular markers.
✔ OpenCV processes pawn recognition and sends data to Unity, which dynamically updates the UI.
✔ A projector displays real-time visual feedback on the frosted acrylic surface, enhancing engagement.
This resource-efficient, full-scale prototype successfully simulates the intended interaction model, providing a robust foundation for further refinements and real-world deployment.
3.
Bringing the Concept to Life
To ensure a compelling presentation, we developed a concept video that showcased the CM-You Board’s features, user interactions, and overall experience. This video helped the client visualize how the interactive system would function in the Welcome Center environment.
Implementation roadmap
While our work concluded at this stage, we outlined a clear roadmap for further development to ensure smooth execution. This structured implementation timeline provided the client with a clear roadmap for execution, ensuring that the CM-You Board could seamlessly transition from concept to reality.
Presentation and Client Feedback
The client’s response to our presentation was overwhelmingly positive. They particularly appreciated:
✔ Our incorporation of Pittsburgh into the experience, reinforcing CMU’s strong ties to the city.
✔ The live interaction setup with projection, which enhanced engagement and immersion.
✔ Our structured implementation plan, which provided a realistic pathway for transitioning from prototype to deployment.
Conclusion: A Vision for the Future
Through extensive research, user-centered design, and iterative prototyping, we successfully developed an interactive experience that enhances visitor engagement at CMU’s Welcome Center. The CM-You Board stands as a tangible, interactive storytelling tool, offering prospective students and their families a memorable, immersive introduction to CMU’s culture, values, and connections with Pittsburgh.
With the client’s enthusiastic reception and a solid implementation strategy in place, we look forward to seeing how the CM-You Board continues to evolve and enrich the CMU visitor experience.