Mar 05

Veel e-Learning ontwerpers en ontwikkelaars gebruiken een strak model om het hele ontwerp- en ontwikkelproces te structureren. De moeder van alle Instructional Systems Design modellen (ISD) is ADDIE. De Florida State University heeft dit model al erg lang geleden bedacht en het model is nog steeds veel in gebruik. Toch kent het model veel nadelen. De wereld en de eisen aan de kwaliteit en de snelheid van het ontwikkelproces zijn veranderd. In deze blogpost beschrijf ik een effectievere manier om e-Learning te ontwerpen en te ontwikkelen.

ADDIE als waterval model

ADDIE (zie ook Wikipedia) is een zogenaamd watervalmodel. Het originele model gaat uit van 5 fases die je na elkaar doorloopt. In de loop van de tijd zijn er vele varianten in gebruik geraakt die wat flexibeler zijn en wat iteratiever van aard.

_addie Het lastige aan een model als ADDIE ligt in de versnipperde aandacht van het team en het feit dat niet alle soorten experts bij elke fase betrokken zijn. Dit heeft tot gevolg dat het ontwikkelproces lang duurt, en meer tijd kost. Als ik kijk hoe we dit bij Stoas Learning deden (heet nu Up learning) dan was ADDIE vaak nog het model dat leidend was. En de fases werden meestal achter elkaar doorlopen. Dit had een paar effecten:

  • Sommige e-Learning professionals zoals grafisch vormgevers werden pas in latere fases betrokken. Dit zorgt voor een lagere kwaliteit van het eindproduct en je respecteert dan niet de expertise van deze mensen. Dit is niet bevorderlijk voor de motivatie.
  • Professionals zijn bezig met kleine onderdelen van het resultaat en missen daardoor het overzicht en de betrokkenheid. Je hebt minder kennis en gevoel voor het product.
  • Doordat je het ontwikkelteam ver van de ‘echte klant’ afstaat krijg je vlugger een abstractie van de werkelijkheid. Dit zorgt voor minder aansprekende e-Learning: het gaat van inhoudsdeskundige naar eindresultaat over teveel schijven en verliest zijn ziel en glans.
  • Pas aan het einde van het ontwikkeltraject werd er echt getest met de doelgroep (en soms gebeurde dit pas na oplevering).
  • Fouten die in de ene fase werden gemaakt (of misconcepties, verkeerde aannames, etc.) werden in een latere fase ontdekt en dan kostte het vaak veel werk en geld om de fout weer te herstellen. Er moet soms veel werk over worden gedaan.
  • Door het watervalmodel moest je op elkaar wachten en dat kost tijd. De doorlooptijd was groot.

Nieuwe aanpak nodig

Een nieuwe aanpak is nodig om de snelheid te verhogen, de kosten te beperken en de kwaliteit te verhogen. Ik zie in de offertetrajecten (voor het maken van e-Learning content) die ik bij organisaties begeleid dat e-Learningbedrijven soms twee productieprocessen aanbieden waarvan het eerste het traditionele ADDIE methodiek volgt en de tweede een iteratief, kort en agile proces voorstaat. Er is duidelijk een verschil in de twee varianten die ze offreren; de tweede agile variant heeft een kortere doorlooptijd, een lagere investering in tijd en een lagere prijs. De resultaten zijn minimaal zo goed.

Ook ben ik zelf steeds meer betrokken bij ontwerp- en ontwikkelprocessen waarbij wordt gezocht naar een effectievere ontwerp- en ontwikkelmethodiek. Om me hierin beter onderbouwd te bewegen volg ik binnenkort een training om Scrum master te worden. Scrum is niet helemaal hetzelfde als agile maar wel een bruikbare vorm denk ik. Het is vooral in softwareontwikkeling een veelgebruikte methodiek. Voor een uitgebreide uitleg over Scrum kun je de prima ‘Scrum Reference Card‘ bekijken van Michael James.

Leaving ADDIE for SAM

