GitlabHost Dashboard
Ik bouwde de front-end van het GitlabHost-dashboard van ontwerp tot live UI. Onboarding, instance- en runnerbeheer, billing, support en instellingen komen samen in één product dat in de praktijk consistent aanvoelt.
- Periode
- 2025
- Rol
- Lead front-end engineer
- Stack
-
-
Django
-
HTMX
-
Alpine.js
-
Tailwind CSS
-
Chart.js
- DU Dashboard UX
-
Uitdaging
Het dashboard moest veel verschillende workflows en states ondersteunen, zonder dat het als losse schermen aanvoelde.
Aanpak
Martijn zette de visuele richting neer. Ik vertaalde die naar herbruikbare Django-templates en front-end componenten met HTMX, Alpine.js, Tailwind CSS en Chart.js. We liepen de belangrijkste gebruikersflows in de browser door en legden de relevante states vast, zodat ontwerp en implementatie in sync bleven. De feature-level technische implementatie is uitgevoerd door het interne development team van GitlabHost.
Resultaat
Het dashboard voelt nu als één product in plaats van losse onderdelen. Ook bij complexere flows blijft het overzichtelijk, en nieuwe modules zijn toe te voegen zonder de UI opnieuw op te bouwen.
Impact
- 22 kernschermen geselecteerd uit een volledige route-inventarisatie.
- Gedeelde UI-patronen over onboarding, billing, support en instellingen.
- Snellere overdracht doordat nieuwe states bestaande UI-structuren hergebruiken.
Credits
UI-ontwerp door Martijn Runia
Front-end architectuur en product-UI implementatie door Frank Spin
Feature-level technische implementatie door het interne development team van GitlabHost
