MCT Hub

Spring 2026

Role: UX Designer

OVERVIEW

The Michigan Climbing Team (MCT) is a club sport sponsored by the University of Michigan, competing nationally in the USA Climbing Collegiate Series.

MCT Hub is a centralized mobile experience designed to streamline club logistics for 50+ team members. By consolidating fragmented workflows into a single interface, the app reduces administrative friction for leadership and improves information accessibility for athletes.

PROBLEM

The MCT currently operates in a fragmented manner, utilizing several different digital platforms to meet their needs:

  • Email for announcements

  • GroupMe for team chatter

  • Google Forms for carpool logistics

  • Physical printouts for training sign-ups and attendance

This led to difficulty in locating information for members, as well as tedious manual data collection and organization for team leadership.

To solve this, I set out to design a centralized hub to consolidate the current systems so that team members could spend less time worrying about logistics and more time climbing ☺.

The real challenge was less about combining the experiences into one, but ensuring the new centralized experience was genuinely more efficient. Thus, this write-up focuses less on how the product works, and more on why it works so well.

PROCESS

My process began by partnering with team leadership to define core functional requirements. Then, I built the information architecture for the app, organized around the key moments a team member may be involved with:

  • Announcements

  • Carpools

  • Training

  • Messaging

  • Attendance

Special thanks to Aidan Miftiu for this animation

This structure helped create natural boundaries between sections and drove clear user flows within them.

I then conducted discovery interviews with 10+ active members to uncover current user frustrations, such as the 'tedious' nature of manual attendance tracking and the 'lack of flexibility in current systems'.

To address these concerns, I chose to center my design strategy on clarity and ease-of-use. By pairing a highly intuitive interface with a flexible, polished product, I aimed to transform a tedious chore into an effortless routine.

With the information architecture and guiding principles decided, I began establishing the core design system through the announcements interface, developing a library of scalable components and freely experimenting to see what looked and felt right.

Below is a little bit of what that process looked like…

Notably, most of these images are pushing towards mid/high fidelity.

I notice the feel of the page can change so much when moving from a wireframe to higher fidelity that it’s necessary for me to push initial concepts further to completely understand what they offer and what they lack – objectively and in terms of sensations.

As an example, here’s a look at a bunch of the different top 'tab' button/slider styles I considered…

As well as carpool sign-up cards…

I routinely made several iterations of components which allowed me to feel the details of each version and get better user feedback. This helped ensure the final product was not just aesthetic but also functionally superior for fast-paced decision making.

Another important step in my process was usability testing and getting feedback from peers. To illustrate how this shaped my design decisions, let's look at the attendance dashboard.

This feature of MCT Hub streamlines attendance, allowing each team member to quickly sign in via QR scan instead of manually recording. The dashboard visualizes each user’s attendance history to ensure they meet the 50% participation requirement for team practices.

To begin, I benchmarked successful data visualization patterns from fitness and calendar applications. Then, I moved through multiple iterations of rapid prototyping to get feedback from my peers on what parts felt clear and where they hesitated.

Here is a look at the check-in flow from where it started…

To where it ended up…

In the initial iterations I had chosen to display only practice dates and not the whole month, but after user testing + feedback it quickly became apparent that users needed context of the entire month.

Most users possess high, almost innate familiarity with visualizing schedules via calendars. This became clear through user testing, allowing me to design a more intuitive UX. 

Continuously refining the product through trial, error, and feedback became a crucial part of my process in developing MCT Hub.

CLARITY AND EASE

There's a term in rock climbing when you successfully 'top' a climb on your first try called a 'flash'. My aspiration for this app was to embody that flow-state one enters when flashing a difficult climb — where everything goes right and no movement is questioned.

With this mindset, clarity and ease of use became so important to me while designing, so I want to highlight some areas of the app where this shines through.

To make complex interactions clear, I opted for a progressive disclosure system that has users make decisions one at a time (or in small groups) to reduce cognitive load and make the process feel lightweight and intuitive.

Here we have an example of what posting a carpool might look like…

This makes the process, that in fact collects more information than the current Google Form, feel quicker and more seamless.

For ease, I provided default options that align with team norms like pickup sites…

Realistic 'seats available' options and the team standard 6:35 PM pickup time….

This same system is utilized when creating a training session.

I also included a confirmation screen that summarizes the journey taken and displays all key information at once. This makes it clear to the user what they just did and what they are about to do.

This serves as a way of maintaining clear visibility of system status.

These lightweight confirmation patterns were integrated throughout all 'sign-up' and 'cancellation' flows to act as a primary method of error prevention.

With this system, I aimed to limit mistakes and grant the user a greater sense of control over the interface. Furthermore, establishing these predictable, reliable patterns is essential for building long-term user trust.

Here's a sign-up version…

And a cancel/leave version…

To ensure ease of use, I deliberately utilized familiar design patterns and mental models that were already well-established within the team’s existing workflow.

In the announcements page, I maintained an 'email-esque' visual style. By mimicking a traditional inbox, I ensured familiarity across announcements, requiring zero adjustment for current members.

For the same reason I chose to keep the chat feature similar to the current GroupMe.

This recognition over recall strategy allows users to navigate and communicate intuitively, as the interface behaves exactly how they expect a messaging platform to function.

By honoring these established conventions, I was able to centralize the team’s tools without forcing users to learn a completely new interface.

Beyond the athlete’s experience, I created an attendance check system specifically for team leadership. The goal was to translate raw data into actionable insights, allowing for the rapid identification of members falling below the 50% participation threshold.

I utilized a list-based UI pattern similar to established social media 'Following' or 'Followers' lists. By being conscious of users' existing mental models, I ensured the interface felt intuitive and required zero learning curve for leadership.

