rabb-it applicatie Ontwerpdocument avv5 Eindopdracht

Transcriptie

1 rabb-it applicatie Ontwerpdocument avv5 Eindopdracht Informatiearchitectuur Down the rabbit hole door: Danilo Merea student: Versie: 26mei 2015 Klas: Roze

2 Inhoudsopgave Down the rabbit hole DTRH, Opdracht, Doelgroep, Doelen 2 De Opdracht Sitemap & Affinity diagram 3 Sitemap met keuzes 4 Affinity diagram met doelen 5 Schermontwerpen Beginscherm + Menu Artiesten pagina Artiesten aandragen Rabb-It avonden Avond informatie 11 Down The Rabbit Hole is een festival van Mojo Concerts. Vorig jaar was DTRH een heel groot succes en is ook een van de belangrijkste festivals voor deze organisatie. Mojo wil hun succes verder uitbereiden door Rabb-it avonden te organiseren. Deze Rabb-it avonden vinden het hele jaar plaats op de locaties waar de festival ganger het meeste te vinden is en op deze manier is de doelgroep het hele jaar verbonden met dit festival. Dit is goed voor Down The Rabbit Hole zelf. en voor de naams bekendheid van Mojo festivals. De avonden bestaan niet alleen uit muziek, ook zullen er altijd een of meer activiteiten plaats gaan vinden. De Doelgroep Mojo Concerts sluit met hun festival Down The Rabbit Hole goed aan bij de doelgroep, en is afgelopen jaar een groot succes geworden. Met de Rabb-it avonden wil Mojo een nog betere ervaring bieden aan de festivalgangers omdat dit het hele jaar zal gaan plaatsvinden. De festivalgangers zullen veel meer betrokken zijn bij het festival doordat zelf aangedragen artiesten door deze avonden ook grote kans maken om op een van de podia te komen staan. Conclusie 12 De Doelen van de applicatie Bronnen 12 Door de applicatie kan de gebruiker op een vrij eenvoudige manier snel tot hun doelen komen. De doelen zijn namelijk; het belijken van Rabb-it avonden en informatie hier over, aanbod van artiesten bekijken, artiesten aandragen en beoordelingen van artiesten bekijken. Aan mij als ontwerper van de app is nu gevraagd om voor Down The Rabbit Hole organisator Mojo Concerts een applicatie te ontwerpen, die de de Rabb-it avonden gaat ondersteunen. bij het tekenen van de schermen heb ik de gebruikers doelen goed meegenomen en deze zul je terug zien in het ontwerp. Danilo Merea - 3 juni 2015 Pagina 2

3 de sitemap & Affinitydiagram Dit hoofstuk gaat over de sitemap en het Affinitydiagram. Die ik gemaakt heb voor de Rabb-it applicatie. Hierbij laat ik de relatie zien tussen het diagram en de sitemap, en ziet u welke structuur ik heb gebruikt voor de Rabb-it applicatie. Voor het maken van de sitemap heb ik gelet op de user goals en naar het al eerder gemaakte affinitydiagram. Alle elementen zitten hier in verwerkt.

4 De sitemap Link met het affinity diagram De sitemap staat in verhoudeing met het affinitydiagram die ik eerder gemaakt heb over het plannen van een festival door festivalgangers. De gebruiker doorloopt een paar stappen en deze komen in de sitemap overeen, en zitten dus ook verwerkt in de app. De verschillende onderwerpen die aanbod komen met het plannen van een festival staan in de sitemap. Zie bijvoorbeeld het bekijken van het aanbod van artiesten, of de verschillende podia. De gebruikers doelen Doelen van de gebruikers zijn onder andere; Tickets kopen (zie 5.1), De Rabb-it avonden bekijken en informatie hierover lezen (zie 4.1), Het aanbod van artiesten bekijken, en hierover informatie opzoeken, muziek beluisteren,de artiest beoordelen, en eventueel een nieuwe artiest aandragen (zie 2.0). Al deze doelen zijn in de sitemap verwerkt. Danilo Merea - 26 mei 2015 Pagina 4