Een boek dat ik iedereen die het ADDIE model wil heroverwegen en die zoekt naar een goed alternatief kan aanraden is ‘Leaving ADDIE for Addie for SamSAM, An Agile Model for Developing the Best Learning Experiences‘. Hierin beschrijft Michael Allen welke werkbare alternatieven er zijn. De titel geeft al aan dat het gaat over het ontwikkelen van leerervaringen en Allen laat in de introductie niet alleen zien dat een nieuwe manier van ontwikkelen gewenst is maar dat we ook meer kunnen en moeten opleveren dan de pure e-Learning content die we nu vaak opleveren.

In de eerste hoofdstukken schetst hij een waardevol beeld van wat e-Learning zou kunnen zijn. Door de focus op e-Learning onderscheidt het model van Allen zich van de algemenere en meer op de softwarebranche gerichte methodieken als Scrum. Het model SAM dat door Michael Allen wordt voorgesteld is er in twee varianten en  staat voor “Successive Approximation Model”. Hierin ga je heel iteratief te werk en werk je met de echte gebruikers vanaf het begin samen. Je zit dicht bij de praktijk van de gebruikers en probeert in elke fase veel uit met prototyping.

Dit steeds proberen en direct bijsturen past beter bij de complexe werkelijkheid waarmee we te maken hebben. In het Cynefin framework (zie Wikipedia) zie je dat je in een complexe situatie niet goed kan uitgaan van resultaten uit het verleden en dat 3 zaken belangrijk zijn:

  1. Probe
  2. Sense
  3. Respond

Het SAM model van Michael Allen ziet er schematisch zo uit:

_samproces

Een registratie van een webinar van een uur over SAM kun je hier bekijken.

Design Thinking for Educators

Ik zie een aantal ontwikkelingen ontstaan die allemaal hetzelfde proces beter en iteratiever proberen te maken. Een andere methodiek waar ik met plezier mee werk is Design Thinking. Dit is een methodiek afkomstig van het vooraanstaande ontwerp- en innovatiebureau IDEO. Ook in deze methodiek wordt er gedacht vanuit de gebruiker/lerende en vindt er veel iteratie plaats. Het gave is dat ze de methodiek van Design Thinking, die vooral in product- en diensteninnovatie wordt gebruikt, hebben toegepast op het onderwijs.

Voor het Amerikaanse basisonderwijs hebben ze erg veel gedaan en stellen ze de zeer praktische en uitgebreide ‘Design Thinking for Educators Toolkit’ beschikbaar. Via deze pagina vind je meer informatie. Er lijkt nu een technisch probleem te zijn met de pagina van het project, daarom bij deze de DesignThinkingForEducatorsToolkit (.zip van 5,4 MB) met daarin een pdf met de Design Thinking Toolkit, een Designers workbook en een leeg Designers workbook.

Visualisatie van het proces volgens de Design Thinking for Educators methodiek van IDEO:

 

_DTfE

Tagged with:
Feb 21

In het supergoede boek ‘Presentation Zen’ stond de gouden tip om een presentatieprogramma als PowerPoint pas op te starten als je de hele presentatie al op papier had ontworpen. Deze gouden regel geldt ook voor een goed e-Learning ontwerp: start op papier!

Een ontwerp is meer dan knopjes klikken

De neiging is sterk om bij het ontwikkelen van e-Learning direct een tool op te starten. Een auteursomgeving als Lectora of Storyline als je een webbased training wil maken, een leeromgeving als aNewSpring of N@tschool of blogging software zoals WordPress.

De tools worden steeds gebruiksvriendelijker, krachtiger en verleiden om direct met ontwikkelen te beginnen. Dit levert vaak een verschrikkelijk resultaat op. Het ontwerp is nog steeds de basis van een goede e-Learning leerervaring. Nu hoeft er niet direct een ISD-model zoals ADDIE gebruikt te worden maar de tijd nemen om een krachtig ontwerp te maken dat meer rendement oplevert én kosten bespaart in latere fases is essentieel.

Start met papier

Om niet direct de software op te starten maar eerst goed na te denken over het ontwerp is het handig om eerst op papier elementen van het ontwerp uit te werken. Twee voorbeelden die volgens mij goed werken:

  1. Een ontwerp voor een cursus maken met de Moodle Cursus Ontwerp Model van Avetica.
  2. Een ontwerp maken voor een Coachingstraject in de SBO Opleiding Onderwijskundig e-Learning Ontwerper.

