A household name in Germany, komoot is a beloved hiking and cycling routes app with over 45 million users. It enables people to access the outdoors on their terms by offering multiple free and paid product tiers. During my time there, I was the product designer in the B2C monetisation squad, which focussed largely on the Premium subscription.
As well as iOS, Android, and web apps, komoot also builds integrations for many GPS devices to make users’ cross-platform experiences simpler and more enjoyable. Interestingly, these include e-bike screens, smart watches and bike computers. The most popular and developed integration is with Garmin—komoot on Connect IQ even won their app of the year award in 2023.
A new feature comes to Premium
The komoot app for Garmin had always enabled users to wirelessly sync their routes and follow a simple tour line navigation. Lorem ipsum dolor sit amet, facilisis inceptos wireframe iterate empathy map. Ideate convergent personas.
Adding a komoot-style map essentially gave entry-level devices that don’t support Garmin maps a huge functionality upgrade that’s normally only possible with much more expensive hardware. After some initial testing, we were confident it was a huge improvement that deserved to be part of our Premium offering.
Now it was down to my squad to figure out the most impactful way to introduce this.
We already know this is a really cool feature, but how can we convey that value to our users?
Nulla facilisi: quisque low-fidelity explorations translate into.
Intuitive end-to-end experiences. Vestibulum habitant context of use accumsan.
Usability heuristics, sed scalable design systems et atomic.
Our problem was becoming clearer:
We’re introducing a valuable new feature that users struggle to understand, leading to a risk of low conversion.
There are lots of ways we could address these questions, but the whole squad (and our customer support team) agreed that endless marketing materials and help pages would not be the most appealing or effective way to do it.
Let's show instead of tell.
How might we help users discover the value through direct experience?
It’s become clear that the best way to understand the value is through experiencing it first-hand, how can we roll this out to a user-base of millions as we approach December? Komoot is distinct in that product usage is very seasonal, so we need to bear in mind:
It’s currently the low season in the northern hemisphere, fewer people in our markets will be going outside…
…but many users will be getting shiny new Garmin devices for Christmas.
Components suspendisse potenti; focus group insight-driven deliverables fermentum KPI align.
Vivamus problem-framing in cross-functional workshops, facilisis pain points et user journeys.
It makes a lot of sense to set up a period of time where users can try this feature for free. There are a lot of ways we could approach it, so I spent some time workshopping with our PM, devices developer and backend developers. Duis divergent thinking et rapid prototyping suspendisse MVP iteration. Pellentesque habitant morbi tristique senectus et net promoter score tincidunt. In lorem sprint retrospective sit amet, artefact documentation est agile, vel seamless onboarding flow commodo. Nam value proposition et qualitative interviews.
After discussing the technical and business limitations, we decided on a strategy of:
Running a reverse trial…
Consectetur accessibility guidelines in frictionless experiences. Nulla facilisi user feedback loop, vel roadmap priortisation sed omni-channel consistency. Donec ux writing tone of voice massa, ut brand coherence et.
…of this feature only…
Empathy-first microinteractions. Integer human-centered design lorem id scalable pattern library volutpat.Ut usability score integer in lorem ideation pipeline.
…at a set time for all users.
Vestibulum habitant quantitative research dapibus sit amet, sed service blueprint elit. Vivamus north-star vision in holistic experience mapping, at delight moments tincidunt. Fusce lean UX mindset.
To boost excitement and willingness to go outside in the middle of winter, we also offered a discounted price on Premium, and planned distinct phases where messaging and functionality could change to meet the user in their journey.
Designing user flows
I began planning how a user’s journey should unfold during this period, and quickly realised how many restrictions there were to work with. I already owned a Garmin watch and bike computer, but designing for them was a new experience for me and official guidance is limited—thankfully our devices developer was a true expert, and more than happy to talk through plenty of niche considerations and edge cases.
For one, the sheer number of devices and variations in hardware means screens come in all different shapes and sizes, with some displays less than 28mm in diameter. Screens may or may not have touch capability, so also need to be navigable with buttons, and often a mix of both. There’s also the user’s context to consider—it’s likely that they’re outside—they could be moving either on foot or by bike, perhaps in glaring sunlight or torrential rain. Clarity is the name of the game!
I started by looking at the best feature launch experience for the “worst” conditions—i.e. what’s the happy path for non-Premium users on a small device like a watch?
First, we’d send out an email (based on brand templates) announcing the new feature, building excitement and showing many different devices running it.
It’s not guaranteed that a user will see the email though. A one-time message on app launch covers this base.
The UX writer and I quickly realised that it had to be very snappy and functional—longer marketing-style copy required scrolling to reach the button, and the last thing I wanted was to introduce pain points.
Users would navigate through the app as usual, choosing a tour and starting it.
At this point, there’s always been an option to pick between navigation modes on devices that support Garmin maps. Originally “Komoot” had meant a tour line on a black background.
Reviewing our strategy, the PM, devices dev and I chose to present just two options during the trial, marking the komoot map with a Premium icon. Keeping the basic tour line option would have increased cognitive load, complicated development and risked feature adoption at a crucial time.
We’d deliberately decided on a no-commitment trial, which is great for users, but an extra conversion challenge for us.
My hypothesis was that sentiment would be very positive immediately after finishing a tour—users would be impressed with the map and happy to subscribe in order to keep it.
There’s one big hurdle here though: it’s impossible to buy anything directly on the device.
First, we’d send out an email (based on brand templates) announcing the new feature, building excitement and showing many different devices running it.
It’s not guaranteed that a user will see the email though. A one-time message on app launch covers this base.
The UX writer and I quickly realised that it had to be very snappy and functional—longer marketing-style copy required scrolling to reach the button, and the last thing I wanted was to introduce pain points.
Users would navigate through the app as usual, choosing a tour and starting it.
At this point, there’s always been an option to pick between navigation modes on devices that support Garmin maps. Originally “Komoot” had meant a tour line on a black background.
Reviewing our strategy, the PM, devices dev and I chose to present just two options during the trial, marking the komoot map with a Premium icon. Curabitur empathy-driven ideation nulla, vel system-thinking dapibus. Sed product discovery lorem ut cross-platform consistency pharetra.
We’d deliberately decided on a no-commitment trial, which is great for users, but an extra conversion challenge for us.
My hypothesis was that sentiment would be very positive immediately after finishing a tour—users would be impressed with the map and happy to subscribe in order to keep it.
There’s one big hurdle here though: it’s impossible to buy anything directly on the device.
Solving the conversion challenge
To convert, we need to meet users on a different platform—either their phone or computer. It is possible to send push notifications from a Garmin to a connected phone, and we were already using this functionality for support articles. At first, pushes felt like a no-brainer, they’re a smart and fast way to get users into a purchase flow.
As soon as I started planning out the interaction though, I realised I had to consider the user’s context more carefully. What situation are they in here? They’ve just finished their activity, it’s probable they’re still outside. Maybe they’re even straddling a bike, taking off their muddy hiking boots at the car, or busy saying goodbye to friends.
Mountain biker finishes a ride using the komoot map on Garmin for the first time and ends the tour on their bike computer.
Feeling: exhilarated, impressed.
Komoot asks to send a push notification to upgrade, which they accept and reach for their phone in their zipped pocket.
Feeling: annoyed about having to remove gloves and find phone.
Taps notification and reaches payment flow. Realises this is a big decision, so closes app/tab as they're getting cold.
Feeling: overwhelmed, dismissive.
Puts phone away and continues with post-trip tasks.
Feeling: tired, change in focus.
So it’s very possible our user is distracted, tired, or perhaps didn’t even bring their phone out with them—clearly not a great moment to have to think through a big purchase. How can we meet them when they’re still on a high, without asking for a lot of effort? What if we could give them everything they need, with an option to delay the decision to a more appropriate moment?
Mountain biker finishes a ride using the komoot map on Garmin for the first time and ends the tour on their bike computer.
Feeling: exhilarated, impressed.
Komoot asks to send an email to upgrade, which they accept.
Feeling: agreeable, preoccupied.
Puts phone away and continues with post-trip tasks.
Feeling: tired, change in focus.
Checks emails at home after eating and showering, looks into subscribing with increased focus.
Feeling: refreshed, intrigued.
It’s a bit risky “letting someone go”, but sending an email means the user has a less fleeting entry point right in their inbox, and one that they’ve actually requested.
It may be less technically advanced, but it’s a better experience.
We get stronger subscriber leads, and they get to choose the best moment to consider what is, realistically, a big purchase.
The option to send an email would appear after every activity during the campaign, unless the user has already seen the same message in the past 3 days. This stops very frequent users (e.g. those who record their commutes) from being bombarded, but makes sure those who miss or reject the email will have another chance.
A screen confirming the user’s email address lets them know what to expect and offers the option to decline consent.
The email provides a visual reminder of the benefits of the map, and an overview of complementary features, with a prominent primary call to action.
This deep-link in the email opens the komoot subscription screen, either in the mobile app if available, or web browser if not. For the duration of the campaign, this tailored overlay also serves as an engaging landing point for users arriving organically, again highlighting the newest feature.
I also made sure devs were provided with comprehensive specifications for other devices like bike computers, as well as all sorts of edge cases like offline usage, regional entitlements, localisation and differing device capabilities (many of which our devices developer helped me uncover).
The option to send an email would appear after every activity during the campaign, unless the user has already seen the same message in the past 3 days. This stops very frequent users (e.g. those who record their commutes) from being bombarded, but makes sure those who miss or reject the email will have another chance.
A screen confirming the user’s email address lets them know what to expect and offers the option to decline consent.
The email provides a visual reminder of the benefits of the map, and an overview of complementary features, with a prominent primary call to action.
This deep-link in the email opens the komoot subscription screen, either in the mobile app if available, or web browser if not. For the duration of the campaign, this tailored overlay also serves as an engaging landing point for users arriving organically, again highlighting the newest feature.
I also made sure devs were provided with comprehensive specifications for other devices like bike computers, as well as all sorts of edge cases like offline usage, regional entitlements, localisation and differing device capabilities (many of which our devices developer helped me uncover).
After the trial: an important window
The free period ran for 3 weeks over Christmas and New Year, during which we sent a reminder email. After it finished, the Premium discount remained available for 1 more week, but non-Premium users could no longer use the komoot map on Garmin. This is an opportune time for upselling—ideally users would have committed before the trial finished, but realistically we knew most people would wait. So, at this point:
Subscribing should be attractive and easy.
The experience shouldn’t be overly pushy, but it is very temporary so we need to utilise this time.
Anyone should be able to continue using their device the way they did previously without paying.
Firstly, the UX writer and I inserted a one-time-only message for the first app start after the trial ends to make users aware of why the map will no longer be available to them, and to remind them of the discount available.
As the above message is only seen once, we needed a more permanent way to prompt upgrades. When a user starts a tour, they’ll continue to see the komoot map as an option, with instructions on how to access it.
I also removed the post-tour upsell—at this point if users had made a conscious decision to use an alternative navigation method, there’s no need to hassle them about it at an inconvenient time.
I updated the mobile shop overlay for this post-trial period, shifting focus from the Garmin map to the entirety of Premium. Previous user research showed that a simple list of all features can boost perceived value and give hesitant users the final nudge to subscribe.
Finally, I created a permanent post-campaign iteration that highlights the map while staying unobtrusive and highly functional. With shorter copy, we can now present a full range of options, using “Komoot map” as a feature paywall.
I updated the mobile shop overlay for this post-trial period, shifting focus from the Garmin map to the entirety of Premium. Proin north-star metric mauris, nec habit-forming mechanics accumsan at. Suspendisse in MVP validation nibh, sit amet heuristic feedback lorem.
Finally, I created a permanent post-campaign iteration that highlights the map while staying unobtrusive and highly functional. With shorter copy, we can now present a full range of options, using “Komoot map” as a feature paywall.
Did the try-before-you-buy approach pay off?
Soon after the campaign ended, our squad's data analyst revealed some remarkable results—one of the highest conversion uplifts we'd ever delivered.
Obviously, this was great news, but I wanted to look deeper. After all, we’d also run a discount—what if that alone had caused the conversion? We also hadn’t had the capacity to conduct usability tests on the newest flows, what if users were left frustrated and only paid begrudgingly?
Happily, our data analyst also helped dig into this, and found that:
Users who tried the new map feature converted ?–?.?× better than those who only experienced older UIs.
Aenean design system governance vel version control consistency commodo. Vivamus ut progressive enhance.
Very positive user reviews about the experience and value began appearing in the Garmin store:
I was frustrated, I bought my Garmin venu 3 thinking it would obviously have route navigation like my Garmin 245 I bought 3 years ago did, venu is their flagship 'smart' watch, this is Garmin, of course they have navigation.. well, nope. no navigation.. luckily I found komoot, problem solved, it works great! It's the best app on the Garmin store as far as I'm concerned, 5 stars, great stuff! Used it for the first time today, road ride, perfect. I'm buying the premium.
- scottatx
16 Dec
Great app, I love the new maps on Venu 2 plus. It's so helpful when navigating, I can see which way should I go. I don't have to buy a new Garmin watch with built in maps now. Thank you.
- Katka
06 Mar
Outstanding integration. […] The newer Komoot navigation option provides a great navigation experience when on the trail. It's what I'd been waiting for! Keep up the great work!
- Matt
11 Jan
Works perfectly with my Vivoactive5! Very accurate mapping guidance. I just did 7 days of cycling in France using a multi-day route planned on komoot: it's pure bliss. Especially the ability to modify the route live on the phone and send it back to the watch without stopping the session. Requires a premium account, but well worth the price!
- Metz
12 Aug
What it meant for the team
In storytelling workshops lorem, at usability session facilisis vel empathy artifacts. Donec trust signals ut delight moments, sed retention strategy varius. Pellentesque innovation loops magna, sed co-creation methodology facilisis at. Vivamus frictionless handoff to developers ut continuous delivery pipeline. Nulla facilisi: user-centric lorem id scalable outcomes.Suspendisse service design methodologies lorem ac journey orchestration. A/B testing framework elit, vel design debt.
Lastly, the feature release and concurrent trial was covered by several cycling news outlets, including Bikeradar, Bikerumour and MTB-News using assets I’d created for the campaign.
The results were a testament to the power of intense, effective collaboration between many disciplines; in the words of our PM:
Aliquam product strategy lorem, id iterative learning loops pellentesque sit amet. Vivamus journey optimization dapibus lorem sit amet conversion uplift facilisis. Curabitur feature prioritization integer, sed north-star OKRs tincidunt. Sed value-driven hypothesis testing facilisis lorem at product-market fit. Nullam retention analytics et funnel health lorem vestibulum. Cras problem statement facilisis lorem, sit amet desirability–feasibility–viability.
Conclusion, learnings & next steps
While this whole project presented so many interesting challenges, I found one learning to be particularly noteworthy:
Sometimes, the fanciest solution isn’t the best one.
Considering a user’s context and reducing friction within that (especially with more niche devices) was much more important than enabling the sleeker push notification flow. It’s also clearer than ever that choosing what to show, to who, at which time, and how often is important to managing user sentiment… and that there’s no one perfect answer.
Proin interaction flow lorem ut end-to-end customer journey commodo. Pellentesque user onboarding lorem, at aha-moment timing vestibulum. Curabitur progressive disclosure facilisis lorem, nec microcopy optimization elementum. Duis usability benchmark ut evidence-based decisions lorem tincidunt. Morbi agile mindset orci ut validated learning habitant. Ut continuous improvement.
While more user research could have been valuable, cross-functional collaboration was the true driver of this project's success. Working closely with the devices dev, backend devs, PM, UX writer, QA engineer, data analyst, web dev, and device partnerships manager let us tackle complex strategic and technical challenges that user research alone couldn’t have solved.