5 Affinitydiagram Link met de Sitemap De sitemap staat in verhoudeing met het affinitydiagram die ik eerder gemaakt heb over het plannen van een festival door festivalgangers. De gebruiker doorloopt een paar stappen en deze komen in de sitemap overeen, en zitten dus ook verwerkt in de app. De verschillende onderwerpen die aanbod komen met het plannen van een festival staan in de sitemap. Zie bijvoorbeeld het bekijken van het aanbod van artiesten, of de verschillende podia. De gebruikers doelen De gebruikersdoelen die ik uit het onderzoek naar de planning en de dag indeling van festivalgangers haal zijn ; Praktische informatie zoeken ( hier vallen dus prijs, locatie, datum, tijd, foto s checken), Muziek informatie zoeken ( hier valt onder Line up, muziekstijlen en artiest informatie zoeken), Sociaal voorbereiden (hieronder valt vriendenzoeken, kijken wie er nog meer gaan, en het aantal mensen die gaan bekijken), Festival voorbereiden ( hier onder valt reisplannen, kosten bepalen en tickets printen), en als laatste noemde ze hun Festival dagindeling ( dit was lopen naar de set). Danilo Merea - 26 mei 2015 Pagina 5

6 Scherm ontwepren Op basis van de user needs en de affinity diagram heb ik de keuze gemaakt om de pagina s verder uit te gaan werken. De gebruiker zijn goal heb ik in de schermen zo goed mogelijk proberen te verwerken met ook de business goals. De schermen zijn Als idee geschetst als Lo-Fi Wireframes, en mijn keuzes voor de beste Lo-Fi s bespreek ik in dit hoofdstuk. Deze ben ik verder uit gaan werken in Detail wireframes, die ik heb verhelderd door gebruik te maken van annotaties en onderbouwingen bij elke pagina. De wireframes zijn allemaal gebasseerd op de user en business goals zoals in de opdracht besproken. en op basis van het eerdere onderzoek dat ik heb gedaan. In mijn tekeningen heb ik de stijl aangehouden van Down The Rabbit Hole.

7 Beginscherm + Menu Op het beginscherm wilt de gebruiker zo snel mogelijk zien waar hij heen kan. en wat er gedaan kan worden. Met de belangrijkste usergoals als uitgangspunt ben ik gaan ontwerpen. Ook heb ik een menu uitgewerkt die alles overzichtelijker weergeeft in een lijst wanneer je oook op andere paginas bent. Ook zie je hier je profiel. Lo-fi A: Begin Lo-fi B: Begin Lo-fi C: Menu Detail Beginscherm Detail Menu + Je ziet waar je bent + Meest geklikte dingen boven aan. + Socialmedia linkjes en icoontjes bij de buttons - Veel ruimte over - Vraagteken onduidelijk Keuze + Meer gebruik gemaakt van de ruimte. + Iconen bij de buttons en gebruik gemaakt van pijltje - Kaartweergave niet echt nodig op het beginscherm - Niet in DTRH stijl. + Groot profiel met info. + Zoekbalk toegepast voor mensen die naar iets specifieks opzoek zijn op de app. - Niet in DTRH stijl en alles is vrij strak - Menu niet in goede volgorde. De keuze die ik gemaakt heb voor de Detail wireframes is om deze lo-fi s als basis toe te passen. maar veel verder te gaan in de stijl van DTRH. Ook wil ik Mojo meer in de app betrekken, iets andere indeling gaan toepassen en overbodige dingen weglaten. Het menu ga ik in iets andere volgorde en stijl doen als in de Lo-fi wireframes. Toelichting In het Detail Beginscherm zie je dat ik mijn keuze heb toegepast. de stijl is veel meer in DTRH, iets andere indelingen en overbodige dingen er uit. Nights en Artiesten heb ik boven aan omdat ik deze belangrijk vindt. Favorieten heb ik vervangen voor Likes, en ik heb een registreer knop inplaats van locaties, want deze vond ik dubbel met de Nights. Ook heb ik de engelse taal toegevoegd omdat er veel buitenlandse bezoekers zijn. Het gedetailleerde menu hier boven is de indeling aangepast. ook heb ik gekozen voor een ander soort button om bij het menu te komen. Deze zat ook al in de Lo-fi s maar had toen geen functie. Bij profiel heb ik socialmedia toegevoegd, en ik heb bij belangerijke menu items icoontjes bijgevoegd. Ook het menu is geheel in dezelfde stijl. Bovendien zie je op de schermen boven in waar je je bevind. dit heb ik meegenomen uit de Lo-fi tekening. Danilo Merea - 3 juni 2015 Pagina 7