To maximize efficiency, I implemented semantic color coding within the roster. This allows leaders to scan 50+ profiles and immediately recognize patterns or participation issues at a glance.

Moreover, optional organizational filters provide even greater efficiency.

The moderator view also mimics the athlete’s personal view, maintaining internal consistency across the entire application while providing the advanced oversight necessary for team management.

THE DETAILS

I, of course, wanted to make a platform that did what was required of it, but I also wanted to make something that myself, my teammates, and all of those that come after us would enjoy using — and not see it as clunky, outdated, or a chore to use.

That's where the details came into play. I believe that the care and polish you put into the small things eventually accumulates into the experience that the user is left with. So let’s take a look at some of the places where that polish stands out.

Going back to my top slider button, I designed a custom toggle with tactile visual feedback to clearly communicate system status during navigation.

I explored different lower highlight options, but eventually chose to fully round the edges to feel like a hockey puck sliding across the surface.

Additionally, this highlight is not a static element; it dynamically scales its width to match the character count of the active tab. This creates a responsive experience for an interaction that team members may frequent many times a day. Transitions feel intentional and fluid.

I also opted for a greyed out 'false' state to make it feel like my 'hockey puck highlight' was bringing life back into the text as it slid over to greet it. This provides clear system status to the user and makes navigation intuitive.

Small details like these make a big difference when you really hone in on them. Take a look at these two examples and see if you can spot the difference.

If you didn’t notice the difference, no penalties for you, but let’s break it down.

On the right, the interface background dynamically contracts and expands in response to the messaging pop-up. Unlike the static transition on the left, this motion allows the user to feel the change in the system state rather than just seeing a jarring update.

Here's another look at slight scaling creating a more seamless experience…

If you didn’t notice the difference, no penalties for you, but let’s break it down.

In the second version, the interface background dynamically contracts and expands in response to the messaging pop-up.

Unlike the static transition in the first, this motion allows the user to feel the change in the system state rather than just seeing a jarring update.

Here's another look at slight scaling creating a more seamless experience.

These subtle transitions provide immediate confirmation of a user's action, creating a more tactile, responsive environment. This focus on the feel of the interface ensures that every interaction is intuitive and reinforces the user's sense of control over the product.

Now let's look at the team attendance filtering.

By animating the cards as they shift positions, users can visually track the reorganization, making the system's logic transparent and reducing the cognitive effort required to re-scan the list.

For buttons, pressing scales the button down so the user can feel the action they are taking. This provides immediate system status confirmation, and contributes to a tactile experience.

When a user signs up for a training session or carpool, they see real-time updates to reflect their participation. This immediate confirmation validates the user's intent and provides an instant 'success' state, which is crucial for maintaining a sense of system reliability.

Even the smallest navigational elements, such as the arrows on the roster page, were designed with precision. I implemented rotational transitions on these icons to accurately reflect the directionality of the dropdown menus.

I also had a ton of fun making different splash screen options for the MCT Hub.

In the early exploration of the loading sequence, I experimented with playful animations featuring rock icons to lean into the team's personality. However, through the lens of usability, a repetitive, time-intensive animation could quickly become a point of frustration for frequent users.

In an effort to ensure the splash screen didn't feel like an unskippable ad, I pivoted to a quicker splash screen that still held some dynamism.

This decision reflects my commitment to an interface that respects the user's time and focuses on getting them to their desired content as efficiently as possible.

Although I do find it fun to create micro-interactions or design 10 slightly different button options, that's not why I obsess over the small details.

My ultimate goal with all of these details is to create an experience that is effortlessly clear and intuitive. I am not designing to wow the user with ornamentation or demand their attention; rather, I am focused on providing a level of polish that the product would feel empty without.

A NOTE ON COMMUNITY

With so much of rock climbing and team dynamics being based on community, I also wanted me to intertwine it wherever I could.

Within the team group chat, I added a team roster that allows any team member to see who is on the team, learn a little bit about them, and give them an easy way to connect.

The design fosters a sense of belonging and camaraderie.

All of this information can also easily be edited via the profile page.

On the carpool and training pages, I brought in a hint of community with a feature to see who has signed up for posted rides or sessions.

This visibility acts as an engagement loop, encouraging participation through team chemistry and shared goals.

A NOTE ON COLORS

When defining the visual identity for MCT Hub, I faced a strategic choice: strictly adhere to the University of Michigan’s signature Maize and Blue, or develop a distinct palette tailored to the team’s specific culture.

To many of us on the team, climbing was an outlet. It was an escape from academics and responsibilities, but also a way to exercise, socialize, and ultimately have a good time.

I didn’t want the MCT Hub to feel like a direct extension of the University because it was what many of us used to distance ourselves from our lives on campus. I wanted to pay respect to the team history and spirit, but breathe energy and a certain freedom from the university through color.

Ultimately, I chose to transform the signature blue color scheme that so many administrative apps share.

I moved directly from the navy of the University of Michigan to a brighter blue.

The refreshed colors represent the unique experience the MCT provides its members, away from university sanctions.

REFLECTIONS

Designing the MCT Hub was a unique exploration in designing for myself and my peers simultaneously. I am deeply grateful to the team’s leadership for trusting me to centralize our community’s digital home. As my time at the University of Michigan winds down, I look forward to moving this project into the development phase to see its impact in real-time.

I am most proud of the work that is meant to go unnoticed: the transitions, the tactile feedback, and the visual hierarchy that allow the user to navigate without ever having to question themselves or the platform.

The polish in my work isn't driven by a desire for recognition, but by a fundamental respect for my craft and for the users I create for. I wanted the MCT Hub to feel as premium and intentional as the community it represents. This project has been deeply rewarding, and I hope it leaves a meaningful mark on a club that has given me so much in return.

Back to top