Eindproduct André van de Polder Charlotte Cozijn Rob Duits Sander Kuik Klas ROOD



Vergelijkbare documenten
Project Ontwerp Specificatie Het Zwarte Schaap Team 13 Klas Wit

User testing: Aan de hand van een expectation map heb ik 3 verschillende personen gevraagd om het prototype te testen.

Einddocument project 3: Voor het goede doel!

Hoe moet je een prachtige presentatie maken?

Ontwerpspecificatie. Project Second Screen. Marijke Dekker V101

Museumbezoek onder Studenten

OPDRACHTKAART. Thema: Multimedia. Het multimedia productieproces 3. De uitvoering MM

Groepsopdracht 2. Zuilen voor in het Rijksmuseum

M I K E R U B I O K E R N T A A K

Versie 2. Opdracht deel B Inhoud. Raoul Vos Hogeschool Leiden Studentnummer:

onderzoek ontwerp realisatie implementatie

Naam: Valérie den Besten Klas: G&I A Datum: Module: Project 100% presence Begeleider: Irene van Peer Groep 11 (team 14)

Notulen eerste ontmoeting 7 mei

Deze week: - Bespreken 2 websites - kleur - MBTI - Opdracht wat moet er voor volgende week af zijn?

Lesbrief voor leerlingen: hoe ontwerp je een omslag voor een boek