8 Artiesten pagina Detail Artiesten lijst Detail Artiest info Wanneer je je op de artiesten pagina bevindt, zie je de lijst met alle artiesten van de Rabb-it avonden. Deze lijst kan gesorteerd worden op de manier zoals jij wilt. Wanneer er op de artiest geklikt word verschijnt er gedetailleerde informatie over de artiest zelf, met hierbij foto s muziek en de Rabb-it Avonden. Lo-Fi A: Lijst Lo-Fi B: Lijst + Je ziet waar je je bevind + Je kunt je eigen sorteer methode toevoegen. + Duidelijk over wie het gaat - Niet in de stijl van DTRH - Likes raar weergegeven. Keuze Danilo Merea - 3 juni Veel informatie zichtbaar over de artiest. + De user goals toegepast, namelijk locaties en ratings. - Niet in de stijl, en vrij minimaal. De keuze die ik gemaakt heb voor de Detail wireframes is om deze lo-fi s als basis toe te passen. maar veel verder te gaan in de stijl van DTRH. Ook wil ik Mojo meer in de app betrekken, iets andere indeling gaan toepassen en overbodige dingen weglaten. Ik heb voor meer socialmedia in de app gekozen omdat dit tegenwoording een belangrijk onderdeel is. Toelichting Voor de Detail Artiesten lijst heb ik gekozen voor een iets andere indeling dan dat ik toegepast heb bij de Lo-fi s. Socialmedia komt er in terug en ik heb meer gewerkt in de stijl die DTRH heeft. Ook zie je goed waar je je bevind en is er een duidelijke sorteer mogelijkheid namelijk boven midden in. Bij het klikken op deze icoon worden er meerdere sorteer opties weer gegeven in een soort ketting. Bij het klikken hierop verandert de lijst in de gewenste volgorden. Ik heb gekozen om de iconen van socialmeda en het hartje voor de likes ook klikbaar te maken en niet pas bij details. Dit voor het sneller berijken van je goals. Bij de Detail Artiest info pagina heb ik gekozen om de zelfde items als in de Lo-fi te blijven gebruiken, maar iets anders weergegeven. Ook heb ik dingen toegevoegd die ik in andere schermen gebruik om consistent te blijven. De instagram bij socialmedia heb ik er uit gehaald omdat er al foto s boven op de pagina staan. Pagina 8

9 Artiesten aandragen Detail Artiest aandragen Detail Aandragen verder Voor de Rabb-it avonden kunnen er ook minder bekende artiesten optreden. Dit om bekender te worden. Fans en bekenden kunnen op deze pagina hun artiesten aandragen, en bij voldoende likes komt de artiest op het podium komen te staan, Lo-Fi A: Aandragen Lo-Fi B: Aandragen + Je ziet waar je bent, er word gebruik gemaakt van grote iconen, en er zijn veel verschillende manieren om je artiest aan te dragen. - Niet echt in de stijl van DTRH, en door de vele manieren van aandragen is er geen controle mogelijk. Keuze Danilo Merea - 3 juni Deze manier van je artiest aandragen is duidelijker. Bij het toevoegen van socialmedia van de artiest is er directe feedback en worden er items weergegeven die ook op de site staan. - Veel content, onodige grote button. De keuze die ik gemaakt heb voor de Detail wireframes is om deze lo-fi s als basis toe te passen. maar veel verder te gaan in de stijl van DTRH. Ook ben ik een iets andere indeling gaan toepassen en heb ik overbodige dingen weglaten. Toelichting Voor de Pagina van het aandragen van je favoriete (onbekende) artieste heb gekozen om meer gebruikt te maken van de DTRH stijl, en deze toegepast op de indeling van Lo-Fi B. Ik heb gekozen om deze pagina weer te geven in twee stappen, de ene stap voor het invullen en de andere stap na het invullen van socialmedia. Ik heb gekozen voor Facebook als verificatie middel, Soundcloud of Spotify voor het weergeven van muziek, en Instagram voor de foto s van de artiest. Bij het klikken op de button rechtsonder update de pagina en wordt wanneer alles goed ingevuld is, en de verificatie klopt alles weergegeven zoals hier boven. De socialmedia is gelijk te bekijken en te beluisteren nog voor het versturen van de aandracht. Vanaf het bevestigen van het aandragen van je artiest zal hij in de lijst komen te staan, want de gegevens kloppen vanwege de socialmedia. Je wordt door verwezen naar de Artiesten lijst. Pagina 9

