CX Drills

UX Design

UI Design

Design System


Background

Finding motivation and effective methods to practice cyclocross drills can be tough. The sport demands a unique skill set and often lacks dedicated training facilities, making it challenging to stay motivated and improve.


Overview

CX Drills is a prototype I created to help cyclocross athletes and coaches optimize training routines. By prioritizing clear presentation and effective organization of cycling drills, I aimed to create an intuitive and efficient virtual training platform.

User Research

To understand my users I joined local cyclocross training sessions, sat in on a boot camp, and listened intently to the insights of coaches and athletes. A consistent message resonated, this is supposed to be fun. However, a clear training structure proved vital for achieving optimal fitness and riding skills, but many riders felt lost creating workouts.



bike build landing page

Defining Solutions

By synthesizing research findings, a clear problem emerged: Cyclocross riders are struggling to discover effective workout routines, hindering their progress in skill development and overall fitness. To address this challenge effectively, I created user personas and empathy maps for athletes, coaches, and bike brands.


bike build landing page

Wireframing & Brainstorming

To bridge the gap between fun and focused training, I embarked on a design thinking process. By combining user insights with the core app concept, I generated a range of potential solutions. Through iterative sketching and prototyping, I explored various approaches to deliver structured, enjoyable workouts that catered to riders of all levels.


bike build landing page
bike build landing page
bike build landing page

High Fidelity Prototypes

To visualize the CX Drills experience, I crafted interactive prototypes. By carefully considering color palette, imagery, and layout, I aimed to create a visually engaging and intuitive interface. A bold color scheme reflecting the energy of cyclocross was paired with dynamic graphics to capture the sport's essence. The layout prioritized clear navigation and easy access to workout information, ensuring a seamless user experience. Through this iterative process, I refined the app's design, making it both visually appealing and user-friendly.


bike build landing page

Test Rides

Pre-riding the course is an essential part of cyclocross racing, and so is testing a design before presenting to stakeholders. To ensure CX Drills met the needs of its users, I conducted thorough usability tests. By observing users interact with the prototype, I gained valuable insights into their behavior, preferences, and pain points.


Results

By prioritizing user needs and iteratively testing prototypes, I created a product that enhances the cyclocross training experience. Key outcomes include an intuitive interface, engaging workout content, and a strong foundation for future development and partnerships with local teams and bike brands.


Design System

To ensure design consistency and efficiency, I developed a comprehensive design system. This included guidelines for typography, color palette, and reusable components, providing a foundation for the development team to maintain a cohesive look and feel across the CX Drills app.