10 januari 2019

Nieuw design voor VoIPGRID platform: Deel 2. Het project

In het tweede deel van onze serie over VoIPGRID’s vernieuwde platform laten we twee ontwikkelaars aan het woord: Tom (front-end developer) en Ron (front-end designer). Een product waar ruim 10 jaar aan wordt gewerkt, is natuurlijk niet zomaar te vervangen. Wat komt er kijken bij zo’n grootschalig project en waar begin je?

Hoe kwam het project tot stand?

Tom:  Collega’s Tim (UX researcher) en Luuk (UX designer) begonnen twee jaar geleden met het onderzoek naar een toekomstbestendig VoIPGRID. Er werd besloten dat het scheiden van de front- en back-end noodzakelijk was om de schaalbaarheid te kunnen waarborgen en verbeteren. Samen met partners en eindgebruikers werd onderzocht wat er nodig is om een nieuw ontwerp te realiseren. Op basis van deze bevindingen werd een prototype ontwikkeld, dat het startpunt werd van de nieuwe vormgeving.

Waaruit bestond jullie bijdrage?

Ron:  Na het voltooien van het prototype gingen wij aan de slag. Omdat het product in tien jaar is uitgegroeid tot een enorm complex project, spelen er ontzettend veel factoren mee bij het herbouwen. Daarom hebben we besloten om het platform te herbouwen op basis van kleinere projecten. Dit maakt het werk overzichtelijker en geeft beter inzicht wanneer iets af is. We hebben alle CSS, HTML en JavaScript herschreven, module per module. Zo hebben we het prototype doorvertaald naar een werkende versie van de nieuwe portal.

Tom:  Nadat dit werk was voltooid, werd opnieuw een gebruikersonderzoek uitgevoerd onder onze partners. De focus lag hierbij op de impact van het eindresultaat op de eindgebruikers. Omdat er functioneel niets verandert, verwachten we dat de gebruiker snel zijn weg vindt in het nieuwe design. Dit bleek inderdaad zo te zijn. Op basis van de feedback van partners en een laatste check van onze quality assurance collega’s werden de laatste visuele verbeteringen doorgevoerd.

Het project heet intern “Hybrid Moments”, waarom?

Ron:  Om de front-end van de back-end te kunnen scheiden en de portal zo van verschillende losse technische lagen te voorzien, moeten we in een aantal tussenstappen de onderdelen ombouwen. De codebase in één keer herschrijven is door de omvang geen optie. Doordat de code per module wordt herschreven, ontstaat er een periode waarin de nieuwe en oude code naast elkaar bestaan. Een soort hybride oplossing dus. Uiteindelijk wordt de oude code uitgefaseerd en hebben we een compleet herschreven applicatie.

Waar lag voor jullie de grootste uitdaging?

Tom:  De meeste tijd binnen dit project zijn we kwijt geweest aan het schrijven van herbruikbare componenten en het verwijderen van code uit een standaard framework dat we voorheen gebruikten. We zijn begonnen met het opzetten van de CSS-hiërarchie en bouwstraat voor deze nieuwe hiërarchie. Hierna zijn we stap voor stap de modules bij langs gegaan en hebben deze waar nodig herschreven. Omdat ons primaire CSS-bestand alle andere bestanden importeert, konden we op een visuele manier bijhouden welke bestanden we al herschreven hadden. We hebben alle onnodige JavaScript verwijderd, veel code gesimplificeerd en daarbij een hoop (oude) afhankelijkheden verwijderd. Dit was veruit de grootste klus.

Wat was het leukste onderdeel van dit project?

Tom:  Het leukste aan het project was zonder twijfel het samen zien komen van de nieuwe code en de oude code uitfaseren. Het moment dat we alle oude code verwijderd hadden en het hele platform nog gewoon overeind stond was super. Ook de gebruikersonderzoeken bij de partners waren erg leuk om te doen. Het is interessant en waardevol om te horen hoe partners en eindgebruikers het platform ervaren en hoe ze de veranderingen zien.

Ron:  Gebruikersonderzoek steekt er voor mij met kop en schouders boven uit. Tijdens deze sessies bij onze partners verzamelden we veel feedback en inzichten over het dagelijks werken in de portal. We konden zo de nieuwe portal aan een stevige test onderwerpen. Het leuke eraan was dat gebruikers soms echt de kleinste nieuwe details zagen en anderzijds ook enkel puur een gevoel konden beschrijven hoe de nieuwe portal overkwam. Op basis van de feedback hebben we tijdens het project direct de nodige iteraties doorgevoerd.

En, wat gaat er gebeuren na 21 januari?

Ron:  Ook na de livegang van de nieuwe portal op 21 januari zullen we gebruikersonderzoek blijven doen en verbeteringen blijven doorvoeren, want we hebben nog veel meer ideeën om het allemaal nog gebruiksvriendelijker te maken. Functioneel werkt de portal nog steeds voor 98% op dezelfde manier en daar is ook bewust voor gekozen. De volgende stap na het afronden van dit project is om per module of feature te kijken wat er functioneel nóg beter kan. Door deze ontwikkelingen kunnen we het platform blijven uitbreiden en verbeteren!

Stuur ons je vragen!

Wil je meer weten over de technische kant van het project of heb je een andere vraag aan onze developers? Stuur deze dan naar contact@voipgrid.nl.

In de volgende blogpost van deze serie duiken we in de verschillen tussen de huidige en de nieuwe portal. Wat ga je als gebruiker van het platform nou echt merken van de vernieuwingen? Je leest het in deel drie.

Waarom we ons VoIP platform zo grondig aanpakken? Dat vertellen we in de eerste blogpost van deze reeks.