[Rapport: Visitekaartjes gefilterd (1) Hannie Mommers. Mommersontwerp

Find The Word. Design Document versie 0.1

Meer succes met je website

Les 3: Het maken van pagina s, het menu en het schrijven van een blogpost Pagina s

10 onderdelen die niet mogen ontbreken in een online briefing

Piotr Tekien. Grafische Vormgeving Revisie portfoliostijl GAR1-B. 3 december 2014 PIOTR TEKIEN HKU GAME ART GAR-1B

Het definitieve prototype van Foliostory zal op basis van een usability test getest worden.

M I K E R U B I O K E R N T A A K

Inhoudsopgave. Stappen 1 Ervaringen 2 Wireframes 3 PIOTR TEKIEN HKU GAME ART GAR-1B

Hieronder leggen we je uit wat je moet doen om mee te doen aan Digibattle. En om te winnen. Lees het dus goed door.

Compleet, Eenduidig en Projectspecifiek

Plan van aanpak, 17 september 2014

Ontwerptechnieken. MyTV

PROJECT PLAN. Datum: 14 februari Project: Medical Team: Tibor Dujmovic IAD1 Nick Marlow IAD1 Jasmijn Groot GAR1 Peter Uithoven IAD1

1.0 - Inleiding Onderzoek Resultaten Probleemstelling Bronnen Doelgroep Persona 7

Grafisch ontwerp. Referenties.

Handleiding bij de workshop Animatie in Microsoft PowerPoint Hoe maak je een animatie in Microsoft PowerPoint 2010? Handleiding voor kinderen

Voorwoord. AHA! De Grafisch Vormgever Voor Communicatie en Multimedia Design studenten.

Location Based Media

Bottleball Onderzoeksverslag MovingMonsters. Uitgevoerd door Arno Classens

Plan van aanpak Portfolio

Het inlogscherm. Uitleg Demo pagina s

Bewerk uw eigen Digibordbij boek

Inhoud. Ontwerpdocument 18 juni 2007

Concept Report. Rob Duits. Klas Rood

Uitleg CMS Utrecht Your Way Button 1. Inloggen

Portfolio Fiona Roos. Interaction / Usability / Mindmapping / Webdesign / Concepts / Photography / Visual. Tel.: +31(0)

Herlaarhof. het social media spel

LIVE WEBINAR UITZENDEN

FCB Loopbaanplein in vogelvlucht

ocumentatie DiFresh `Everyone is unique er Haccou i le Penven s van Arkel Verlaan

Bijlage: Casus 2: Technisch Ontwerp CD-Dom / Mijn Domplein.

Individueel procesverslag

Algemene regels. Stappenplan webdesign

Test-Report 1 Groep Namen en functies Erik de Beurs - Recruiter / Test Monitor / Tech Operator Channah Bosse - Recruiter / Data logger

Gemeente Haarlemmermeer. Leer zelf je nieuwsbrief maken in YMLP. Opgesteld door: drs. Mariska I.R. Franse Datum: 6 en 11 juni 2013

Hoofdstuk 1: Beginnen met GameMaker 2

MMIO Verslag. Groepsopdracht week 1. Hoe zorgen we dat kinderen van jongs af aan gezonder leren eten?

a. Een zin lees je van links naar rechts. Waarom eigenlijk? Wat denk jij?

TRAINERSSITE.NL VOETBALCLUB2000.NL HANDLEIDING

ICT Publisher

Maak een vormgeving (geschikt voor meerdere devices), met een duidelijke huisstijl en visual, die aansluit bij jouw doelgroep, waarbij je rekening

HTC you Campaign Propositie Htc belooft een telefoon die bij jou past en voldoet aan jou persoonlijke behoeftes.

Concept document Kitesurf Spot Elyse Teerink November 15, Conceptdocument Informatie Architectuur

Nieuws sites hebben een krantachtige vormgeving; de informatie staat voorop.

Inloggen: Opbouw site: Een handleiding/introductie voor de nieuwe site van Fotoclub VPR.

Handleiding Melkvee Connect

Test-Report 2. Groep. Namen en functies Erik de Beurs - Recruiter / Test Monitor / Tech Operator Channah Bosse - Recruiter / Data logger

Projectgroep 8: Briefing. CDE Muziekatelier. Eva Thomas & Silke Lauwers

- het lezen van het boek van Soldaat van Oranje en het maken van de literatuurwijzer het bekijken van de film Soldaat van Oranje;

Ontwerp Portfoliowebsite MMIO 2016

Checklist nieuwe website

Veren. Look & Inspire Jenna Hardin 1B Game Art

Kennis na het volgen van de training. Na het volgen van deze training bent u in staat:

Prototype/Usability testverslag

Redesign RTL XL Gemist

(VIDEO) Review ZEEF Wat is ZEEF en wat kan je hiermee?

Down the rabbit hole. Marianne ter Braake studentnummer: Datum: Informatiearchitectuur

Piotr Tekien. Grafische Vormgeving 10 Slechte logo s/typografie verbeteringen. Oktober 2, 2014 GAR1-B PIOTR TEKIEN HKU GAME ART GAR-1B

Inhoud. Blz. 3. Blz. 4. Blz. 5. Blz. 7. Blz. 8. Blz. 9. Blz. 10. Opdracht 1 - Brainstormen. Opdracht 2 - Je eigen controller. informatie - makey makey

Cursus Onderwijs en ICT. Programmeren met Visual Basic

Website bouwen Blok2 Wat kan wel en wat kan

Takenblad Plusklas Ontdekken Periode 2 : Herfstvakantie tot kerstvakantie. Opdracht: Spoorzoekers Van wie is die vingerafdruk?

De website heeft een redelijk gestileerde uitstraling en oogt ook experimenteel. Verder lijd hij nauwelijks af van de inhoud, namelijk zijn foto s.

Zorg dat je een onderwerp kiest, waarvan je echt meer wilt weten. Dat is interessanter, leuker en makkelijker om mee bezig te zijn.

Testreportage. Door: Daniëlle Visser ( ) Timo van Vliet ( ) Roberto Nelissen ( ) Nina Haitsma ( ) Groepsopdracht 6

Testrapport IpMEDT3 project

Animation. Info-animation Explanimation MARKETING & COMMUNICATIE - DIGITALE VORMGEVING JANUARI 2013


Ontwerp rapport Digitaal Instellingsplan Hogeschool van Amsterdam

Immersive space werkboek

BESCHRIJVING DEELONDERZOEK: USER TESTING. Joost van der Zanden /05/2016

LIVE WEBINAR UITZENDEN

Stappenplan. De ontwikkeling van een interface doorloopt bij Studio Wolf vier stappen. Deze stappen verduidelijken de weg naar het eindresultaat.

Bijlage 3. Kwalitatieve resultaten (uitkomsten verschillende usertests)

Olivier van t Hof ( ) Individuele opdracht 2 Kroller Muller. Introductie Introductie

H.A.N.G. PLEKKEN. Heel Aardig? Niet Geweldig! > OP BEZOEK BIJ HET NAI

Van persona s en scenario s naar wireframes. Lay-out met grid

Vragenlijst voor nieuwe website

Pimp een Windmolen! Droommachine

Teksten bewerkt uit het gezinsboek Ons Dagelijks Brood veertigdagentijd van pastoor M. Hagen door EBP voor

Taakleerjaar1 - Dreamweaver

Test-plan 2 Project Portfolio

Transcriptie:

Eindproduct van de Polder Cozijn Duits Kuik Klas ROOD van de Polder - Cozijn - Duits - Kuik 1

Inhoud What s new...03 Schermverloopdiagram...04 Functionaliteit...05 Grafisch...05 Copy (tone of voice)...06 Technische architectuur...06 Bijlage 1...07 Bijlage 2...09 Bijlage 3...10 Bijlage 5...12 Bijlage 5...13 van de Polder - Cozijn - Duits - Kuik 2

What s new - Achtergronden gemaakt - Spelelementen in elkaar gezet (swf bestand) - Animaties gemaakt - Naam voor het spel bedacht Verloop We hebben afgelopen weken onze ideeën uitgewerkt. Het spelconcept heeft vorm gekregen door het maken van alle elementen. De sfeer van het spel hebben we bepaald en de karakters gemaakt. De achtergronden zijn gemaakt in illustrator, de karakters in Flash en met behulp van Flash en Actionscript hebben we van de spelelementen een interactief spel kunnen maken. In het begin was ons plan om een advertentie te plaatsen in Havana en Folia. Dit omdat we onze doelgroep, namelijk studenten, hiermee kunnen aanspreken. Er is gevraagd om een interactief element bij deze opdracht. Wij hebben toen besloten om een spel te maken. In de advertentie zou er dan verwezen worden naar het spel, wat zou komen te staan op de website van het verzetsmuseum. Het spel gaat over een joodse jongen, Isaac, die heel graag naar de voetbalwedstrijd Ajax-Feyenoord wilt. We hebben eerst alle karakters en achtergronden gemaakt en daarna de animaties. We hebben ook een nieuwe naam voor het spel bedacht, omdat Licht in de duisternis niet meer van toepassing is op ons concept. We wilden een korte naam, met een dubbele betekenis. De nieuwe naam voor het spel is Isaac buitenspel geworden. Dit omdat het spel om Isaac gaat, en omdat hij als Joodse jongen door de Duitsers buitenspel gezet is. Buitenspel is een voetbalterm, zodat de naam ook te maken heeft met voetbal. Een dubbele betekenis dus. Uiteraard kan de naam veranderd worden als het verzetsmuseum dat wilt. We hebben besloten om de advertentie niet meer te doen en ons volledig te richten op het spel. Er is besloten om het spel in de tentoonstelling te plaatsen in plaats van op de site. Het spel is ontworpen op een manier die voor iedereen te doen en te begrijpen is. Kernidee Wij hebben een spel gemaakt, die gespeeld kan worden in het verzetsmuseum. Door dit spel te spelen kom je te weten wat er een joodse jongen kon doen om toch naar een voetbalwedstrijd te kunnen. Hij zou bijvoorbeeld zijn persoonsbewijs kunnen vervalsen, zijn haar kunnen blonderen en een andere jas aan kunnen trekken (zonder Jodenster). De speler moet Isaac helpen om alle benodigdheden te verzamelen: Een jas, waterstofperoxide, een krant, sleutel voor de kelder, persoonsbewijs, brood, aardappels en een voedselbon. Heeft Isaac alles verzameld? Dan is het spel uitgespeeld en kan Isaac naar de wedstrijd. van de Polder - Cozijn - Duits - Kuik 3

Schermverloopdiagram van de Polder - Cozijn - Duits - Kuik 4

Functionaliteit Het spel geeft een indruk van het leven van een joodse jongen tijdens de tweede wereldoorlog. Het is de bedoeling om door middel van het spel, men wat bij te leren over voetbal in de tweede wereldoorlog. De speler leert wat er zoal nodig was voor een jood om als niet-jood over straat te kunnen gaan, en zo toch de dingen kon doen die hij wilde doen. Zoals naar een voetbalwedstrijd. Grafisch Alles bevind zich in een wat cartoonachtige stijl, omringende lijnen zijn dikker dan lijnen binnen objecten. Dit geheel kan een speelse en moderne look geven aan een ouder onderwerp. Dit is een toegankelijke stijl. De doelgroep kan hier bekend mee zijn, omdat dit vaker gebruikt word. De vormgeving van de interface van het spel is heeft nu een andere sfeer ten opzichte van het prototype. Nu het spel bij voorkeur in het museum zelf geplaatst wordt zou het natuurlijk mooi zijn als het spel binnen de tentoonstelling past. Na het bezichtigen van de panelen die in het museum gaan komen, zijn wij aan de slag gegaan om ervoor te zorgen dat het spel zich kan thuisvoelen binnen één van deze panelen. Gezien het concept en een lichte, visuele aanpassing, komen wij tot de conclusie dat het spel het beste bij paneel 04 LR past. Het paneel van de jodenvervolging. prototype eindproduct Typografie Font: Platte tekst: menu: koppen: Estrangelo Edessa 18pt 18pt 24pt van de Polder - Cozijn - Duits - Kuik 5

Copy (tone of voice) Wij wilden eerst een filter verwerken in het spel waardoor het spel steeds meer kleur zou krijgen. Dat het spel eerst in zwart/wit zou zijn, en naarmate Isaac meer objecten verzameld had, dat er meer kleur zou verschijnen in het spel. In verband met ons oude concept Licht in de Duisternis. Nu we dit concept niet meer aanhouden, vonden wij het niet relevant om het filter nog te gebruiken. Het gaat er nu vooral om dat de spelers begrijpen waarom Isaac bepaalde objecten zoekt. Bijvoorbeeld dat hij zijn haar moet blonderen om niet herkenbaar te zijn als Jood. De doelgroep die wij willen bereiken bestaat uit jonge mensen. De bezoeker van het spel wordt aangesproken met je en jij, en er wordt informele taal gebruikt in het spel. Technische architectuur Alle code in het spel valt binnen de categorie ActionScript 2.0. De applicatie is alleen optimaal te gebruiken in combinatie met Flash Player 10. Dit is een minimale systeem eis, omdat het spel in andere versies anders afgespeeld wordt. Over alle klikbare objecten zit een onzichtbaar veld met daarin de bijbehorende code. Op deze manier kan het klikbare gebied van een knop groter zijn dan de knop zelf. Dit is erg handig op het moment dat het klikbare object erg klein is, of wanneer je niet kunt zien wat het klikbare object is. Normaal gesproken is het verstandig om ervoor te zorgen dat je direct kan zien wat er klikbaar is of niet, hoewel het in dit geval de bedoeling is dat de gebruiker op sommige momenten juist moet zoeken naar een oplossing of object. van de Polder - Cozijn - Duits - Kuik 6

Bijlage 1 Content matrix Achtergronden Alle achtergronden worden op Illustrator formaat (.ai) opgeleverd aan, daarna worden er JPEG s van gemaakt voor in de Flash game. startscherm.jpg slaapkamer.jpg poster.jpg hal.jpg kelder.jpg woonkamer_01.jpg woonkamer_02.jpg keuken.jpg keuken_2.jpg keuken_3.jpg tuin.jpg straat_01.jpg straat_02.jpg straat_03.jpg straat_04.jpg straat_05.jpg bakker.jpg bakker-binnen.jpg gerard_hal.jpg gerard_woonkamer_01.jpg gerard_woonkamer_02.jpg persoonsbewijs.jpg (alleen als puzzel in spel komt) Personages Alle personages die in het spel voorkomen: Isaac De hoofdpersoon in dit verhaal Gerard Een vriend van Isaac Johan De vader van Gerard Maurits Bakker - Duitse soldaat Kaartjesverkoper handelaar in voetbalkaarten Klikbare elementen Deze elementen bevinden zich op het scherm en maken het mogelijk om een actie te ondernemen of naar een andere pagina te gaan. Alle klikbare elementen zijn opgebouwd in Flash zelf of aangeleverd als.png formaat. Er zijn twee soorten klikbare objecten: en event handler. De elementen worden opgenomen in de inventory van Isaac en zijn nodig om een actie uit te voeren. De event handler elementen zorgen voor een directe actie, zoals het overschakelen naar een nieuw scherm. Pijlen Buttons Peroxide Jas sleutels krant voedselbon brood Aardappelen Voetbal ticket Persoonsbewijs event handler event handler event handler van de Polder - Cozijn - Duits - Kuik 7

Copy Het menu bestaat uit - Nieuw spel - Introductie - Over het verzetsmuseum - Help Introductie Het is 27 september 1942. Vandaag speelt Ajax tegen Feyenoord. Isaac is een Joodse jongen en wil graag naar deze wedstrijd. Door regels van de Duitsers mag hij hier niet heen. Door middel van ruilen en vervalsing kan hij misschien toch naar deze wedstrijd. Help jij hem daarbij? Praatwolkjes die voorkomen in het spel: - Hee Isaac, ik help jou wel om bij de wedstrijd te komen. Trek een oude jas van mij aan en gebruik wat peroxide om jouw haar te blonderen. De fles staat in de keuken. - Ik ben nog niet zo ver om veilig naar buiten te gaan. - Ik heb wel mijn jas nodig voor ik naar buiten ga. - Ik kan die fles maar beter laten staan. - Hee jij daar, haal eens een krant voor mij! - Hé knul, interesse in een voetbalticket? Voor een halve kilo aardappelen is deze voor jou. - Het was fijn zaken met jou te doen. - Mijn vader wilt in ruil voor het vervalsen van jouw persoonsbewijs één brood hebben. Geef mij het brood maar vast, dan helpt mijn vader jou verder. - Bedankt Isaac, mijn vader wacht binnen op jou! - Hallo Isaac, heb jij jouw persoonsbewijs bij je? - Een lekker vers brood in ruil voor een voedselbon! - Bedankt, neem dit brood maar mee. - Zo, jouw persoonsbewijs is vervalst. Nu alleen nog een voetbalticket en jij kunt naar de voetbalwedstrijd. Einde van het spel: Goed gedaan! Isaac kan nu naar de voetbalwedstrijd! Dankzij jou heeft hij alles kunnen verzamelen. Cutscenes Kleine animatiefilmpies tussen het spelen door: De trap naar beneden Deze animatie speelt af tussen slaapkamer.jpg en hal.jpg. De trap naar boven Animatie van hal naar de slaap kamer. Jas aantrekken Isaac doet zijn jas (oorspronkelijk een oude jas van Gerard) aan voor hij naar buiten gaat in hal.jpg naar straat_01.jpg Jas uittrekken Isaac doet zijn jas weer uit naar binnen van straat_01.jpg naar hal.jpg Blonderen van haren Isaac doet peroxide in zijn haar in de keuken. Lade in kastje openen Klik op lade in kastje en de lade gaat open. Geluid bakker_deurbel.wav bird_ambience.wav isaac_lopen.wav jas_aan.wav laden_open.wav pick_lock.wav traplopen.wav waterdrop.wav een rinkelend belletje wanneer Isaac bij de bakker binnen stapt geluid van vogels in de tuin wanneer Isaac loopt (zowel binnen als buiten) Isaac trekt zijn jas aan Isaac trekt een la open bij het openmaken van het slot in de tuin wanneer Isaac op de trap loopt wanneer Isaac zijn haar blondeert van de Polder - Cozijn - Duits - Kuik 8

Bijlage 2 Planning 5/2 Slagzin verzinnen Concreter idee voor advertentie (aanpassen aan thema vh museum) Kosten opvragen Havana Spel karakters maken Achtergronden maken 10/2 College: & Vergadering 12/2 Werkcollege met de klas. Slagzin uitkiezen Kosten Havana verwerken in verslag Karakters moeten af zijn Achtergronden verder afmaken Advertentie maken 17/2 College: & Vergadering 19/2 Achtergronden moeten af zijn Advertentie afmaken Spelprototype maken voor presentatie 24/2 Vakantie Presentatie maken 26/2 Vakantie Puntjes op de i zetten 3/3 College: & Bespreken of we echt ALLES af hebben voor de presentatie. Wie neemt wat mee, wie doet wat, wat wordt er gepresenteerd 5/3 Prototype presentatie 10/3 College: & 17/3 Webcollege 30/3 Werken aan eindproduct op school 31/3 Werken aan eindproduct op school 31/3 College: & 2/4 Werken aan eindproduct op school 6/4 Werken aan eindproduct op school 7/4 Werken aan eindproduct op school 8/4 Eindproduct inleveren bij Finne 9/4 Eindproduct presentatie + inleveren CD aan verzetsmuseum van de Polder - Cozijn - Duits - Kuik 9

Bijlage 3 Takenverdeling Debriefing Teamnaam Logo Visitekaartje Team CV Persona Scenario Probleemstelling Onderzoek conclusies User requirement Concept brainstorm Kernidee/ concept Moodboard Concept Presentatie(pp) Concept Presentatie Taakverdeling Scenario spel Wireframe spel Karakter spel van de Polder - Cozijn - Duits - Kuik 10

Concept Report Wireframe advertentie Demo presentatie(pp) Demo presentatie Ontwerp spel karakters Agenda blok 3 Slagzinnen advertentie Achtergronden spel Content matrix Introductie van het spel Spel coderen Animatie toevoegen Usability Test Nieuwe spelnaam Geluidseffecten Content praatwolkjes Verslag eindproduct PowerPoint eindproduct CD-label van de Polder - Cozijn - Duits - Kuik 11

Bijlage 5 UI testrapport Testaanpak Een belangrijk testdoel is om erachter te komen of de huidige interface overzichtelijk is. Is het voor de gebruiker makkelijk om het spel te beginnen en is het ook duidelijk wat de bedoeling is met het spel. Wil de gebruiker direct een introductie/ instructie van het spel, of deze later tijdens het spel, of zelfs helemaal niet. Een tweede doel is de navigatie. Hoe navigeert de gebruiker door het spel en wat is het klikgedrag van de gebruiker in dit proces. Verder is het belangrijk om te weten hoe de gebruiker met de inventory omgaat. Werkt de huidige inventory of is deze juist storend. Wil de gebruiker de inhoud van de inventory de hele tijd in beeld, of zelf aanroepen.. Scenario s De gebruiker krijgt een korte inleiding in het concept van Point & Click spellen. Vervolgens wordt de gebruiker gevraagd om naar de website (of een link/ html pagina) te gaan en te beginnen met het spel. Een uitleg van de werking van het spel moet niet nodig zijn, dat is immers ook niet mogelijk nadat het spel af is. Als de gebruiker vragen heeft of met onduidelijkheden zit, moeten deze terug te vinden zijn in de help en instructie functies. Instructies Instructies van het spel zijn verwerkt in het spelscherm. van de Polder - Cozijn - Duits - Kuik 12

Bijlage 5 Waarnemingen Usability Test Testdoelen Ons doel is om te kijken of ons spel goed te spelen is. We willen onderzoeken welke delen in het spel onze testpersonen snappen en welke niet. En of alle dingen die wij in ons hoofd hebben, ook zo duidelijk zijn voor anderen. Opdrachten/scenario s Verzamel alle dingen die Isaac nodig heeft om uiteindelijk naar de voetbalwedstrijd te kunnen. Alle dingen die hij nodig heeft pak je door er op te klikken waarna ze in je inventory bewaard worden. Heb je alles verzameld? Dan mag hij naar de wedstrijd! Taakverdeling Prototype aanpassen Schriftelijke opdracht maken Bijstaan van de testpersonen Testwaarnemingen verwerken,, Proefpersonen Wij hebben twee personen ons spel laten testen. Beide personen zitten in onze doelgroep. Fleur en Mo, beiden zijn student. Verbeterpunten: - Het moet duidelijker zijn waar je op kan klikken - Inventory wordt niet opgemerkt. - Het is niet duidelijk wat je moet verzamelen. - Het begin van het spel is niet duidelijk, misschien te verbeteren door in de intro te laten weten dat je op nieuw spel moet drukken. - Er wordt in de hal vaak op de verkeerd jas gedrukt. - De Help functie wordt niet gebruikt. - Over museum wordt niet bekeken. Punten die goed gingen: - Het was duidelijk dat ze de pijlen moeten gebruiken om van scherm te veranderen. - De intro werd gelezen. - Het spel ziet er aantrekkelijk uit. van de Polder - Cozijn - Duits - Kuik 13