Spring naar de inhoud

Interne trainingstool voor Linden-IT

meerdere liggende app-schermen voor Linden-IT
Overzicht van een aantal schermen uit de app voor IT-professionals van Linden-IT

Samen met mijn medestudenten Mirai van Dun, Ralf Zonneveld en Giovanni Dwidjosewojo hebben we (op afstand van elkaar) gewerkt als digital agency voor onze opdrachtgever Linden-IT. Linden-IT heeft ons de opdracht gegeven om een online platform te ontwikkelen waarin de studievoortgang van lerende IT-professionals kan worden bijgehouden en waarbij de recruiters van Linden-IT deze voortgang konden volgen. Onze oplossing: een mobile app voor IT-professionals om al hun trainingen in te kunnen bijhouden en aanvullend materiaal in te kunnen bekijken. Voor de recruiters hebben we een dashboard ontwikkeld waarvandaan de trainingen kunnen worden beheerd en voortgang kan worden gevolgd.

Tijdens dit project heb ik samen met Mirai van Dun de rol op me genomen als UX/UI designer. Hierbij waren we onder andere verantwoordelijk voor het onderzoek, het ontwerpen van de beiden platformen en het maken van een klikbaar prototype.

Vooronderzoek

Allereerst hebben we een meeting met onze opdrachtgever gehouden om een goed beeld te krijgen van de opdracht en de wensen en eisen die aan de oplevering worden gesteld. Op basis hiervan hebben we een debriefing en een plan van aanpak opgesteld en zijn we begonnen met vooronderzoek. We hebben onder andere onderzoek gedaan naar bestaande (vergelijkbare) oplossingen, deskresearch naar beïnvloedingsprincipes en geschikte technische frameworks.

Interviews

Als onderdeel van ons onderzoek hebben we interviews gehouden met IT-professionals en een senior recruiter van Linden-IT. Hierdoor hebben we een beter beeld gekregen van hoe de IT-professional momenteel zijn trainingsproces verloopt en wat hierin goed en minder goed werkt. De recruiter heeft ons goede inzichten gegeven in welke gegevens voor hun belangrijk zijn en wat zij graag als functies willen zien in het platform.

Onze vragen aan de IT-professionals

  1. Hoe ziet je dag eruit, daarmee bedoelen we; start van de dag op werk (kantoor), hoeveel dagen in de week, wanneer vrij?
  2. Heb je al eens een opleidingstraject via Linden-IT gedaan?
  3. Zo ja:
    → hoe verloopt zo’n training?
    → Hoe heb je het ervaren?
    → Wat zijn irritaties/viel tegen?
    → Hoe heb je de training aangepakt (schema, app gebruikt, overleg met collega)
    → Hoe heb je je voortgang bijgehouden?
  4. Zo niet:
    → Hoe zie je het traject voor je?
    → Heb je er zin in?
    → Hoe ga je de training aanpakken (schema maken, overleggen)
  5. Wat is je motivatie om deze training te doen?
  6. Hoelang ben je al in dienst bij Linden-IT?
  7. Wat was je werkervaring, wat voor opleiding(en)/ cursussen heb je hiervoor gevolgd?
  8. Wat zijn je plannen/bedoelingen na je dienst binnen Linden-IT?

Persona

Op basis van ons vooronderzoek en de interviews met de IT-professionals en de recruiter, hebben we twee persona's opgesteld. Door deze persona's hebben we een algemeen beeld van de gebruikers waarvoor we een oplossing ontwerpen. Hierna hebben we ook bijbehorende Empathy Maps opgesteld (niet hier getoond) die laten zien wat de persona's horen, denken, voelen, zeggen en zien. Het brengt in kaart wat de belemmeringen en doelen van de persona's zijn.

persona van IT-professional
Persona van de IT-professional
persona van recruiter
Persona van de recruiter

Customer Journey Map: huidige situatie

Met de informatie van de IT-professionals en de recruiter over het huidige verloop van de trainingen, hebben we in kaart gebracht hoe dit traject verloopt en wat de emoties van onze gebruikers zijn op de verschillende touchpoints van de ervaring. Hierdoor hebben we kunnen vaststellen welke punten in de ervaring we willen verbeteren.

Customer Journey Map van IT-professional
Customer Journey Map van de huidige situatie voor IT-professionals
Customer Journey Map van recruiter
Customer Journey Map van de huidige situatie voor recruiters

Customer Journey Map: ideale situatie

De Customer Journey Map voor de ideale situatie beschrijft welke touchpoints de gebruikers ervaren in de ideale situatie en wat hun emoties hierbij zijn.

Customer Journey Map van IT-professional
Customer Journey Map van de ideale situatie voor IT-professionals
Customer Journey Map van recruiter
Customer Journey Map van de ideale situatie voor recruiters

Hoe Kun Je's (HKJ's)

Met HKJ's kun je anders tegen het ontwerpprobleem kijken en ze helpen om gemakkelijker oplossingen te bedenken. De HKJ's die we hier hebben verzameld zijn verduidelijkt en ingedeeld op basis van de MoSCoW-methode.

Hoe kun je's op basis van de MoSCoW-methode
Hoe Kun Je's ingedeeld op basis van de MoSCoW-methode

Job Stories

We hebben de ontwerpproblemen omgezet naar Job Stories waarbij aandacht is voor de aanleiding/situatie, de motivatie/doel en het beoogde resultaat. De Job Stories volgen allemaal deze vorm: "Wanneer ik [...], wil ik [...], zodat ik [...]". We hebben de Job Stories vervolgens omgezet naar taken waar we tijdens de sprints aan hebben gewerkt.

