In deze video laat ik je in 5 stappen zien hoe je in Articulate Storyline een voortgangsbalk maakt die automatisch per slide de voortgang laat zien aan een deelnemer.
Hey Ik ben Mark Spermon van e-learning academie.nl waar ik je leer hoe je zelf e-learning kunt maken in Articulate Storyline. Ben je nieuw hier? Abonneer je nu op mijn YouTube-kanaal om meer tips te krijgen over het maken van e-learning met Articulate Storyline. Klaar? Dan gaan we aan de slag.
Voorbereiding: Wat heb je allemaal nodig om de voortgangsbalk te maken in Storyline?
– 2 shapes; 1 als lege achtergrond en 1 shape met states voor de percentages van de voortgangsbalk
– Een radiobutton
– 3 variabelen
– Triggers waarmee we zorgen dat de voortgangsbalk werkt.
Stap 1: De voortgangsbalk vormgeven
De 1e stap voor een werkende voortgangsbalk is om de voortgangsbalk grafisch te ontwerpen.Ik kies hier voor een simpele rechthoekige voortgangsbalk die is opgebouwd uit twee shapes. 1 shape voor de achtergrond van de voorgangsbalk en een shape met states voor de verschillende voortgangsstapjes of percentages. Let op dat je de shapes een breedte meegeeft die makkelijk op te delen is. Dus geen breedte van 341 pixels. De shapes van mijn voortgangsbalk zijn 600 pixels breed. als deze volldig gevuld is is de module 100% voltooid. We kunnen ook berekenen wat 1% is.Simpel 600 delen door 100 = 6. 1% is 6 pixels Mijn voortgangsbalk heeft stapjes van 5% Dat is 5×6 = 30 pixels per stap.
Ik plaats de twee shapes op elkaar. Zo krijg je het idee dat onderste balk volloopt.
We willen dat de voortgangsbalk automatisch werkt in de cursus. Je moet makkelijk slides kunnen toevoegen of verwijderen zonder dat je op elke slide de voortgangsbalk aan moet passen. De voortgangsbalk komt daarom op de Master Slide van de cursus. Dit doe je via het tabblad View > Slide Master.
Stap 2: Variabelen aanmaken in Storyline
Stap 2 is het aanmaken van variabelen in Storyline die we straks nodig hebben. Klik in Storyline op de knop waar je alle variabelen in je project kunt beheren om drie nieuwe variabelen aan te maken die we straks in de triggers kunnen gebruiken
– De 1e variabele die we aanmaken is een variabele van het type nummer. Ik noem de variabele ScreensinCourse. Deze variabele gebruiken we straks om het totaal aan het schermen van de cursus in op te slaan.
– De 2e variabele is weer een nummer variabele. Deze noemen ik ScreensVisitedCount
– Ook de 3e variabele is een nummer variabele. Deze krijgt de naam ScreensVisitedPercentage
Stap 3: Check inbouwen
Een cursist moet in een module heen en terug kunnen navigeren in onze cursus. Als hij terugkomt op een pagina waar hij al geweest is moet deze pagina niet nog een keer meegerekend worden in de voortgang. Anders zou de voortgangsbalk in de cursus al voor het eind op voltooid staan en dat willen we natuurlijk niet.
In stap 3 voegen we in een radiobutton element toe die gaat dienen als check. de radiobutton voeg je toe via het tabblad ‘insert’ je klikt op ‘input’ en kiest een radiobutton. Deze check is niet zichtbaar zijn voor een cursist. We plaatsen hem buiten het scherm van de cursus en geven de radiobutton de naam VisitedScreenCheck.
Stap 4: Voortgang berekenen
In stap 2 hebben we een aantal variabelen aangemaakt. In stap 4 maken we een aantal triggers aan waarin we de variabelen en de radiobutton uit stap 3 gebruiken om te zorgen dat onze cursus op elk scherm de voortgang berekend
De 1e trigger die we aanmaken is een Adjust variabel trigger die de waarde 1 toevoegt aan de variabele ScreensVisitedCount. Maar dit mag alleen als de radiobutton VisitedScreenCheck niet geselecteerd is.
Met de 2e trigger zetten we de radiobutton VisitedScreenCheck op selected. Deze twee triggers staan op de slide master. En worden voor elke slide in je cursus opnieuw uitgevoerd.
Trigger 3 is een trigger waarin de variabele ScreensVisitedPercentage de waarde krijgt van ScreensVisitedCount.
Met trigger 4 voeren we een berekening uit om het huidige percentage in de cursus te berekenen.De uitkomst gebruiken we straks om te bepalen welke state van de voortgangsbalk getoond moet worden. We delen de variabele ScreensVisitedPercentage met daarin het aantal tot nu toe bezochte slides door de variabele ScreensinCourse. Hier komt een waarde tussen de 0 en 1 = 100% uit. Heeft onze cursus in totaal 45 pagina’s en zijn we nu op slide 5 dan delen we 5 (ScreensVisitedPercentage) door 45 (ScreensinCourse) hier komt 0,11 uit. Dit betekend dat een cursist nu op 11% van de cursus is.
Stap 5: States van de voortgangsbalk aanpassen
In de vijfde en laatste stap maken we een serie triggers aan die ervoor zorgen dat Storyline bij het een percentage de juiste state laat zien.
De trigger is een change state trigger die uitgevoerd wordt als de tijdlijn van de Master Slide start. De trigger zet de voortgangsbalk op de state 10. In deze state is de voortgangsbalk voor 10% gevuld. Ik voeg een conditie toe aan de trigger waarin staat dat de trigger alleen uitgevoerd wordt als de variabele ScreensVisitedPercentage een waarde heeft tussen 0.09 en 0.15. Dat betekent 10,11,12,13 of 14. Dit herhaal je voor alle states in de voortgangsbalk
Let op!
Om te zorgen dat de voortgangsbalk goed werkt moet je nog een aanpassing maken in de properties van de slides die je aan gaat maken. Bij de optie when revisiting moet deze staan op ‘Saved’ resumed state. Dit zorgt ervoor dat de radiobutton geselecteerd blijft op elke slide en de voortgang niet geteld wordt al een cursist terug gaat in een cursus.
Om te kijken of alle berekeningen goed uitgevoerd worden is het handig om een tekstveld op de masterslide te zetten met de variabelen. Als je de module test kun je controleren of de variabelen de juiste waardes tonen. Heb je per ongeluk een fout gemaakt dan kun je je fout zo makkelijk opsporen.
Wil je dit bestand downloaden om zelf te gebruiken? Ga dan naar elearning-academie.nl/downloads
Vond je deze video leuk? Abonneer je nu op mijn YouTube-kanaal om meer praktische tips te krijgen over het maken van e-learning met Articulate Storyline.
En wil je nog meer leren over Articulate Storyline? Klik dan nu hier om je aan te melden voor mijn gratis basiscursus Articulate Storyline. Je ontvangt 5 dagen achter elkaar een e-mail met een video les over Articulate Storyline.
Schrijf je nu in en ontvang de 1e les binnen vijf minuten in je mailbox. Dankjewel voor het kijken! Tot de volgende video!
Heb je liever een klassikale cursus Articulate Storyline? Bekijk dan nu de verschillende data en cursusmogelijkheden.