Ben je gedurende de gehele periode bezig geweest met de ontwikkeling van producten. Toon aan dat je hierin Agile hebt gewerkt. Hoe is de keuze voor het gebruikte ontwikkelplatform en de gekozen taal tot stand? Hoe heb je jullie prototype en onderdelen getest? Toon op basis van testresultaten de doorontwikkeling van jullie oplossing aan.
Ontwikkelomgeving
Om een technisch prototype te ontwikkelen hebben wij een aantal stappen ondernomen om verschillende omgevingen in te richten om te ontwikkelen, testen en demonstraties uit te voeren. Dit hebben wij deels volgens OTAP-principe uitgevoerd.
Een passende workflow voor rapid prototyping
Gedurende het project zijn wij van plan om vaker te gaan testen en demonstraties voor te bereiden. Aangezien wij een interface moeten maken die via de browser op een smartboard draait, hebben wij de keuze gemaakt om aan de slag te gaan met een javascript font-end framework.
In het vorige medialab project heb ik kennis gemaakt met een nieuw platform genaamd Netlify. Dit is een platform waar je eenvoudig een git repository kan koppelen om live te zetten via een unieke url. De meeste JavaScripts frameworks worden ondersteund door Netlify, dit is ideaal om een OTAP-workflow op te zetten.
De vraag is dan ook hoe wij verschillende prototypes kunnen online kunnen zetten en hoe wij dat kunnen gebruiken om te testen. Om deze redenen heb ik de keuze gemaakt om technische experimenten en prototypes via netlify live te zetten. Dit heb ik voornamelijk gecommuniceerd met Timon omdat die samen met mij verantwoordelijk is voor de ontwikkeling van het technisch prototype. Via Netlify heb ik verschillende versies van de prototype live gezet, dit heb ik gedaan door master branch als productieomgeving te builden en staging branch als test omgeving.
In het dashboard van Netlify heb ik een nieuwe site aangemaakt. Die heb ik vervolgens gekoppeld met onze GitHub repository en de main branch uitgekozen om automatisch te builden bij nieuwe commits en merges.
Op het moment dat er een nieuwe commit wordt gedaan naar deze branch, wordt er automatisch een nieuwe versie gebuild en gepubliceerd.
Door deze aanpak hebben wij twee live versies gebruikt. Een productieomgeving voor demonstraties en testomgeving om nieuwe features op te testen. Deze zijn afzonderlijk van elkaar bereikbaar en kunnen elkaar niet beïnvloeden. Door dat de aanpassingen
Deze workflow is heel essentieel geweest tijdens het ontwikkelen van het prototype. Het heeft ons veel tijd bespaart met door automatisch bouwen van nieuwe versies. Zo konden bij eenvoudig verschillende versies testen en via een link delen met anderen. Het gebruik van Netlify of andere CI/CD Platformen kan ik zeker aanraden tijdens prototyping, aangezien de tijd die je bespaart bij het doorontwikkelen.
Gekozen tools en frameworks
Bij het onderzoeken van verschillende frameworks, hebben we het gehad over de mogelijke frameworks om te gebruiken voor ontwikkeling van het interface. De keuze is gevallen op Next.js wegens de achtergrond die wij hebben in React door de programmer lessen en mijn persoonlijke ervaring met het framework.
Om rekening te houden met onze persoonlijke leerdoelen heb ik voorgesteld om aan de slag te gaan met de nieuwe beta versie van het framework. Dit zag ik als een kans om kennis te maken met de toekomstige versie van het framework en bekend te worden met nieuwe concepten binnen de wereld van javascript frameworks.
Via de website van Vercel heb ik de documentatie van het framework kunnen volgen om een nieuw project op te zetten. Om snel aan de slag te kunnen gaan met uitwerken van ontwerp van het prototype heb ik een aantal libraries voorgesteld om te installeren in het project. Wij hebben de volgende libraries gebruikt:
Deze voorbereiding heeft ontzettend geholpen tijdens de korte development sprint. Doordat alle functionaliteiten van de libraries goed samen werkten, konden wij eenvoudig generieke componenten maken die wij hebben kunnen herbruiken in de gehele applicatie.
Project management
Ter voorbereiding van het ontwikkelen van de prototype heb ik voorgesteld om te werk te gaan volgens scrum principes. Al gauw kwamen wij er achter dat wij niet meer dan een sprint konden uitvoeren toen hebben wij de keuze gemaakt om toch een sprint in te plannen omdat wij op die manier goed konden kijken welke onderdelen haalbaar waren om te ontwikkelen.
Om samen te werken in sprints, heb aan Timon voorgesteld om te werken in Jira. Daarna heb ik via atlassian een jira omgeving aangemaakt waarbij wij samen het project kunnen beheren. Wij hebben hiervoor afspraken gemaakt hoe wij te werk gaan en hoe wij nieuwe features ontwikkelen.
In Jira heb ik een kanban template gebruikt voor het board. Dit bestaat uit de volgende kolommen: backlog, in progress, in review en done.
Dit zijn de vier fases waar een storie/bug zich in kan bevinden. Wij hebben afgesproken dat deze stories altijd onder een epic valt.
Project timeline
Jira heeft een timeline feature die wij gebruikt hebben om in te schatten wat haalbaar was om te ontwikkelen.
Dit overzicht hebben wij gebruikt om user-stories te koppelen aan een epic(categorie) om zo een goed overzicht over de voortgang per onderdeel van het prototype.
Zo hebben wij de taken verdeeld door stories te koppelen aan epics en een persoon te binden aan een epic.
Op deze manier voorkomen wij dat er mogelijke conflicten komen tijdens het ontwikkelen en/of samenvoegen van nieuwe features.
Git workflow
Onderling hebben we afgesproken om elke story te ontwikkelen op een apart branch die afstamt van de main branch. De naamconventie is de jira ticket nummer en voor de commits houden wij de volgende format aan:
"PROT-8: Beschrijving van feature". Dit hebben wij aangehouden om pull requests beter te beoordelen. Door mijn koppeling met Netlify worden er op deze manier automatisch previews gemaakt van de prototype met de nieuwe feature
De andere ontwikkelaar kan deze dan gebruiken om te controleren of deze goed is om mee te nemen in de nieuwe versie.
De gekozen workflow heeft ons geholpen met implementeren van nieuwe features. Dit ging goed, alleen was deze manier van werken nieuw voor Timon. Na het uitleggen en wat tips is dit goed verlopen. Wegens het gebrek aan tijd voelde dit als een complexe setup, maar het heeft wel in ons voordeel gewerkt door het gemak van de deploy previews. Op deze manier hebben wij verschillende versies kunnen testen en onderling kunnen delen met CMD'ers zonder enige code te hoeven op sturen. Op deze manier konden wij snel feedback verkrijgen en verwerken.
Prototyping en testen
Voor de prototyping party heb ik samen met timon het onboarding process uitgewerkt. De bedoeling van dit process is dat de gebruiker zonder enige assistentie verbinding kan maken met de smartbord via de tablet. Om bruikbare inzichten uit het test gelegenheid te halen hebben wij een testplan opgezet.
Samen zijn wij gaan zitten om te bepalen wat belangrijk is om te meten. Wij zijn gekomen op de volgende hypotheses om te testen:
- De gebruiker kan zonder hulp van een persoon de trainingscode invoeren?
- De gebruiker kan meerdere namen toevoegen en achteraf corrigeren.
- De gebruiker weet zijn toegewezen rol en weet dat hij moet wachten tot de training wordt gestart.
Om de testpersonen te ondersteunen, hebben wij open vragen opgesteld om te vragen tijdens de testen.
Link naar miro board
Resultaat/reflectie
De resultaten van de user testing heeft geleid tot een overzicht met punten waar gebruikers tegen aan liepen.
Deze punten heb ik vervolgens in als een bug in Jira geplaatst en hebben wij dit meegenomen in de laatste iteratie voor de eindpresentatie.
Link naar test resultaten
Het testen van dit het onboarding process heeft geleid tot waardevolle inzichten. Tijdens de eindpresentatie gaf de opdrachtgever feedback op het concept en gaf daarbij aan dat wij minder moesten focussen op het onboarding process, maar meer op de kern van het concept. Dit heeft mij aan het denken gezet over de prioriteiten die wij gesteld hebben. Wij hadden vanaf het begin moeten focussen op de interactie met de kaart en minder te na druk leggen op het volledige process. Vooral wanneer je beperkte tijd hebt om een concept te bedenken en uitwerken.