SportCity

SportCity

Introduction of the Renewal via the app. Increased conversion from 4.000 to 40.000 renewals per year

ING-SparQ website

Problem

Members had no way to renew their membership without visiting the club.

When a membership was about to expire, members had to go to the front desk during opening hours and fill in a paper form. Staff scanned it and sent it to HQ, where it was manually re-entered into the system; slow and error-prone. Whenever pricing changed, new forms had to be designed, printed, and distributed to every club. The process was costly for the organisation and inconvenient for members.

Solutions

A self-service membership renewal flow, built directly into the SportCity app.

Members can now renew from their phone, at any time. The flow reuses existing account data — current club, membership type, and payment details — so there's minimal input required. Members choose a duration, see the price clearly (including a discount for committing to a longer term), and confirm in a few taps. The paper form is gone, and so is the manual processing at HQ.

Process:

1. Wireframe
2. UI design
3. Prototype
4. Usability test in club

Role:

  • UX design

  • UI design

  • Prototyping

  • Research

Tools:

  • Figma

  • FigJam

Year:

  • 2025

Personal stuff I learned

I moved into UI design before the layout was fully validated. As a result, we kept revisiting the structure and moving elements around in high-fidelity — which takes significantly more time than adjusting a wireframe. Staying in low-fidelity longer would have been faster overall.

The renewal flow converted so well that marketing shifted focus from new member acquisition to existing member renewals. A feature built to improve a process ended up influencing where the business put its budget.

During usability testing, one participant thought that we didn't want them to choose the "Customize your membership" option because it was visually smaller than the two cards above it. But that option required less info than the two predefined membership above it, making it smaller. We didn't want to direct users to the larger options

Usability test

To validate the design before development, I built a prototype and conducted usability tests with 4 SportCity members at the club.

"It's similar to renewing an energy contract, not difficult."

Key findings across all sessions:

Findability needs work Multiple users didn't expect to find the renewal option under "Membership." Two user looked under "My Club" first, which felt more intuitive to them.

Confirmation is everything All 4 users missed a clear success state after completing the renewal. They were left uncertain whether anything had actually happened.

Changing bank details caused confusion The €0.01 verification payment wasn't explained well enough. Users were surprised by an unexpected payment request and didn't understand why it was needed.

Price transparency matters Users wanted to understand what they'd pay after the contract period ends, not just during it. One user also felt the yellow highlight and "most chosen" label pushed them too hard towards City Plus.

Overall the flow tested well Scores ranged from 7 to 8 out of 10. Users found the duration options and price overview clear.

Renewal UI flow

From plan selection to confirmation, the full renewal flow in 4 steps.

Testing on wireframe