Hier is het ontwerpteam en de opdrachtgever bij betrokken.

Transcriptie

1 René Ameling Cursistennummer: Inzendcode: 002Z7 Opgave 1 De randvoorwaarden voor het systeem zijn al duidelijk gesteld door de luchtvaartmaatschappij. De informatieverzameling zal zich dus moeten richten op hoe de eindgebruiker het meest intuïtief met het systeem zal kunnen werken. De methoden hiervoor zijn: 1. Kaartsorteren Dit biedt de mogelijkheid de workflow van het nieuwe systeem te bepalen. Door kaarten te geven met de beoogde functionaliteiten geef je de deelnemer de kans zijn eigen keuzes te maken zonder vooroordeel. Dit geeft inzicht in hoe mensen met de aangeboden informatie omgaan. Zo kun je al in de beginfase tegen lage kosten veel nuttige informatie verzamelen omtrent de gewenste functionaliteiten van het systeem. Het doel is te achterhalen of de aangeboden functionaliteiten volstaan of dat deze verder moeten worden uitgebreid of juist verkleind. Hier zijn testers en deelnemers bij betrokken. 2. Gebruikerstesten Naar aanleiding van de resultaten van het kaartsorteren kan een prototype van het systeem worden gemaakt. In deze fase kan worden volstaan met een papieren prototype van het systeem. Dit geeft de eindgebruiker een indruk van de plaatsing van elementen, indeling van het scherm en schermflow. Deze methode pas prima in een iteratief ontwerpproces omdat deze in een latere fase herhaald kan worden. Zo kan in een volgende fase een interactieve Powerpoint presentatie worden gemaakt zodat de eindgebruiker een nog beter gevoel krijgt van schermindeling, flow en interactie. Het doel is te achterhalen of de user interface aansluit bij de verwachtingen van de deelnemer. Hier zijn testers, observeerders en deelnemers bij betrokken. 3. Persona s De doelgroep die incheckt bij een luchtvaartmaatschappij is te groot en te divers om door middel van interviews of surveys in kaart te brengen. De opdrachtgever kan het ontwerpteam voorzien van de nodige NAW en demografische gegevens om de persona s op te baseren. Zo heeft het ontwerpteam duidelijk voor ogen voor wie er ontworpen wordt. Hier is het ontwerpteam en de opdrachtgever bij betrokken.

2 Opgave 2

3 Opgave 3 Het staat niet aangegeven in de opgave of het systeem meertalig moet zijn maar gezien de internationale omgeving ga ik uit van Engels als voertaal. 1. De gebruiker drukt op het scherm op de knop Check in. 2. Het systeem geeft het beginscherm weer met de benodigde tekstvelden. 3. De gebruiker raakt het tekstveld aan. 4. Het systeem geeft een contextgevoelig toetsenbord weer. 5. De gebruiker herhaalt stap 3 en voert naam, bevestigingsnummer en vluchtnummer in. 6. De gebruiker drukt op de knop Continue. 7. Het systeem controleert de ingevoerde gegevens. 8. Het systeem geeft een nieuw scherm weer met de bevestigde gegevens en de namen van de passagier(s) die ingecheckt moeten worden. 9. De gebruiker gebruikt de checkboxes om de relevante passagiers aan te vinken en in te checken. 10. De gebruiker drukt op de knop Continue. 11. Het systeem geeft een nieuw scherm weer met een plattegrond van het vliegtuig en de toegewezen stoelen. 12. De gebruiker accepteert de stoelen en drukt op Continue. 13. Het systeem opent een nieuw scherm met een overzicht van de gemaakte keuzes. 14. De gebruiker controleert de gegevens en drukt op de knop Print boarding pass. 15. Het systeem opent een scherm met de mededeling Now printing. 16. Na het printen opent een nieuw scherm met een persoonlijke boodschap van de

4 luchtvaartmaatschappij bijvoorbeeld <<luchtvaartmaatschappij>> wishes you an enjoyable flight. Alternatieve paden 7. Als de ingevoerde gegevens fouten bevatten: 7.1 Het systeem geeft een foutmelding 7.2 Het systeem gaat terug naar stap De gebruiker wenst andere stoelen: 12.1 Het systeem geeft door kleurcodes de beschikbaarheid van de stoelen aan ( rood=bezet groen=vrij blauw=geselecteerd) De gebruiker selecteert de gewenste stoelen door deze aan te raken op het scherm De gebruiker herhaalt stap De gebruiker is het niet eens met de ingevoerde gegevens: 14.1 De gebruiker drukt op de knop Change data bij de gegevens die gewijzigd dienen te worden Het systeem gaat terug naar de relevante stap De gebruiker bevestigt de veranderde gegevens Het systeem gaat terug naar stap 13. Opgave 4 Ten eerste ben ik een groot voorstander van het KISS (Keep it simple, stupid) principe en de tien geboden van Jacob Nielsen. Vooral het minimalistisch ontwerp, de kunst van het weglaten, spreekt mij aan. Hoe meer keuzes, hoe groter de kans dat er fouten worden gemaakt. Mijn ontwerp is dan ook minimalistisch om de kans op fouten zo ver mogelijk te verkleinen. Ik ben uitgegaan van een touchscreen als hardware waar het systeem op draait. In het hoofdscherm linksboven het logo van de luchtvaartmaatschappij, een conventie in webtoepassingen. Dit helpt tevens de gebruiker te herkennen dat hij zijn gegevens bij de juiste maatschappij aan het invoeren is. De navigatiebalk in het midden geeft de gebruiker aan hoeveel velden hij nog kan verwachten en

