Informatiearchitectuur P1415 eindoplevering Romy van der Beek 500707995 P08 Mint Docent: Vincent Vijn 1 juni 2015
Inhoudsopgave Inleiding 1 Het project 1 Doelen van de gebruiker/ DTRH 1 De app in het kort 1 De sitemap 3 Sitemap 4 Link affinitydiagram 5 Relaties tussen schermen/onderdelen 5 Omschrijving van de inhoud van de app 5 Overview doelen 5 Inloggen 7 Lofi- schetsen 8 Mijn keuze 8 Detailschets 9 Agenda 11 Lofi-schetsen 12 Mijn keuze 12 detailschets 13 Artiesten 15 Lofi-schetsen 16 Mijn keuze 16 Detailschets 17 Nieuwsgierig naar DTRH?! 19 Lofi-schetsen 20 Mijn keuze 20 Detailschets 21 DTRH Ik ben gevraagd om een app te ontwerpen voor Mojo die de Rabb-it avonden bij Down The Rabbit Hole zal ondersteunen. DTRH is een aanvulling op het belangrijkste festival van Mojo. Hierbij worden er Rabb-it avonden georganiseerd met een bepaald thema. De thema s worden verbonden aan de areas die DTRH te bieden heeft. Iedere area heeft zijn eigen sfeer. Op zo n avond komen er 1 of meerdere artiesten. Ook worden er activiteiten georganiseerd en er zijn surprise acts in stijl van de area. Doelen van de gebruiker - De gebruiker wil een leuke avond met goede muziek en activiteiten (zoeken op thema (area), artiest, tijd, aantal tips, plaats en of genre). - De gebruiker wil aanbevolen artiesten en/of avonden kunnen bekijken (klikgedrag, vrienden). - De gebruiker wil artiesten kunnen aandragen voor de aankomende Rabb-it avond. - De gebruiker wil artiesten kunnen beoordelen. - De gebruiker wil gebruikers kunnen ondersteunen (zoeken & surfen). Doelen van DTRH - Naamsbekendheid creëren, steeds meer mensen weten van het concept. - Er kunnen E-tickets aangeschaft worden via de app. De app in het kort Als je op zoek bent naar een leuke, gezellige avond met goede muziek, mee wil denken over opkomende artiesten die je wil zien of artiesten die je hebt gezien wil beoordelen, zit je bij de applicatie goed! CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 1
CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 2
De Sitemap Door te kijken naar de verschillende doelen ben ik erachter gekomen welke schermen het belangrijkst zijn en heb daarvan een sitemap gemaakt. Ook zie je hier welk doel aan welk scherm gekoppeld is en hoe de app daadwerkelijk in mekaar zit. CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 3
De Sitemap CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 4
Details sitemap Link affinitydiagram met de sitemap Door het beslissingsproces van festivalgangers te onderzoeken, ben ik erachter gekomen wat zij belangrijk vinden en wat ze allemaal ondernemen voor een festival en tijdens een festival. Zo zei bijna iedereen dat ze van te voren de website of applicatie even checken om de algemene informatie over het evenement te bekijken. Daarnaast kopen ze natuurlijk kaartjes, in de meeste gevallen via de website. Relaties tussen de schermen In de zero state, dus wanneer de gebruiker de applicatie voor het eerst gebruikt, krijgt hij/zij een inlogscherm te zien waar hij/zij de keuze heeft om in te loggen. Vervolgens komt de gebruiker altijd op de homepagina/agenda pagina. Hier heeft de gebruiker een overzicht van alle komende avonden. Ook kan de gebruiker extra informatie krijgen en tickets bestellen. Via het menu aan de onderkant kan de gebruiker navigeren naar andere pagina s binen de applicatie. De structuur van de applicatie 1. Stel de gebruiker wil een kaart bestellen voor de eerstkomende avond Het bos, de gebruiker navigeert via de agenda pagina naar Het bos. 2. Stel de gebruiker wil een artiest aandragen voor 1 van de avonden. Hij gaat naar de tab artiesten en draagt daar zijn/ haar favoriete artiest aan. De doelen per pagina De pagina s binnen de applicatie hebben allemaal hun eigen doelen. 1. Login: De gebruiker wil aanbevolen avonden/artiesten kunnen bekijken. Dit gebeurt onder andere op basis van activiteiten van vrienden. Hiervoor moet je inloggen anders kan je dit niet zien. Je hebt de keuze om in te loggen. 2. Home/Agenda: De agenda overzicht van de verschillende avonden heeft als doel het bieden van een leuke avond met goed muziek en activiteiten. De gebruiker kan extra informatie krijgen en tickets bestellen. Ook kan de gebruiker filteren op bijvoorbeeld thema. 3. Artiesten: Via deze pagina kan de gebruiken artiesten aandragen en tegelijkertijd beoordelen. 4. Over DTRH: Hier kan de grbuiker extra informatie vinden over DTRH. Wat is DTRH en wie zit daar achter? Hiermee kunnen ze ook een stukje naamsbekendheid creëren en de gebruiker kan een beetje van de sfeer proeven door de filmpjes. CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 5
CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 6
Inloggen Bij de volgende pagina gaat het enkel alleen om het inloggen. Alleen als je dat echt natuurlijk, want het is geen verplichting. Als je inlogt kan je ook zien wat je vrienden voor jou aanbevelen. Deze pagina krijg je alleen te zien bij de zero state, dus als je de applicatie voor de eerste keer opent. CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 7
Inloggen Doel: Het doel van het inloggen bij de applicatie is dat de gebruiken aanbevolen avonden en artiesten kan bekijken. 1. Alle avonden op een rijtje 2. Klapmenu met de avonden per stuk Mijn keuze Ik wil voor mijn detailschets de 2 lofi-schetsen gaan combineren om tot een uiteindelijk ontwerp te komen. Ik wil bij de detialschets de gebruiker sowieso de mogelijkheid bieden om in te loggen maar ik wil het hun niet veplichten. Ik wil er dus wel een optie in verwerken om het inlogscherm over te kunnen slaan zoals je ziet in schets 1. Ook wil ik de gebruiker wat extra informatie bieden zoals dat staat weergegeven in schets 1 om de gebruiker op de hoogte te stellen van de applicatie. De button van het inloggen wil ik net zoals bij schets 1 aan de zijkant zetten gelijk aan de invulvelden. Bij de detailschets wil ik wel de volledige naam vermelden zoals in schets 2. Informatie DTRH en waarom inloggen Uiteindelijk ben ik erachter gekomen dat je het beste aanbevolen avonden en artiesten kunt bekijken door middel van Facebook, dus heb ik besloten de normale inlogoptie weg te laten. Dat is ook eigenlijk het enige waar je voor inlogt. Voordelen + Extra informatie waarom er ingelogd moet worden + De gebruiker kan via facebook inoggen + De gebruiker is niet verplicht om in te loggen Nadelen - Overslaan is niet heel duidelijk weergegeven Voordelen + Optie om te registreren + Gehele naam is zichtbaar Nadelen - Geen optie om het inloggen over te slaan - Geen extra informatie over wat het is CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 8
Detailschets inloggen 1. Inloggen met je facebook-account om de gebruiker de mogelijkheid te bieden te kunnen zien wat vrienden je aanbevelen. 2. Extra informatie waarom er ingelogt moet worden 3. Als je niet inlogt, heb je nogsteeds beschikking over de applicatie maar je kunt geen aanbevolen avonden en/of artiesten bekijken. 1 2 3 CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 9
CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 10
Agenda Hier kan de gebruiker een goed beeld krijgen van alle komende avonden. Ook kan de gebruiker extra informatie over de specifieke avond bekijken en tickets bestellen na klikken op de button. CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 11
Belangrijke informatie over de avond (plaats, tijd etc.) Agenda Doel: Het doel van de agenda is het bieden van een leuke, gezellige avond met goede muziek naar keuze van de gebruiker. Ook kan de gebruiker extra informatie krijgen over een specifieke avond en tickets bestellen. 1. Agende items gescheiden 2. Met afbeelding op thema, artiest, plaats etc. Mijn keuze Voor de detailschets wil ik me vooral gaan richten op schets 1. Dit biedt de gebruiker een duidelijk overzicht van alle avonden. Bovenin staan bij beide schetsen de filteropties weergegeven, die wil ik dan ook in mijn ddetailschets gaan verwerken. Dit om het zoeken naar een specifieke avond makkelijker te maken. Het lijkt me voor de gebruiker het beste om aan de zijkant groot de datum neer te zetten in plaats van een afbeelding zoals bij schets 2 te zien is. Wel wil ik een onderdeel van schets 1 toevoegen aan mijn detailschets. Ik heb daar namelijk aanbevolen avonden in verwerkt. Aangezien dit een belangrijk punt is bij het inloggen, wil ik dit er sowieso in verwerken. Zoals je hieronder kunt zien, is dit ook een schets voor de agenda pagina, maar waar het mij eigenlijk om gaat is het menu onderin. Aangezien het een applicatie wordt, lijkt het mij slim om het menu onderin de pagina neer te zetten. Dit is namelijk een makkelijke manier om tussen de pagina s te navigeren en duidelijk weergegeven. Voordelen + Filteropties + Duidelijk aan de zijkant op welke datum het is + Elke avond duidelijk avond van elkaar weergegeven Nadelen - Geen aanbevolen avonden zichtbaar Voordelen + Aanbevolen avonden + Filteropties Nadelen - Een afbeelding bij de agenda items is niet belangrijk CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 12
Detailschets agenda 1. Hiermee kan de gebruiker de avonden filteren op thema, plaats, artiest, genre etc. Het schuift uit als je erop klikt. Filteren op: Filteren op: 1 > Thema (area) > Artiest > Tijd > Aantal tips > Plaats > Genre Thema (area) De poort Teddy Widder Idylisch Veldje Vuige Veld Het Bos Hotot 2 4 De Steiger De Vuurplaats 2. Hier kan de gebruiker als hij/zij heeft ingelogd zien door wie welke avond wordt aanbevolen. Dit kan dus steeds weer veranderen. 3 5 3. Door op deze button te klikken, kan de gebruiker extra informatie bekijken en uiteraard navigeren naar de ticket pagina. 6 4. Terug navigeren naar de agenda pagina. 7 5. Link naar de ticket pagina. 6. Afbeelding om de sfeer van de specifieke avond weer te geven (Bijvoorbeeld de avond Het bos ). 7. De gebruiker kan scrollen om meer avonden te kunnen bekijken of gebruik maken van de filteropties. CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 13
CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 14
Artiesten Bij de volgende pagina kan jij je mening geven over de artiesten door ze te waarderen en je kunt artiesten aandragen voor een aankomende avond. Door dit te doen draag je een steentje bij aan de avonden en je helpt DTRH de beste artiesten te selecteren. CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 15
Artiesten Doel: Bij deze pagina gaat het vooral om het aandragen van artiesten vooraf aan een avond en het beoordelen van artiest na een avond 1. Zonder afbeelding minder gescheiden 2. Apart in hokjes weergegeven Mijn keuze Ik ga voor mijn detailschets aan de slag met een combinatie van schets 1 en schets 2. Het doel van deze pagina is het aandragen van artiesten en het beoordelen van artiesten. Deze dingen wil ik dan ook goed naar voren laten komen in mijn detailschets. In schets 2 zie je dat je kan aangeven wie je graag wil zien. Dus dit wil ik dan ook in mijn detailschets verwerken. Verder wil ik de button van beoordelen van schets 1 overnemen. Voordelen + Makkelijk te zien door wie de artiest is aanbevolen + Duidelijke button Nadelen - De verdeling van artiesten is niet heel duidelijk - Geen afbeelding bij de artiest - Geen optie om artiesten aan te dragen Voordelen + Goede verdeling van artiesten + Je kunt artiesten aandragen + Detail hoe de artiest is beoordeeld Nadelen - Chaos bovenin de pagina door te veel tekst - keuze maken tussen hartje en sterretje voor beoordeling Als extra toevoeging van de pagina wil ik een kopje toevoegen onder elke artiest waar staat aanbevolen door met een foto van degene die de artiest heeft aanbevolen. Dit zie je ook terug in schets 1. Ik denk persoonlijk dat dit voor de gebruiker overzichtelijker is dan schets 2. Het komt over als een chaos waar teveel tekst wordt gebruikt. De pagina moet duidelijk en overzichtelijk zijn voor de gebruiker, dus ik kies ervoor om de indeling van de artiesten van schets 2 over te nemen. Hier zijn de artiesten in blokjes weergegeven. Hieronder zie je links van het beoordelen en rechts van het aandragen van artiesten een lofi schets. Die wil ik beide ook weergeven naast de artiesten pagina, aangezien ze onderdeel zijn van de artiesten pagina. CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 16
Detailschets artiesten 5 1. Door op de button te klikken kan de gebruiker een artiest aandragen die hij/zij graag op een avond zou willen zien. 1 6 2. Hier kan de gebruiker per artiest zien wie hem/haar heeft aanbevolen. Dit is alleen zichtbaar wanneer er ingelogd is. 3. Door op deze button te klikken kom je bij de pagina om de specifieke artiest te beoordelen. Dit zijn artiesten die al een keer op een avond zijn geweest. 4 2 3 5 4. Afbeelding van de artiest. 5. Bij beide kan de gebruiker terug navigeren naar de artiesten pagina. 6. Dit is geen verplicht veld. Geeft DTRH wel wat extra feedback. 7 7. Scrollfunctie om de gebruiker zodat de gebruiker meer artiesten kan zien die op een avond geweest zijn. 6 CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 17
CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 18
Nieuwsgierig naar DTRH?! Bij de volgende pagina kan de gebruiker extra informatie vinden over het evenement zelf. Wat is DTRH en wie zit daar allemaal achter? CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 19
Informatie over de organisatie van DTRH Over DTRH Doel: Bij deze pagina gaat het vooral om het bieden van extra informatie over de organisatie voor de gebruiker. Ook kan de organisatie een stukje naamsbekendheid creëeren. 1. Agende items gescheiden 2. Met afbeelding Mijn keuze Het doel van deze pagina is vooral het bieden van extra informatie aan de gebruiker, maar de organisatie kan hier ook een stukje naamsbekendheid aan over houden. De gebruiker vertelt het concept aan een vriend of vriendin en die vertelt het weer aan een vriend en zo gaat dat door. Op die manier creëer je naamsbekendheid. Voor mijn detailschets wil ik aan de slag gaan met schets 2. Het duidelijk doordat je eerst content ziet, dus je weet gelijk waar het overgaat. Vervolgens zie je daaronder een foto/video die je een stukje van de sfeer meegeven van de organisatie. Bij schets 1 wordt gelijk al een foto weergegeven. De gebruiker dan niet gelijk waar het over gaat. Voordelen + Afbeelding om de sfeer over te brengen + Extra informatie Nadelen - Niet gelijk duidelijk waar het over gaat doordat de foto bovenin staat. - Tekst in 1 klap bij elkaar Voordelen + Video en afbeelding om sfeer aan te geven + Tekst goed verdeeld + Gelijk duidelijk waar het om gaat doordat tekst bovenin staat Nadelen - Pagina loopt nog door CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 20
Detailschets over DTRH 1. DTRH biedt de gebruiker hier wat extra informatie over DTRH. Wat houdt DTRH in en wat kan je als gebruiker verwachten van de avonden. 1 2. Video om de avonden te kunnen ervaren en de sfeer te proeven. 3. De gebruiker kan gebruik maken van de scrollfunctie om nog meer te kunnen ervaren van DTRH. 3 2 CMD Informatiearchitectuur P1415 Mint Romy van der Beek 500707995 1 juni 2015 pagina 21