1. Ontwerpen met het Moodle Cursus Ontwerp Model

Avetica is een dienstverlener op het gebied van Moodle. Ze hebben een methodiek bestaande uit een set kaartjes uitgebracht onder Creative Commons licentie waarmee je op papier eerst een ontwerp maakt. Er zijn verschillende soorten kaartjes met verschillende kleuren. Hieronder is de indeling verbeeld.

_kleurenMoodle

De ontwerper gaat met nog een uitgebreide instructie met een interne klant in gesprek om zo de wensen en eisen helder te krijgen. De kaartjes worden uitgeknipt, ingevuld en worden gestructureerd. Op papier is het eenvoudig om het ontwerp aan te passen of om de volgorde te veranderen. Door de kleuren wordt het direct inzichtelijk als er een eenzijdig ontwerp is gemaakt.

Via ‘Pay with a Tweet’ is het materiaal te downloaden.

2. Ontwerp een leertraject ‘coaching’

Bij de Opleiding Onderwijskundig e-Learning Ontwerper van SBO ben ik al jaren hoofddocent. Tijdens de eerste dag is Jeroen Krouwels van PAT Learning Solutions een gewaardeerde gastdocent en hij neemt de deelnemers mee in een ontwerptraject. In groepjes gaan mensen aan de slag om met behulp van papieren materialen in een paar uur een ontwerp te maken voor een leertraject ‘coaching’. Met scharen, stiften, plakband maar vooral met de nodige energie en creativiteit werken de groepen zich door de opdracht heen. Geen afleidende vastlopers, geen focus op de kleur van een template, geen batterijen die op zijn. Er worden fantastische resultaten bereikt zonder dat we worden afgeleid. Jeroen doet dit soort sessies ook met klanten, daarvoor zijn de papieren hulpmiddelen ook ontwikkeld.

Een impressie van deze ambachtelijke ontwerpsessie:

 

Pak dus vaker pen, papier en scharen bij het ontwerpen van e-Learning en denk vrij zonder beeldscherm!

Tagged with:
Sep 09

Leerstijlen zijn niet onomstreden. Toch worden ze binnen het onderwijs en in mindere mate binnen het bedrijfsleven en overheid veelvuldig gebruikt. Ook binnen e-Learning. Wie heeft er niet gehoord van lerenden die vooral auditief zijn ingesteld, een dromer zijn of met name kinesthetisch leren? Maar wat is nu de waarde en betekenis van Kolb, meervoudige intelligentie, whole brain thinking en vele andere modellen voor e-Learning?

Manier van inzetten leerstijlen

Wikipedia geeft als definitie:

Leerstijlen zijn redelijk eenvoudig in kaart te brengen. Bijna alle leerstijlentesten bestaan uit meerkeuzevragen waarna automatisch een bepaald profiel wordt gecreëerd. Een lerende wordt ingedeeld en gelabeld.  Vaak bestaat het profiel uit verschillende kenmerken en heb je sterke voorkeuren voor een bepaalde leerstijl of een combinatie van leerstijlen. Opvallend vaak worden de voorkeuren gevisualiseerd in een kwadrant.

Leerstijlen(tests) kunnen op meerdere manieren worden ingezet. Veel gebruikte manieren:

  • Om lerenden inzicht te geven in de eigen voorkeuren. De lerenden kan daar in het kader van leren leren gebruik van maken. Zo wordt het een soort meta studietool. Studietips zijn dan afgestemd op de manier waarop de lerende leert.
  • Om groepen lerenden in te delen en vervolgens gedifferentieerd les te geven. De gebruikte multimediavormen en didactische werkvormen zijn dan afgestemd op de voorkeuren en stijlen van dat specifieke groepje lerenden.
  • Om lesmateriaal gedifferentieerd aan te bieden aan een lerende met een bepaald profiel of stijl. Op die manier verloopt het leerproces effectiever en efficiënter.