5 waar hij zich nu bevindt. De pijlpunten geven een voorwaartse beweging aan wat de indruk versterkt dat een gebruiker verder moet. De invoervelden zijn gegroepeerd volgens de Gestalt principes. Doordat ze in nabijheid van elkaar staan, geeft dit de gebruiker aan dat deze gegevens tot één groep/soort behoren. Ik heb er voor gekozen om de achternaam, voorletter en geslacht in te laten vullen. Samen met het vluchtnummer en het bevestigingsnummer zijn dit voldoende variabelen voor het systeem om een unieke uitkomst te genereren. Het vluchtnummer is ingedeeld in twee groepen: het eerste gedeelte voor de identificatiecode van de luchtvaartmaatschappij, het tweede gedeelte voor het vluchtnummer. Op de geprinte bevestiging staat het vluchtnummer ook zo gegroepeerd, dit creëert herkenning. Het eerste en tweede gedeelte hebben ook voldoende afstand zodat het duidelijk is dat het vluchtnummer uit twee delen bestaat. Daarnaast lijkt het ook op de codering van een acceptgiro, wellicht ook weer een stukje herkenning. Rechts van de invoervelden is voldoende ruimte gelaten voor eventuele foutmeldingen van het systeem die de gebruiker visuele clous geven over verkeerd ingevoerde gegevens. De grote knop onderin laat weinig aan de verbeelding over. Deze knop moet ingedrukt worden voordat men verder kan. Het virtuele toetsenbord is contextgevoelig. Zo geeft hij bij het invullen van de naam alleen het alfabet weer en bij het tweede gedeelte van het vluchtnummer alleen cijfers. Dit verkleint de kans op fouten. Ook verdwijnt het toetsenbord als het niet nodig is. Dit geeft de gebruiker een rustig en overzichtelijk beeld.

6 Opgave 5 User requirements Functioneel Het systeem moet touchscreen ondersteunen. Er moet invoer van gegevens mogelijk zijn. De gebruikte taal moet Engels zijn. Het systeem moet foutmeldingen kunnen geven om de gebruiker te assisteren. Het systeem moet de gebruiker de mogelijkheid bieden gegevens te wijzigen. Het moet een boarding pass kunnen printen. Informationeel Vanuit de gebruiker is het volgende aan informatie vereist: Achternaam, voorletter, keuze Mr./Mrs., vluchtnummer en bevestigingsnummer. Keuze voor de in te checken passagiers. Keuze van de stoelen. Het systeem geeft op basis van de input de volgende informatie terug: Foutmeldingen bij het verkeerd invullen van informatie. Hulpteksten voor het juist invullen van de gegevens. Fysiek Werkstations met een touchscreen. Server waar de software op kan draaien. Bekabeling voor stroom en data. Beperkingen De software moet draaien op Windows Server De user interface moet door internationale gebruikers kunnen worden begrepen. De schermresolutie bedraagt 1024 x 768 pixels. De maximale ontwikkelingstijd bedraagt 3 maanden. Conflicten De ontwikkelaar verplicht zich periodiek onderhoud te plegen aan de applicatie. De ontwikkelaar is niet verantwoordelijk voor wijzigingen aan hardware en besturingssystemen. Wijzigingen aan de applicatie voortvloeiend uit wijzigingen aan hardware en besturingssystemen komen voor rekening van de opdrachtgever.

