g

Schoolings.

In 2019 kreeg ik voor het vak informatica de opdracht een website en app te maken over een zelfbedacht concept. Samen met twee vrienden heb ik een fictieve app gemaakt waar leerlingen van de middelbare school hun huiswerk en aantekeningen kunnen organiseren.

De opdracht

De opdracht die we kregen van het vak informatica was vrij simpel: bedenk een concept en werk dit uit met behulp van een website en/of app. Samen met twee klasgenoten ben ik aan de slag gegaan met het maken van een app waar leerlingen hun huiswerk en aantekeningen kunnen opslaan en met elkaar kunnen delen.

We kregen erg veel vrijheid in de uitwerking van de opdracht, dat was voor ons erg gunstig zodat we al onze creatieve ideeën konden gaan uitwerken. Naast de app hebben we ook een website gemaakt.

Screenshots van de Schoolings app

De uitwerking

Ik heb het hele proces dat we hebben doorgaan toegelicht in de onderstaande Case Study.

01

Brainstormen en concept

Tijdens de eerste paar dagen zijn we op zoek gegaan naar een leuk concept dat we konden gaan uitwerken in de maanden die zouden volgen. We kwamen op het idee om een app te maken die het leerlingen makkelijker moet maken om hun schoolzaken te organiseren. We dachten aan de problemen die er in de huidige systemen zitten en we dachten na over hoe we dit konden verbeteren. Na een aantal namen te hebben verzonnen was Schoolings de beste keuze en was ons project echt van start gegaan.

02

Branding en identity design

Nadat we een naam hadden en wisten wat we wilden gaan maken gingen we al vrij snel over tot actie. Ik ging aan de slag om een huisstijl te ontwerpen en de anderen uit het Schoolings team gingen onder andere werken aan een trailer video. Gezien onze doelgroep, leerlingen van de middelbare school, vond ik het toepasselijk om erg veel met kleur te werken. Zo komt de app vriendelijk en speels over. Later hebben we deze kleuren toegewezen aan bepaalde secties en bijvoorbeeld vakken in de app.

03

Pitch geven

Nadat we ons idee hadden uitgewerkt en een ontwerp hadden gemaakt waarop we onze app en website konden bouwen was het tijd om op school een pitch te geven aan onze mede-leerlingen en docenten. We lieten de trailer zien waarin we onze plannen kort uitlichtte. Na deze presentatie konden we aan de slag met het echte werk, het implementen van alle (zo veel mogelijk) van de door ons bedachte functies in een werkende Schoolings app!

04

Website en app ontwerpen

Tijd om te gaan ontwerpen! We gingen aan de slag met het user experience en user interface design van Schoolings. Zowel van de website als van de app. Belangrijk in dit proces was dat alles met de huisstijl overeenkomt zodat er een mooi, strak en vooral samenhangend eindresultaat uitkomt. Dit hebben we voor elkaar gekregen door zogenoemde components steeds opnieuw her te gebruiken, zoals knoppen, titels en andere onderdelen die meer dan één keer voorkomen in de app.

05

Geschikte hulpmiddelen zoeken

Het design is er, nu nog alles omzetten in code. We gingen op zoek naar hulpmiddelen die ons konden helpen dit proces iets te versnellen en naar leuke effecten die we met code konden bereiken zodat het eindresultaat nog beter werd. Een voorbeeld hiervan is de grote header die van kleur verandert naarmate je er langer naar kijkt. Toen ik dit voor het eerst zag was ik meteen onder de indruk, dit moest ook op de Schoolings website komen. Omdat ik het er zo leuk uit vind zien, hieronder een replica van het effect.

Dit is Schoolings.

06

Programmeren

Alle ontwerpen zijn klaar, alle tools zijn gereed, tijd om te gaan programmeren. We zijn aan de slag gegaan alle ontwerpen van de app en van de website om te gaan zetten in code zodat het echt gaat werken. Gelukkig heeft de Handoff functie van ons ontwerpprogramma goed geholpen om de belangrijkste dingen geprogrammeerd te krijgen. Maar voor sommige ingewikkeldere functies was het nog wel even zoeken en puzzelen. Dat maakt het voor mij juist leuk omdat je daarvan weer nieuwe dingen kan leren. Na een aantal weken hard werken hadden we de app en de website klaar en konden ze online gezet worden!

07

Promo video maken

We zijn er bijna, de app en website zijn klaar, nu alleen nog een mooie promotievideo. In deze video moeten de belangrijkste functies toegelicht worden en worden getoond hoe deze eruit zien. Ieder frame uit de video is precies gemaakt op de spectaculaire muziek die je hoort. Zet het volume dus maar wat hoger en klik hieronder om de Schoolings Promofilm te bekijken via YouTube!

08

Testfase

Nu alles klaar is voor gebruik is het belangrijk om Schoolings grondig te testen, met als doel dat er geen technische fouten meer zitten in de release die we tijdens de eindpresentatie laten zien. Na nog een paar kleine foutjes of bugs gevonden te hebben hebben we deze snel opgelost. Versie 1.0 was klaar om live te gaan!

09

Presentatie geven

Na al het harde werk en maandenlang puzzelen en nieuwe ideeën bedenken was het dan nu eindelijk tijd om de eindpresentatie te geven voor onze informatica docenten. We hebben de Schoolings Promofilm laten zien en een demo gegeven van de app waarin we alle functies hebben toegelicht.

De beoordeling

Na de presentatie kregen we feedback van onze docenten informatica. Zij waren erg positief en zagen ons concept al helemaal voor zich als vervanger van het huidige Magister of Somtoday, een systeem dat de meeste middelbare scholen nu gebruiken.

Ze vonden onze ideeën, uitwerking, presentatie en vooral de tijd die we in het project gestopt hadden zo goed dat we het project met een 10 als beoordeling hebben afgesloten. Dit was tevens ook het cijfer dat voor het eindexamen telt.

Als je nieuwsgierig bent geworden naar het eindresultaat ben je van harte welkom op schoolings.nl!

Symbolen in Schoolings
Team Schoolings.

Tot slot wil ik mijn teamgenoten heel erg bedanken voor al het harde werk die zij in dit project hebben gestoken. Zonder jullie was er nooit zo'n goed eindresultaat uitgekomen. Dikke shout out naar Mel en Casper voor het mede mogelijk maken van Schoolings.

Het resultaat

Benieuwd naar het eindresultaat van dit project? Neem gerust een kijkje op de website!

De website van Schoolings is niet compatible met dit apparaat, probeer het op een groter scherm.