Edumundo App
Het gamified leerplatform voor mbo-studenten — met challenges, medailles, ranglijsten en groepsopdrachten.
In 2025 leidde ik het volledige UI/UX-traject voor de doorontwikkeling van twee producten tegelijk: BOOM Burgerschap en AstraZeneca. Van stakeholderbespreking en feature-prioritering tot volledig uitgewerkte Figma-designs, iteratieve feedbackronden en overdracht aan development.
Context
De Edumundo App bestaat al langer als engagement-platform: studenten leren via challenges, verdienen medailles en zien hun score op een ranglijst. In 2025 was het tijd voor een flinke doorontwikkeling.
Twee producten stonden centraal: de Burgerschap-module (uitgegeven met BOOM, voor mbo-studenten) en het AstraZeneca-leertraject (voor medewerkers in de medische sector). Beide draaien op dezelfde technische basis, maar elk met een eigen visuele identiteit en kleurschema.
Van wensensessie tot overdracht
Wensensessie
Gestart met een gezamenlijke sessie met de product owner en de content-/projectmanager. We liepen de feature-wishlist door: uitgebreid medaillesysteem met animaties en overlays, verbeterd voortgangsoverzicht, privégroepsranglijsten, nieuwe challengetypen (foto, video, voting, scavenger hunt) en uitbreidingen voor de docentrol (punten toekennen, challenges beheren). Per feature legden we vast wat er die maand moest landen en wat later kon.
Figma-design
Elk scherm uitgewerkt in Figma binnen het bestaande design system (gebaseerd op Material Design 3, met custom kleurthema's per product). Voor Burgerschap: warme oranje/amber tinten. Voor AstraZeneca: donkerblauw/navy. Ontworpen schermen: login, dashboard, thema- en unit-overzicht, story-schermen, theorie met hotspot-feedback, polls, challenges (quiz, open vraag, media), medailledetails en ranglijst met groepsfunctie.
Feedbackronde & overdracht
Na de eerste designronde volgde een gestructureerde feedbacksessie met development. Punten rond leesbaarheid van titels, gradient-contrast, navigatiebugs en kaartafmetingen werden gedocumenteerd en verwerkt. Daarna zijn de designs overgedragen voor implementatie.
Schermen
Eén systeem, twee thema's
De app is gebouwd op een intern design system dat ik opzette in Figma, gebaseerd op Material Design 3. Het systeem bevat een volledige componentenbibliotheek (buttons, cards, navigation bars, chips, dialogs, bottom sheets, badges, etc.) en twee kleurthema's die per product inwisselbaar zijn. Zo bedienen Burgerschap en AstraZeneca dezelfde codebase met een eigen merkbeleving.
Producten
BOOM Burgerschap
Leerapp voor burgerschap in het mbo, uitgegeven in samenwerking met BOOM. Studenten volgen thema's en units, doen challenges en verdienen punten op een ranglijst. Kleurpalet: warm oranje op beige/crème achtergrond.
AstraZeneca
Leertraject voor medewerkers in de medische sector. Schermen omvatten theorie met hotspot-feedback, open vragen, een medisch dossier pop-up en een uitgebreid medaillesysteem. Kleurpalet: donkerblauw/navy met oranje accenten.
Resultaat
BOOM Burgerschap en AstraZeneca bediend vanuit één codebase met eigen merkbeleving
Login, dashboard, thema's, theorie, story, polls, challenges, medailles en ranglijst
Material Design 3-basis met inwisselbare kleurthema's per product
De designs werden volledig afgerond en overgedragen aan development. Feedbackpunten uit de reviewronde — leesbaarheid van themakaarten, gradientcontrast, navigatiegedrag, kaartafmetingen — zijn verwerkt vóór overdracht. Het medaillesysteem, de groepsranglijst en de nieuwe challengetypen zijn als eerste opgeleverd.