7 Opgave 6 De wireframes zijn te vinden in het bijgesloten PDF bestand. Ieder wireframe heeft een resolutie van 1024 x 768 pixels. Ik heb bij dit ontwerp rekening gehouden met de tien geboden van Nielsen. Terugkerende elementen komen daarom altijd op dezelfde plek met dezelfde vormgeving terug. Herkennen gaat tenslotte boven onthouden! Verder is het een esthetisch en minimalistisch design om fouten van de gebruiker te voorkomen. Ik heb dan ook bewust niet gekozen voor dropdown menu s die de interface onnodig ingewikkeld maken. Ik heb met het ontwerp altijd in het achterhoofd gehouden dat het moet functioneren in een internationale omgeving met gebruikers van verschillende achtergronden en nationaliteiten. Daarom voldoet het ontwerp aan veel van de conventies van webdesign om ongeacht nationaliteit herkenning te creëren. Startscherm Het startscherm moet ondubbelzinnig aangeven waar het toe dient. Een gebruiker moet in één oogopslag kunnen zien of de terminal zijn informatiebehoefte kan bevredigen. Daarom hier alleen het logo van de luchtvaartmaatschappij en een grote check in knop. Het gebrek aan andere WIMP s zorgt er voor dat een gebruiker niet probeert andere handelingen dan inchecken met de terminal te verrichten. Scherm 2 Hier kan de gebruiker inloggen in het systeem aan de hand van de, aan de gebruiker bekende, gegevens. Ik heb hier niet gekozen voor teksthints in de invoervelden omdat de informatie die ingevuld dient te worden voor zich spreekt. Het is het overnemen van geprinte gegevens op het scherm. De navigatiebalk keert terug op ieder scherm. Dit geeft de gebruiker inzicht waar hij zich bevindt in de toepassing. De segmenten verschillen van kleur zodat de gebruiker weet waar hij is. De segmenten zijn klikbaar zodat de gebruiker altijd snel naar een vorig of volgend veld kan. De invoervelden reageren door kleurverandering op de aanraking van de gebruiker zodat deze weet welk veld wordt gemanipuleerd. Ook merkt men dit door het verschijnen van het toetsenbord. Naast de invoervelden is ruimte gelaten voor meldingen bij foute invoer. De invoervelden van het vluchtnummer zijn zodanig gegroepeerd dat ze bestaan uit twee sets: één voor de identificatiecode van de luchtvaartmaatschappij en één voor het vluchtnummer. Onderin het scherm een contextgevoelig toetsenbord voor de invoer van gegevens. Bij het vluchtnummer bijvoorbeeld verschijnt alleen het numerieke gedeelte. Dit voorkomt ook weer foute invoer. Met de knop continue gaat de gebruiker verder.

8 Scherm 3 Op basis van de ingevoerde gegevens produceert het systeem de namen van die passagiers die ingecheckt kunnen worden. De gebruiker kan deze namen aanvinken met behulp van checkboxes. Met de knop continue gaat de gebruiker verder. Scherm 4 Dit scherm laat een legenda en een plattegrond van het vliegtuig zien. Hier kan de gebruiker zijn stoelen veranderen of bevestigen. Door kleurcodes is het voor de gebruiker duidelijk welke stoelen toegewezen, nog vrij of bezet zijn. Met de scrollpijlen kan de gebruiker door de plattegrond heen scrollen. Dit geeft de mogelijkheid een duidelijk beeld weer te geven op een relatief klein scherm. Gebruikers moeten makkelijk met hun vingers de stoelen kunnen kiezen dus de plattegrond moet voldoende groot zijn. De stoelen wijzigen van kleur bij aanraking. Bij aanraking van bezette stoelen gebeurt er niets. Met de knop continue gaat de gebruiker verder. Scherm 5 Hier een overzicht van de ingevoerde gegevens. Dit geeft de gebruiker de kans alles nog eens goed na te kijken voordat de instapkaart(en) worden geprint. Dit scherm biedt de gebruiker de mogelijkheid de gegevens aan te passen met de change data links. De gebruiker bevestigt de gegevens door het indrukken van de Print boarding pass. Scherm 6 Dit scherm geeft de tekst Now printing weer met bewegende puntjes om aan te geven dat het systeem aan het printen is. De tekst en de beweging geeft aan dat het systeem bezig is met printen.

9 LOGO Startscherm logo van de luchtvaartmaatschappij CHECK IN button voor inchecken, rollover effect bij indrukken

10 LOGO Input Passengers Choose seats Overview Print navigatiebalk die aangeeft waar de gebruiker is. Segmenten zijn klikbaar. ruimte voor foutmeldingen Last name radio buttons voor keuze First letter Flight number Mr Mrs invoervelden in 2 groepen voor identificatiecode en vluchtnummer Confirmation number! Number unknown. Please enter again. Continue rollover effect om interactie aan te geven Contextgevoelig QWERTY toetsenbord

11 LOGO Input Passengers Choose seats Overview Print Passengers to check in checkboxes voor aanvinken passagiers Ameling, R. Volkers, O. Continue rollover effect om interactie aan te geven

12 LOGO Input Passengers Choose seats Overview Print your seats vacant occupied legenda scrollpijlen om door de plattegrond heen te kunnen scrollen 1 A B C D E F plattegrond van het vliegtuig met de stoelen, aanraken om te kiezen 5 6 Continue rollover effect om interactie aan te geven

13 LOGO Input Passengers Choose seats Overview Print Last name: Ameling First letter: R. Flight number: KL 1234 Change data Change data Change data rollover effect om interactie aan te geven overzicht van de ingevoerde gegevens Confirmation number: Xv023Bg564 Passengers to check in: 2 Ameling, R. Volkers, O. Seats chosen: A3, A4 Change data Change data Change data Print boarding pass rollover effect om interactie aan te geven

14 LOGO Input Passengers Choose seats Overview Print Now printing...