Leerstijlen zijn in te delen in verschillende categorieën. Met Dr. Nadira Saab (van de Universiteit Leiden, zie profiel) heb ik jaren geleden een mooi project gedaan waarin leerstijlen een belangrijke rol speelden. Nadira verdeelde de leerstijlen onder in de volgende categorieën (met voorbeelden):

    • Zintuiglijke leerstijlpreferentie
      • DVC survey
    • Leerstijl gekoppeld aan motivatie
      • Apters’ MSP
    • Leerpreferenties
      • Kolb LSI (erg bekend en veelgebruikt)
      • Honey & Mumford LSQ (erg bekend en veelgebruikt)
      • Herrmann HBDI
      • Riding CSA
    • Leerstrategieën
      • Vermunt ILS

Onderzoek over leerstijlen

Er worden zeer veel verschillende leerstijlmodellen/testen aangeboden maar hoe kan een goede keuze worden gemaakt? Het blijkt dat er nogal wat ondeugelijke leerstijlentesten worden gebruikt. Leerstijlentesten die niet valide of betrouwbaar zijn of die bijvoorbeeld helemaal geen voorspellend vermogen hebben. Dan spendeer je dus tijd en geld in een meetinstrument terwijl je met de uitkomsten niets kunt, of zelfs een negatief effect krijgt.

Vanuit het ‘Learning and Skills Research Centre‘ hebben 4 wetenschappers (Frank Coffield, David Moseley, Elaine Hall & Kathryn Ecclestone) op kritische wijze literatuur omtrent leerstijlen onderzocht. Vervolgens worden 13 meest gebruikte modellen uitgebreid beschreven. Niet veel modellen komen ongeschonden uit de review en de implicaties van dit onderzoek reiken ver. Het onderzoeksrapport ‘Learning styles and pedagogy in post-16 learning, A systematic and critical review‘ (pdf, 182 pagina’s, 1,3 MB) is gratis te downloaden. Het bevat een hele eenduidige en heldere uitleg van de modellen en reikt criteria aan voor een vergelijk.

Als u onderstaande tabel even groot ‘opklikt’ kunt u zien dat de meeste testen maar matig scoren.

 

Leerstijlen voor de e-Learning ontwerper

Als e-Learning ontwerper kunnen we de leerstijlen goed gebruiken. Want ik heb (als e-Learning ontwerper) een blinde vlek en u waarschijnlijk ook. De afgelopen 15 jaar heb ik zelf als onderwijskundig e-Learning specialist veel e-Learning content gemaakt en ook heb ik veel ontwikkelteams binnen bedrijven en organisaties begeleid. Zelf en bij andere zie ik een groot probleem: je eigen voorkeuren en ervaringen worden vaste ingrediënten in het didactisch concept/content. Uw (en ook mijn) voorkeuren hoeven niet per se het beste leerrendement op te leveren. En ook kan het botsen met de voorkeuren van uw lerenden. En juist daarin kunnen leerstijlen een rol spelen.

U kunt leerstijlenmodellen inzetten zodat u tijdens het ontwerpen ook voldoende elementen integreert die buiten uw voorkeuren liggen. In de volgende alinea leg ik dit uit aan de hand van het Whole brain thinking model.

Voorbeeld whole brain thinking model

In 2007 heb ik een training gevolgd rondom Whole brain thinking model van Herrmann (de site van Herrmann). Zie hiervoor ook mijn Engelstalige blogpost. Ook naar dit model wordt in het bovengenoemde onderzoeksrapport nauwkeurig gekeken. De conclusie is:

Bij deze test wordt een uitgebreide set aan meerkeuzevragen afgenomen (overigens in het Nederlands) en krijg je daarna een zeer uitgebreid profiel. Het Whole Brain Thinking Model kent 4 kwadranten en je scoort vaak op meerdere kwadranten. Uit mijn test kwam het onderstaande beeld:

Bij elk van de kwadranten horen dan ook andere soorten denkactiviteiten en leeractiviteiten. Ik herken dat absoluut als ik naar mijn eigen profiel kijk, in de volgende afbeelding heb ik voorbeelden van didactische werkvormen/voorkeuren in de kwadranten geplaatst:

 

Als de varianten in e-Learning didactiek/werkvormen worden afgezet tegen de kwadranten dan ontstaat een staalkaart aan voorbeelden zoals in de volgende afbeelding:

 

 