10 Rabb-it avonden De Rabb-it avonden pagina begint met een lijst van alle avonden die vooraf gaan aan Down The Rabbit Hole. Deze geheel in hun eigen stijl en thema. De avonden worden het hele jaar door gehouden en er komen veel mensen op af. In de pagina wou ik terug laten komen dat je ziet wanneer het is en hoeveel mensen er komen. om te sfeer weer te geven is er ook een foto bij. Lo- Fi A: Avond lijst + Sfeer icoontjes en een duidelijke datum - Ziet er vrij chaotisch uit, zijn iconen wel nodig en is zo n korte naam wel handig. Lo-Fi B: Avond lijst + Grote foto voor de sfeer, klik verder pijltjes, volledige naam en datum weergave. - Je ziet niet hoeveel mensen er komen en hoe sorteer je. Detail Avonden lijst Detail Avond soteren Toelichting Mijn keuze voor deze weergave van de Detail wireframe van de Avonden lijst heb ik gemaakt door de Lo-Fi wireframes op elkaar af te wegen en te bedenken hoe ik de stijl van DTRH beter zou kunnen terug laten komen. Bij de Lo-Fi wireframes was de indeling vrij chaotisch en dat heb ik in mijn Detail wireframe proberen te voorkomen. Dit door minder te willen laten zien en alleen de belangrijke dingen weer te geven. Vrij eenvoudige sfeer plaatjes. Grote titels met iets kleinere datum, en aan de rechter kant het aantal mensen dat er komt. Bij het klikken hierop kom je bij een lijst waar eerst je vrienden worden weergegeven een daarna pas de rest van de mensen. Ook voor de avonden lijst heb ik gekozen om sorteermethodes toe te passen. Dit op de zelfde manier als bij artiesten zoals eerder gezien. Bij het klikken hier op komt er een spinneweb tevoorschijn met de mogelijke sorteeropties die je toe kunt passen. Bij het klikken hierop zal het web weer verdwijnen en de lijst worden weergegeven op de gewenste manier. Tot slot heb ik net als bij de artiesten lijst gekozen om een terug naar boven knop er bij te doen, dit in verband met redelijk lange lijsten en lang scrollen door de vele locaties. Keuze De keuze die ik gemaakt heb voor de Detail wireframes is om deze lo-fi s als basis toe te passen. maar veel verder te gaan in de stijl van DTRH. Ook wil ik Mojo meer in de app betrekken, iets andere indeling gaan toepassen en overbodige dingen weglaten. Verder heb ik de sorteer opties uitgewerkt. Danilo Merea - 3 juni 2015 Pagina 10

11 Conclusie Bronnen Gebuikers van de Rabb-it app verwachten een kleine en simpele applicatie die ook terplekke te gebruiken is. De gebruiker zal met mijn scherm ontwerpen al best bekend zijn met de opties en ontwerpen die de app heeft, doordat ik de stijl van DTRH heb toegepast en gebruik heb gemaakt van al aangeleerde patronen. De doelen van de gebruikers en van Mojo komen overeen met wat de app kan, en zijn snel te bereiken. Ik heb de website van DTRH zoveel mogelijk proberen toe te passen waardoor de manieren van het bereiken van de doelen van de gebruikers vrijwel het zelfde zal zijn. Ook zal de gebruiker zich hierdoor beter thuisvoelen in de app, en de app blijven gebruiken. Briefing ontwerpdocument. (2015, mei 21). Opgehaald van Moodle: 8u7aWBfUXWYA4wNqsl4/edit?usp=sharing Home. (2015, Juni 24). Opgehaald van Down The Rabbit Hole: downtherabbithole.nl/ Op het beginscherm wilt de gebruiker zo snel mogelijk zien waar hij heen kan. en wat er gedaan kan worden. Met de belangrijkste usergoals als uitgangspunt ben ik gaan ontwerpen. Ook heb ik een menu uitgewerkt die alles overzichtelijker weergeeft in een lijst wanneer je oook op andere paginas bent. Wanneer je je op de artiesten pagina bevindt, zie je de lijst met alle artiesten van de Rabb-it avonden. Deze lijst kan gesorteerd worden op de manier zoals jij wilt. Wanneer er op de artiest geklikt word verschijnt er gedetailleerde informatie over de artiest zelf, met hierbij foto s muziek en de Rabb-it Avonden. Voor deze Rabb-it avonden kunnen er ook minder bekende artiesten optreden. Dit om bekender te worden. Fans en bekenden kunnen op deze pagina hun artiesten aandragen, en bij voldoende likes komt de artiest op het podium komen te staan. Tot slot. Als je bij de Rabb-it avonden pagina begint met een lijst van alle avonden die vooraf gaan aan Down The Rabbit Hole. Deze geheel in hun eigen stijl en thema. De avonden worden het hele jaar door gehouden en er komen veel mensen op af. In de pagina wou ik terug laten komen dat je ziet wanneer het is en hoeveel mensen er komen. om te sfeer weer te geven is er ook een foto bij. Danilo Merea - 3 juni 2015 Pagina 11

12 rabb-it Applicatie ontwerpdocument Informatiearchitectuur Down the rabbit hole door: Danilo Merea