overzicht van job stories opgedeeld in it'ers en recruiters
Overzicht van Job Stories voor de IT-professionals en Recruiters

Programma van Eisen

Door het vaststellen van de randvoorwaarden waar onze oplossing aan moet voldoen, kun je tussentijdse oplossingen toetsen aan deze randvoorwaarden. Dit helpt de oplossingen te verbeteren en om keuzes te maken uit de oplossingen. Ook deze eisen zijn ingedeeld op basis van prioriteit.

Programma van Eisen
Het Programma van Eisen ingedeeld op basis van de MoSCoW-methode

Schetsen en Morfologische Kaart

Met behulp van de HKJ's en het opstellen van Job Stories (niet hier getoond) zijn we aan de slag gegaan met het brainstormen van ideeën. We hebben vervolgens allemaal eigen schetsen gemaakt per belangrijkste (must have) HKJ's en hebben die daarna met elkaar besproken. Via de Morfologische kaart hebben we de ideeën op een rij gezet en zijn daaruit de beste ideeën (of een combinatie van ideeën) geselecteerd.

Schetsen van de mobiele applicatie
Eerste schetsen voor de mobiele applicatie voor de IT-professionals.
Morfologische kaart voor de HKJ's van de IT-professionals
Morfologische kaart met alle ideeën voor de must-have HKJ's van de IT-professionals
Schetsen van de desktop applicatie
Eerste schetsen voor de desktop applicatie voor de Recruiters.
Morfologische kaart voor de HKJ's van de Recruiters
Morfologische kaart met alle ideeën voor de must-have HKJ's van de recruiters

LoFi-ontwerpen

Door het maken van de schetsen en de selectie aan ideeën met de Morfologische kaart, hebben we goed zicht op welke onderdelen we willen uitwerken tot een eerste LoFi-versie van de applicatie. Deze versie hebben we wekelijks gepresenteerd aan de opdrachtgever, om ze op de hoogte te stellen van onze voortgang. Hieronder staan een aantal van deze LoFi-ontwerpen. Het zijn er nog veel meer, maar dit geeft een beeld van hoe we onze eerste ideeën en ontwerpen hebben getoond aan de opdrachtgever. De uitdaging was vooral om voor de recruiter zoveel mogelijk nuttige informatie te tonen, zonder dat het dashboard te druk werd. Ook hebben we gekeken naar welke zaken een recruiter moet kunnen invullen binnen het platform om deze informatie vervolgens te kunnen tonen aan de IT-professionals.

lo-fi schermontwerpen voor de IT-professionals
Eerste LoFi-ontwerpen voor de IT-professionals
lo-fi schermontwerpen voor de IT-professionals
Eerste LoFi-ontwerpen voor de IT-professionals

Uit de interviews met de IT-professionals kwam onder andere naar voren dat ze het soms lastig vinden om leerdoelen vast te stellen. Daarom hebben we in de app voor de IT-professionals een functionaliteit toegevoegd die helpt om leerdoelen in te stellen wanneer er aan een nieuwe cursus wordt begonnen.

lo-fi schermontwerpen voor het vastellen van leerdoelen voor IT-professionals
Eerste LoFi-ontwerpen voor het instellen van leerdoelen

Voor de recruiters hebben we een desktop webapplicatie ontworpen, waarbij alle cursussen en IT-professionals kunnen worden beheerd. Vanuit hier is het mogelijk om nieuwe cursussen aan te maken, bestaande cursussen te bewerken en de voortgang/afspraken met IT-professionals bij te houden.

lo-fi schermontwerpen voor de recruiters
Mogelijkheid voor recruiters om nieuwe cursussen toe te voegen.
lo-fi schermontwerpen voor de recruiters
Per cursus kan de voortgang van de IT-professionals nauwkeurig in de gaten worden gehouden.
lo-fi schermontwerpen voor het aanmaken van een quiz
De recruiters kunnen het cursusmateriaal aanpassen en bijvoorbeeld een quiz toevoegen.

HiFi-ontwerp

Na de presentaties aan de opdrachtgever voor de eerste LoFi-ontwerpen zijn we aan de slag gegaan met het ontwerpen van de HiFi versies. Hierbij hebben we binnen Figma gewerkt met design componenten, om het design zo goed mogelijk te kunnen laten uitwerken door de developers en een consistente stijl aan te houden. De uitgewerkte schermen zijn gepresenteerd als interactief (klikbaar) prototype.

overzicht van design componenten in de huisstijl van Linden-IT
De design-componenten in de huisstijl van Linden-IT om het design over te dragen aan de developers
overzicht van hifi-ontwerpen voor de mobiele app voor IT-professionals
Het overzicht en de inhoud van cursussen voor de IT-professionals
overzicht van hifi-ontwerpen voor de mobiele app voor IT-professionals
Het instellen van de leerdoelen voor de IT-professionals
dashboard schermen voor de recruiters
Dashboard-overzicht met informatie over voortgang voor de recruiters
cursus toevoegen schermen voor de recruiters
Schermen voor het toevoegen van een cursus door de recruiters

HiFi-prototype

Bekijk alle schermen van de beiden ontwerpen in de uitgewerkte prototypes.

Mobiele app voor IT-professionals

Desktop app voor Recruiters