We kregen bij de training erg veel materiaal mee om verdere inzichten te verkrijgen. Een heel praktisch hulpmiddel om beter te ontwerpen vond ik de set van kaartjes met daarop activiteiten uit de vier kwadranten. Ik scoor erg in het rode en gele kwadrant en daarom maken activiteiten in de 2 andere kwadranten niet vaak deel uit van mijn ontwerp. Als ik nu blauwe en groene kaartjes pak en daar wat activiteiten van inzet zorg ik voor een gevarieerder ontwerp. Een paar van de kaartjes vindt u in onderstaande afbeelding:

Conclusie

Hoewel veel leerstijlentesten bedroevend matig scoren in het onderzoek zijn ze toch erg bruikbaar. Misschien moet u wat voorzichtig zijn met het inzetten bij lerenden. Vooral als lerenden dan alleen maar didactische werkvormen en materialen krijgen aangeboden die aansluiten op enkel hun voorkeuren. Daarmee doet u lerenden tekort (want in mijn geval kan het geen kwaad om ook mijn niet-voorkeurs kwadranten te ontwikkelen) en maakt u door de gedifferentieerde aanpak het ontwerp- en ontwikkelproces wel erg complex en duur.

Voor u als e-Learning ontwerper is het erg handig om u bewust te zijn van uw blinde vlek en op die manier uzelf te prikkelen om een gevarieerdere aanpak te kiezen waarbij u een grotere groep lerenden aanspreekt. Dit komt het leren zeer ten goede en maakt het voor u ook veel leuker en uitdagender.

Erg benieuwd ben ik naar uw ervaringen of ideeën rondom het gebruik van leerstijlen! Hoe gebruikt u ze, of waarom gebruikt u ze niet?

Tagged with:
May 18

Een mock-up maken (interactieve demo/prototype van je ontwerp) van een iPad of iPod/iPhone app kun je prima doen met online of offline tools op je PC. Een paar van die tools heb ik al eens eerder besproken. Nu bespreek ik een app op de iPad waarmee je een interactieve mock-up kunt maken voor je iPhone of iPad. Er is een aantal apps die dit doen, zo is er iMockups for iPad (zie iTunes) waarmee je zelfs mock-ups van websites kunt maken en Blueprint (zie iTunes). Die laatste app gebruik ik.

Voor het ontwerp van een gewone website gebruik ik liever de online mock-up tools zoals MockFlow omdat het werken met de muis veel preciezer is en omdat het dan eenvoudig is om het ontwerp te delen. Tevens waardeer ik de schermruimte die ik op mijn MacBook Pro heb. Toch wat meer dan op de iPad.

Wat kun je met Blueprint?

Je maakt schermpagina’s aan (keuze uit iPhone of iPad schermformaat, en keuze uit staand of liggend) en die vul je vervolgens met schermelementen zoals navigatiebalken, knoppen, en ook inhoud zoals afbeeldingen of teksten. Vervolgens kun je delen van een scherm actief maken en laten verwijzen naar een volgende pagina. Je kunt veel verschillende soorten acties aan een schermelement koppelen. Zo kun je bijvoorbeeld een knop laten verwijzen naar een volgende pagina. Ook kun je aangeven dat er bij bijvoorbeeld een swipe naar links een nieuwe pagina getoond moet worden. Op het moment dat je het ontwerp wilt testen, speel je het af op je iPad en als ik dan op de knop druk of swipe gaat de app naar een nieuw scherm. Zo simuleer ik de werking van een echte app.

Hoe ziet het eruit?

In bovenstaande schermafdruk is te zien dat ik een liggend iPad scherm heb gemaakt. Ik heb een navigatiebalk onderaan geplaatst en tekst en een afbeelding daarboven. Aan de rechterkant staan alle schermelementen (Controls) die ik in kan zetten. Elk schermelement kan ik nog tot in detail aanpassen (kleur, grootte, gedrag) en zelfs kan ik nieuwe afbeeldingen op knoppen zetten.

Hier is het overzicht te zien van de verschillende pagina’s met daarbij de verbindingen. Een bestaande pagina kun je eenvoudig dupliceren en de links worden daarbij meegenomen.

Hierboven is te zien dat je aan objecten acties (Actions) kunt verbinden. De mogelijkheden zijn erg uitgebreid waardoor de app erg natuurgetrouw afspeelt.

