Productivity Dashboard

Dit dashboard maakte ik als opdracht voor het vak Interaction Design, in mijn eerste semester aan Howest MCT. De opdracht was om een interactieve, datagedreven interface te ontwerpen die op één scherm laat zien hoe iemands werkdag eruitziet: prestaties, taken, planning en communicatie.

Ik koos voor een dashboard-concept met een vast grid van kaarten, zodat een gebruiker in één oogopslag alle belangrijke informatie ziet zonder te moeten scrollen of klikken. Elke kaart (Performance Metrics, Activity, Task Summary, Daily Schedule, AI Summary Overview en Upcoming Meetings) kreeg een eigen visuele hiërarchie, met kleuraccenten en iconen om snel de juiste informatie te herkennen.

Voor de uitwerking bouwde ik de interface met React en Vite. Om de code herbruikbaar en onderhoudbaar te houden, werkte ik met één generieke kaartcomponent die als basis dient voor alle widgets, en stuurde ik de inhoud van elke kaart aan via aparte databestanden, zodat content en weergave netjes gescheiden blijven. Ik voegde ook interactie toe, zoals een inklapbare zijnavigatie die zich aanpast aan de schermbreedte, en een pop-over bij de geplande meetings.

Vooral het componentdenken viel me hier op: een interface met zoveel herhalende structuren vraagt om een generieke kaartcomponent en een datagedreven opbouw. Zo kon ik snel nieuwe widgets toevoegen zonder telkens dezelfde stijl opnieuw te schrijven.