Velodash

Transforming the Cycling Experience

Role
Founding Designer
Period
1 year
Jul 2019 - Jul 2020
Tools
Sketch
Zeplin
InVision
Team
CEO
5 Engineers
1 Product Manager

Background

Velodash launched in May 2018 to help cyclists track routes and positions. As the user base grew, feedback revealed gaps in usability and functionality. The engineering team’s decision to migrate to Flutter provided an opportunity to tackle these challenges. I contributed to the redesign by introducing user research methodologies, addressing the most pressing issues, and improving the product’s usability to better meet cyclists’ needs.

Impacts

The redesigned Velodash app received widespread positive feedback, driving both user and business growth. By addressing key user pain points, we improved user satisfaction, leading to stronger engagement and retention.

Monthly active users (MAU) increased by 49% within two months.

Finding problems

Realizing that our product no longer met the growing needs of our users, I introduced user research methodologies into the company’s design process to better understand their challenges and priorities.

We conducted a survey, 6 usability tests, 12 interviews, and rode alongside cyclists to uncover key issues and determine which were worth solving.

Led usability testings: Created scripts, prototypes, and moderated sessions

Field observations by cycling with users

Results of usability testings

Early insight

1. Cyclists were reluctant to use Velodash during rides, limiting its effectiveness as a cycling tool.

2. Communication during group rides was hindered by distance, often requiring other tools and resulting in delays or misunderstandings.

"Why are these problems worth solving?"

Many users avoided using their phones to record rides, and over half abandoned recording midway, resulting in incomplete routes and disrupted group coordination. The lack of clear communication channels caused wasted time, effort, and anxiety during rides, ultimately affecting user satisfaction and limiting the product’s potential for growth.

Refine problems

Through interviews, we uncovered deeper underlying issues contributing to user challenges:

1. Battery Drain Concerns

Cyclists avoided using the app due to fears of draining their phone’s battery. Many stopped recording rides once their battery dropped to around 50%.

2. Redundant Information

The app displayed data already available on cycling computers, which users found unnecessary and discouraging.

3. Ineffective Communication

The cumbersome process for sending messages during rides forced users to stop riding to communicate, disrupting their experience.

Problem statement

Cyclists face significant challenges using Velodash during rides due to high battery consumption, redundant data that overlaps with cycling computers, and ineffective communication tools. These issues result in incomplete ride tracking, disrupted coordination, and a less enjoyable cycling experience.

We asked ourselves:

"How might we create a reliable, efficient, and engaging cycling experience?"

Design results

1. REAL Energy Savings

Minimizes battery consumption by delivering only essential information when needed, ensuring longer ride tracking without interruptions.

2. Customized Data at a Glance

Users can effortlessly tailor their information fields, focusing on what matters most, whether or not they use a cycling computer.

3.Seamless Communication

With a single tap, cyclists can stay connected without pausing their ride, enabling smooth coordination and interaction.

Design decisions

1. REAL Energy Savings

Nearly 45% of users found Velodash too power-consuming, which hindered recommendations and continued use. Two key design decisions were made to address this:

a. Screen Brightness Optimization: Implemented a near-black “power-saving mode” as default, reducing screen brightness from 30% to almost zero. Users can easily switch back to normal mode with a single tap, ensuring critical data remains accessible while conserving battery.

b. Data transmission: Reduced unnecessary location updates by stopping location tracking when the map isn’t displayed (e.g., screen off, power-saving mode). This significantly cut transmission power usage in all scenarios.

Additionally, based on insights that cyclists rarely check their phones during rides, we decreased the “location upload frequency” from 1.5 seconds to 5 seconds, reducing transmission power consumption by 70%.

2. Customized Data at a Glance

Research revealed that:
a. almost 50% of users prioritized “viewing friends’ locations,” while fewer than 20% found “viewing ride data” valuable.
b. Nearly 80% of cyclists already using cycling computers, providing redundant ride data was unnecessary.

To address this, the riding data display page was redesigned to emphasize essential information—maps and locations. A third mode was added to display only the map, allowing cyclists to focus on navigation and group coordination. Interaction design improvements also enabled users to easily customize data fields by swiping up or down.

3. Seamless Communication

Effective communication is essential for group rides, as interviews revealed that participants wanted to send text messages during rides and share photos afterward to preserve memories.

The existing messaging process was cumbersome and unintuitive, with no option to send pictures. To address this, the message-sending process was streamlined, allowing cyclists to quickly exchange important information during rides. A photo-sharing feature was also introduced, enabling riders to stay engaged on the platform and share their experiences after the ride.

Beyond cycling

Rebuilding the information architecture

Usability testing revealed that users often struggled to find content. To address this, the information architecture was redesigned and visualized to align more closely with users’ mental models, enhancing navigation and content discoverability.

Establishing a clear and efficient design system

Previous design files were fragmented, causing inconsistencies. Rebuilding the system in Sketch unified fonts, components, and spacing, providing engineers a consistent reference and streamlining development.

Building a more accessible product

Testing revealed that users often squinted or held their phones at a distance while using the app. Surveys showed most users were aged 40 to 60, making the original font size (14–17pt) unsuitable. To improve readability, the font size was adjusted to 16–20pt.

Ensuring product quality

Once the design solution was finalized, the handoff and evaluation phase revealed additional design details and states, which helped account for technical limitations and diverse use cases in future iterations.

I also led the quality assurance process, identifying issues in the test product and working closely with engineers to find solutions. To further enhance the product, I invited engineers to join outdoor testing before release, giving them a deeper understanding of real-world use cases and ensuring a high-quality final product.

Preparation before launch

To enhance product quality and minimize resource waste, I led quality assurance automation alongside manual testing. I defined the scope, form, and process for automated testing and collaborated with the product manager to design the beta testing process and feedback mechanism ahead of the launch.