logo
Mark

UX Design PE online


PE-online is een monitoring systeem. PE-online brengt beroepsorganisaties, professionals en aanbieders van educatie samen in één platform, bijvoorveeld voor het verzorgen van: accreditatie en registers.


Wat heb ik gedaan voor PE-online?

PE-online is een systeem wat al jaren bestaat. Qua ontwerp en gebruiksvriendelijkheid lagen mogelijkheden voor vernieuwing. Ik ben gevraagd om een verbeterslag te maken aan de gebruiksvriendelijkheid en het design. 




Uitdaging 

PE-online wordt door meer dan een half miljoen mensen gebruikt, die zijn gekoppeld aan beroepsorganistaties.

Deze organisaties hebben de wens om hun huisstijl terug te zien in het interface van PE online. 

Onderzoek 

Na gebruikersonderzoek blijkt dat huisstijlkleur voor de meeste herkenning zorgt bij gebruikers. 

Daardoor heb ik het interface zo ontworpen dat kleur slim ingezet kan worden om herkenning te versterken.


Het proces

Het ontwerp voor pe-online stapsgewijs verlopen. Het project is nog steeds ongoing. Ik neem je graag mee in de stappen die ik heb gezet als ontwerper. 

Aanpak 

Pe-online is een vrij uitgebreid SaaS product. Daarom is gekozen om het project op te delen in kleinere projecten en onderdelen.

Het onderstaande proces beschrijft de totstandkoning van het eerste project. Dit ging om een openbare zoekfunctie in het register. 



 

Kick-off

Na verschillende afspraken en een kennismaking, heb ik een kick-off meeting georganisaseerd. Met als doel iedere betrokkene te betrekken bij het proces en de verwachten af te stemmen.


Start ontwerp

Er was veel laaghangend fruit wat betreft het huidige ontwerp. Daarom heb ik eerst twee concepten gemaakt, waarbij ik oplossingen heb gegeven voor het laaghangend fruit. 


Testen

Ik heb de twee ontwerpen getest bij mogelijke gebruikers. Deze gebruikers heb ik geinterviewd en een korte opdracht gegeven, om inzicht te krijgen over het gebruik.


Delen en presenteren

Ik heb de 2 ontwerpen en testresultaten gedeeld met de opdrachtgever. Er is een keuze gemaakt voor een ontwerp. Hierbij is ook nadrukkelijk gekeken, naar de technische haalbaarheid en impact. 


Door ontwerpen

Na de presentatie hebben we keuzes en conclusies gemaakt. Een belangrijk punt, want deze keuze, is ook bepalend voor de overige schermen van functies van PE-online. 



Aanpassen en finetunen

We hebben vervolgens nog een aantal aapassingsrondes gedaan aan het ontwerp. Voordat het ontwerp is opgeleverd aan de technische ontwikkeling.  



Aanlevering

Ik heb verschillende schermen en voorbeelden aangeleverd in Adobe XD. Waar nodig heb ik video’s gemaakt met uitleg.





Conclusies en keuzes 

Pe online is een groot platform, om het project behapbaar, haalbaar te betaalbaar te houden, was opknippen in delen nodig. Ik deel graag nog wat insights over dit project. 

Veel verschillende gebruikers
PE-online is zo ontworpen dat verschillende gebruikers ermee kunnen werken. Dit houdt in dat je het ontwerp moet baseren op standaarden waar gebruikers al bekend mee zijn.
Oplossing
Zo simpel mogelijkhouden. Niet het wiel opnieuw uitvinden, maar gebruik maken van UI onderdelen, die al enige tijd bekend zijn bij een breed publiek. 


Meerdere organisaties
Als een interface door meedere organisaties en professionals wordt gebruikt. Moet het ontwerp in potentie, bij de meeste organisaties passen, of in ieder geval niet te veel afwijken.
Oplossing
Maak het ontwerp aanpasbaar. Kleur bleek na onderzoek, bij de meeste test personen voor herkenning te zorgen. Daarom een simpel ontwerp, met mogelijkheden voor kleur integratie.


Beperken
Omdat er voor een relatief grote doelgroep een interface wordt gemaakt, kun je moeilijker een eigen merk-indentiteit kwijt. Of hele specifieke UI elementen toevoegen. Deze beperkingen, bepalen deels het uiterlijk van PE-online.



Specifieke wensen 
Iedere organisatie heeft ook zijn eigen wensen qua getoonde inhoud. Bij de ene organisatie, wordt bepaalde info wel getoond, bij de andere niet. De content is overal anders! 

Oplossing
De situaties die het meeste voorkomen, heb ik als vertrekpunt gebruikt.

 
Veel kennis en informatie
De opdrachtgever heeft veel kennis, ervaring en informatie over het product.  En over het gebruik ervan. Dit was nuttige info, dat hielp bij het maken van keuzes.
Oplossing
Inzichten en kennis goed optimaal gebruiken. 



Weinig gebruikt
Een professional maakt niet vaak gebruik van Pe-online. De frequestie is een paar keer per jaar. 
Oplossing
Rekening houden waar je wel en geen tijd in stopt. 



Design system
Ik heb een design system gemaakt die de basis vormt voor de gehele UI.


Het nieuwe interface

Het ontwerpen is nog in volle gang. Ik kan nog niet te veel inzoomen op de specifieke details van het ontwerp. Deze pagina zal ik in de loop van tijd verder bijwerken.




Portfolio shortcut

Ben je op zoek naar een specifieke voorbeelden? Hier vind je in no time concrete voorbeelden van mijn ontwerpen.


Bekijk een overzicht van al mijn werk.


Zij gingen je voor


Benieuwd hoe mijn opdrachtgevers de samenwerking met mij ervaren?





Bekijk de referenties van mijn klanten.
 
Lees referenties

contact & info



Contactgegevens
Niels Visser
info[at]niels-visser.com

bezoek
Speelhuislaan 171
4815 CD Breda

post
Zeisstraat 45
4818 EE Breda
Social media
︎

KVK
Graffiare
Kamer van Koophandel: 77934709

Niels Visser Copyright 2023