Van QR-scanner naar motiverende gym-app
De BigGym app wordt vooral gebruikt om met de QR-code binnen te komen, terwijl functies als lesreserveringen en abonnementsbeheer nauwelijks worden gebruikt. Vergeleken met concurrenten mist de app functies die leden helpen bij hun workouts. Op basis van gebruikersonderzoek en een concurrentieanalyse heb ik de usability verbeterd. Daarnaast heb ik functies toegevoegd die leden motiveren om de app voor meer te gebruiken dan alleen inchecken.
- Rol
- UX/UI-designer
- Team
- Soloproject
- Tools
- Figma
- Tijdlijn
- ± 1 maand
Het probleem
In de praktijk wordt de BigGym app bijna alleen gebruikt om bij binnenkomst de QR-code te scannen. De meeste andere functies blijven onbenut. De app biedt weinig dat leden helpt met hun trainingsroutine, waardoor er nauwelijks betrokkenheid is buiten het inchecken om.
Onderzoek
Om te begrijpen waarom de app zo weinig gebruikt werd, combineerde ik drie soorten onderzoek. Ik keek naar hoe leden de app nu gebruiken en wat ze nodig hebben, waar de bestaande app vastloopt op usability en toegankelijkheid, en hoe BigGym zich verhoudt tot concurrenten.
Interviews met leden
Om te zien hoe de app in de praktijk gebruikt wordt, interviewde ik drie BigGym-leden. Alle drie gaven aan de app alleen te openen om de QR-code te scannen. Dat zie je terug op de homepage, want daar staat vooral de scanknop, met daarnaast een widget met nieuws of een oproep als “Join the team”.
Zij zien de app dus vooral als een toegangspas. Er is voor hen weinig reden om de app op andere momenten te gebruiken, terwijl ze wél behoefte hebben aan ondersteuning bij hun trainingen.
Usability- en WCAG-evaluatie
Ik liep de bestaande app systematisch na op usability- en toegankelijkheidsproblemen (WCAG). Die zitten vooral bij het inloggen en de navigatiebalk onderin. Het contrast was daar het grootste probleem.
- De link “Wachtwoord vergeten?” heeft te weinig contrast met de witte achtergrond. Juist die link heb je nodig als je niet meer kunt inloggen.
- In de navigatiebalk valt het actieve item weg tegen het grijs, terwijl dat juist laat zien waar je bent in de app.
Concurrentieanalyse
Ik vergeleek BigGym met BasicFit, PureGym en SmartGym op functies, reviews en beoordelingen. Die beoordelingen gaan niet alleen over de app, maar over de hele dienstverlening, zoals de klantenservice en het personeel. BigGym scoorde het laagst, met klachten over de service, verouderde visuals, onduidelijke navigatie en het gebrek aan functies naast inloggen. Concurrenten boden juist workout- en voortgangsfuncties die leden betrokken houden.
Onderzoeksconclusie
Op basis van al deze inzichten bepaalde ik de belangrijkste oplossingen en aanpak. Dit nam ik mee naar de ideatiefase:
- De usabilityproblemen aanpakken, vooral omdat die zitten in functies die leden juist vaak nodig hebben.
- Schermen om aan te pakken: het inloggen, het dashboard op de home pagina en de scanfunctie zelf. Het dashboard moet meteen laten zien dat de app meer doet dan scannen, en de scanfunctie is veruit het meest gebruikt.
- Een workoutspagina toevoegen, omdat concurrenten die functie wél bieden.
Van schets naar ontwerp
Met de inzichten uit het onderzoek werkte ik van ruwe schetsen naar een uitgewerkt, high-fidelity prototype.
Referenties & inspiratie
Eerst verzamelde ik inspiratie uit andere fitness-apps om te zien hoe zij workouts, voortgang en lesreserveringen presenteren.
Wireframes
Vervolgens schetste ik low-fidelity wireframes om de nieuwe structuur en schermen uit te werken, met notities over wat beter kon. Van elk scherm maakte ik meerdere opties, zodat ik varianten naast elkaar kon leggen en de beste kon kiezen.
Kleur & typografie
Ik legde een kleurenpalet en typografische schaal vast, zodat het ontwerp consistent bleef. De kleurcombinaties controleerde ik op WCAG-contrast, zodat tekst ook voor slechtziende leden goed leesbaar is.
High-fidelity prototype
Ten slotte werkte ik de schermen uit tot een high-fidelity prototype in Figma, van het inloggen tot de nieuwe homepage, workouts en de verbeterde QR-scan.
Belangrijke keuzes
Een motiverende homepage
Een nieuwe homepage die leden stimuleert om de app voor hun trainingen en voortgang te gebruiken, zodat het niet voelt alsof de app er alleen is om te scannen.
Voortgang zichtbaar maken
Voortgang in beeld gebracht om leden te motiveren en het app-gebruik te vergroten.
Bestaande UX- en UI-problemen oplossen
De verouderde interface en usabilityproblemen aangepakt om de app prettiger en duidelijker te maken.
Kernfuncties inloggen en QR-scan verbeteren
Extra aandacht voor het inloggen, waar de meeste usability- en WCAG-problemen zaten, en voor de QR-scan, veruit de meest gebruikte functie van de app.
Trainingen plannen en bijhouden
Functies toegevoegd waarmee leden hun trainingen kunnen plannen en volgen, zodat de app hen echt helpt in plaats van alleen toegang te geven.
Resultaten
In het herontwerp voelt de app niet langer als een simpele QR-scanner. De belangrijkste verbeteringen:
- Een vernieuwde, minder verouderde interface met verbeterde UI.
- Een nieuwe homepage die de app meer maakt dan alleen inchecken.
- Workout-opties die nieuwe én bestaande leden motiveren.
- Lesreserveringen op meer plekken onder de aandacht gebracht.
- De bezoekmonitor naar voren gehaald. Deze leuke functie zat eerst verstopt in de instellingen.
Eerdere versie
Vernieuwde versie
Reflectie
Als ik opnieuw met gebruikers zou testen, zou ik meer focussen op het reserveren van lessen. BigGym-medewerkers promoten lessen vooral in de sportschool zelf, maar nauwelijks in de app. Daar ligt nog ruimte om leden te activeren en de app nog waardevoller te maken.