Designing an Improved Experience for Professional Cyclists

Client: Startup, Switzerland
Role: UI, UX, Graphic Design, Research
Team: Project Manager, Designer (me)
Year: 2021

The project is meant to reimagine the way bikers cooperate. It targets athletes and bike enthusiasts alike and aims to improve the experience of owning a bike by helping them exchange their parts and fix their bikes.

The Problem

Professional bike ownership often comes with significant challenges, particularly when it comes to sourcing specific parts or finding reliable repair. Our initial understanding highlighted several key pain points:

Difficulty in Sourcing Parts: Riders frequently struggle to find obscure, affordable, or readily available components.

Cost and Accessibility of Repairs: Professional bike repairs can be expensive and inconvenient.

Mobile app interface for buying a bike, showing price range selector, preferred bike brands (Roadster, Trek Bikes, Redline), and a detail submission screen with a close-up photo of a modern mountain bike. The screenshot demonstrates a user-friendly bicycle shopping experience with budget filters and step-by-step guidance.

The research stage: Data-driven visual decisions

I conducted thorough research on the styles that best communicate the product, basing it on solid scientific foundations. One of the main areas of focus was color.

Science of color led me to a conclusion: More saturated colors demand more attention but cause an impression of lower quality. Another fascinating insight is that saturation and brightness matter more than hue for psychology. Source below.

Color psychology with two green color variants.

Wilms L, Oberfeld D. Color and emotion: effects of hue, saturation, and brightness. Psychol Res. 2018 Sep;82(5):896-914. doi: 10.1007/s00426-017-0880-8. Epub 2017 Jun 13. PMID: 28612080.

The color scheme proposals

After conducting fundamental research, I was ready to create the product’s color scheme. My two main ideas were:

Blue: Technology and trust.

Green: Nature and growth.

Figjam board showcasing three project color versions

Talks with the client led me to the green and black colors. Green symbolizes nature and growth, aligning with our app’s mission to help bike enthusiasts repair their bikes. Black adds a professional touch, perfect for our professional target audience. And let’s not forget, bikes themselves are often black.

Final brand identity, a complex story told trough simplicity

The logo combines a circle and a checkmark to tell the brand’s story. The circle represents a bicycle wheel and the universal circle of life, symbolizing the repair and rejuvenation of a bike. The checkmark itself signifies a problem solved and a task completed.

Bikecheck logo design featuring a bold checkmark inside a circle, with the word ‘bikecheck’ in modern lowercase font. The branding is displayed on teal, white, and black backgrounds, highlighting a professional bicycle verification and bike check service identity

UI design stage

My earlier research findings were synthesized into core user personas, which then served as a strategic foundation for the subsequent UI design phase.

I built a “buyer” and a “seller” user flows, both of which were used for user testing and for client presentations.

Two user persona cards for a cycling app, featuring Sarah Turner, a practical and adventurous freelance designer from Sydney, and David Miller, a competitive and resourceful professional road cyclist from Zurich, with summarized bios, goals, pain points, behaviors, personality traits, and profile photos in a modern, accessible UI layout
Buyer user flow diagram for a bike marketplace app, showing a step-by-step mobile interface journey from creating a listing and inventory selection to setting a budget, filtering bike options, viewing bike details, messaging sellers, and finalizing the match, with clear annotated connections between each screen and process step

The result

Final designs synthesized all the research and thought put into it during the preceding phases. The logic was tested, and even the details like color were based on research.

Three mobile screens from a bike marketplace app showing an onboarding welcome screen with illustration, a bike marketplace feed listing a used road bike for $699, and a secure chat interface where a buyer contacts seller User #3442 for more information about a bike listing