Tenslotte hierboven de zelfde pagina waarbij een object is geselecteerd en het paneel Proporties wordt gebruikt. Je kunt tot op detail elk object qua grafische opmaak aanpassen inclusief alphawaarde (doorzichtigheid).

Plus- en minpunten

Bij het maken van een mock-up tool voor een iPad app zijn de belangrijkste voordelen van een mock-up app op de iPad t.o.v. een mock-up tool op de PC of in je browser:

  1. Je kopieert  eenvoudig screenshots van je iPad naar de app. Dit vind ik soms wel handig omdat je dan niet een hele pagina hoeft te maken. Ik heb dit o.a. gebruikt toen ik in mijn mock-up een agenda nodig had. Die kun je zelf gaan samenstellen uit de voorgedefinieerde objecten of je maakt een screenshot van een standaard agenda en gebruikt die.
  2. Het is erg handig en prettig om direct het resultaat te bekijken op je echte iPad i.p.v. op een gesimuleerde iPad op je laptop. Hiermee krijg je een beter gevoel of een bepaalde volgorde van handelen of indeling op een pagina prettig is.

De pluspunten:

  • snelheid is goed;
  • leercurve is betrekkelijk kort;
  • het tonen van resultaat (inclusief swipe bewegingen en effecten) werkt erg prettig en bootst de echte app goed na;
  • erg veel instelmogelijkheden, vooral grafisch;
  • kunt in grafische lagen werken en deze goed ordenen;
  • plaatsen objecten gaat goed door magnetische hulplijnen;
  • validatieregels voorkomen dat een knop op een plek komt waar dit onmogelijk is in een echte app;
  • dupliceren van een pagina werkt perfect;
  • lite versie is voldoende uitgebreid om een goede indruk te krijgen;
  • export naar PDF werkt goed, gratis viewer is fijn om ontwerp te delen met collega’s en klanten.

De minpunten:

  • door aanraakmethodiek is het moeilijk om objecten precies goed te positioneren, hier mis je het precieze van een muis;
  • een export naar klikbare demo die op web te delen is zou erg welkom zijn. Nu is het lastig met viewer of statische pdf;
  • samenwerking met Dropbox zou handig zijn;
  • er is geen helpfunctie en de uitlegfilmpjes op de site zijn maar matig van kwaliteit;
  • afbeeldingen die je plaatst zijn niet te roteren en alleen met grote stappen te schalen (25%, 50%, 75% etc.) of handmatig maar dat is niet handig met je vinger. Ook bijsnijden gaat niet.

Eindoordeel

Blueprint is een erg bruikbare en krachtige mock-up tool die ik graag gebruik. Natuurlijk zijn er nog wensen maar het doet wat het belooft te doen op een snelle, prettige manier. De mogelijkheden zijn erg uitgebreid terwijl de bediening niet erg complex is. De app is zijn geld voor mij zeker waard (momenteel kost de app 11,99 euro).

 

 

Tagged with:
Dec 14

Als je een website, leeromgeving of (mobiele) applicatie maakt dan is het altijd slim om eerst op papier te gaan ontwerpen. Om een bepaald interactie ontwerp met de klant en anderen door te spreken is het handig om een soort proef te maken. In e-Learning/webdesign land vaak aangeduid met de aparte term ‘Mock-up’. Wat is het en hoe kun je ze maken?

Wat is een Mock-up?

Volgens Wikipedia is een mock-up:

…een tijdens de ontwerp- of productiefase op schaal of op ware grootte gemaakt model van een ontwerp of product. In de software-industrie komt het begrip tevens voor om vroeg in het ontwikkelproces het software-ontwerp qua gebruikersinterface te testen. Een mockup wordt voornamelijk gebruikt voor demonstraties, lessen, evaluaties of promotie. Een mockup krijgt pas de term prototype als het ontwerp ook echt werkt. Meestal zijn de mockups dus voorbeelden qua uiterlijk.

Vaak wordt een mock-up in eerste instantie op papier uitgewerkt. Zelfs dan kun je met gebruikers al enigszins gekunsteld het interactieproces doorlopen en kijken hoe de gebruikers je ontwerp ervaren. Een andere veelgebruikte vorm is die van een  PowerPoint presentatie. Je klikt dan door verschillende schermen en maakt hyperlinks. Op die manier kun je snel duidelijk maken wat de bedoeling is. De verwachtingen van eenieder wordt duidelijk en hoewel het maken van een goede mock-up veel tijd kost, kan het je veel dure ontwerpfouten en communicatiefouten besparen. De tijd win je later altijd terug.

Wat is een mock-up niet?

Zoals Wikipedia al aangaf is het geen werkend proto-type. En dat is voor sommige mensen (waaronder klanten of opdrachtgevers die nog niet eerder met het fenomeen mock-up hebben gewerkt) moeilijk. Bij een mock-up let je op het interactieontwerp  (wat doet iemand op welk moment op je site, op welke manier en op de grote lijnen. Het is minder tot onbelangrijk hoe de site/applicatie/omgeving er precies uit komt te zien.

Soms merk ik daardoor dat het beter is om het voorbeeld niet erg te laten lijken op het beoogde eindresultaat. Anders gaan mensen commentaar leveren op details en verliezen het geheel uit het oog. Als je de vraag krijgt “kun je die balk ook een andere kleur geven” dan heb je het niet goed gedaan 😉

Maken van een mock-up; handige tools

Een van de manieren is met de computer maken van een mock-up. Ik heb ervaring met een aantal. Ten eerste heb ik wel eens Microsoft Visio gebruikt om snel een eerste mock-up te maken. Het kan er wel mee maar is er niet specifiek voor gemaakt en dat merk je. Net iets minder handig dan speciale mock-up applicaties.

Een gratis te gebruiken online tool om een mock-up voor specifiek een iPhone applicatie te maken is deze. Hier sleep je met elementen, verander je tekst en stuur je de url door naar iemand anders. Nadeel is dat het redelijk beperkt is, dat je geen klikbare mock-up kunt maken en dat je niet kunt exporteren. Wel kun je twee verschillende stijlen kiezen. Hieronder zie je de strakke versie en een versie die meer handmatig geschetst lijkt. Misschien is die tweede wel handiger om te gebruiken.

mockup1Mock-ups gemaakt met http://iphonemockup.lkmc.ch

Hans de Zwart gebruikte in zijn post over de Moodle app een programma om mock-ups te maken dat veelzijdiger is en dat je kunt downloaden (niet gratis). Dit programma Balsamiq is er voor zowel Windows, Linux en de Mac. Balsamiq  is wat breder dan de website die ik net noemde. Je kunt er zeer veel verschillende mock-ups mee maken. Op een eenvoudige manier sleep je elementen naar de plek waar je wilt en je hernoemt teksten. Er is een behoorlijke bibliotheek aan elementen en die is nog uit te breiden met elementen die door andere gebruikers zijn gemaakt (zie hier). Een export is op vele manier te maken.

balsamiqApplicatie Balsamiq waar een scherm snel te maken is.

Een derde (webbased) applicatie om mock-ups te maken is Mockingbird. Deze site is gratis om te gebruiken en het aardige hieraan is het feit dat je meerdere pagina’s kunt maken. In de preview zijn er dan mooie pagina’s te zien. Die kunnen overigens ook nog gelinkt worden. Helaas zijn er minder specifieke sets aan elementen te vinden voor bijvoorbeeld de iPhone of andere devices. Daarentegen is het erg eenvoudig in gebruik en is het eenvoudig om de resultaten te delen middels een link of door het te embedden op je site.

mockingbirdDe webbased (en gratis) tool Mockingbird

Laatste en wat mij betreft mooiste online tool is MockFlow. Deze site is gratis (met paar restricties) en ook betaald waarmee je dan alle opties krijgt. Voor mijn gevoel combineert deze applicatie de voordelen van voorgaande opties. Een grote bibliotheek helpt je op weg, je kunt online alles doen en je mock-up goed presenteren. Mooiste van deze tool is dat je van de ene pagina naar de andere kunt klikken. Erg goed!

mockflowMockflow combineert alle mooie functies van de andere applicaties

Heb jij nog goeie tools die je hiervoor gebruikt of heb je een mock-up gemaakt die je wil delen om anderen te inspireren: laat het weten in de comments!

Tagged with:
preload preload preload