Skatespots app Door Kwabena Appiah-nti en Sanne Schouten. In opdracht van Communication and Multimedia Design te HvA,

Transcriptie

1 Skatespots app Door Kwabena Appiah-nti en Sanne Schouten. In opdracht van Communication and Multimedia Design te HvA,

2 Inleiding Dit document bevat een ontwerp verantwoording van de applicatie Skatespots. De applicatie is ontstaan voor het vak the social web aan de opleiding Communication and Multimedia Design aan de Hogeschool van Amsterdam. In het document kunt u in grote lijnen terug vinden hoe ons ontwerp is opgebouwd van begin tot eind prototype. Dit document is slechts een beknopte versie van ons gehele proces, alleen de belangrijkste punten(schermen) worden behandeld. Inhoud Inleiding blz. 2 Doelgroep blz. 3 Kernidee blz. 3 Conceptmodel blz. 4 Functioneel ontwerp (paper prototype) blz. 5-6 Scenario s (low fidelity wireframes) blz. 7-8 Wireflow (high fidelity wireframes) blz. 9 Reflectie blz. 10 Bronnen blz. 10 2

3 Doelgroep De doelgroep van onze skatespot applicatie zijn skaterboarders, zowel mannelijk als vrouwelijk. De algemene leeftijd van de doelgroep is tussen de 15 en 25 jaar. Een aantal verwachtingen die de doelgroep heeft die wij in de applicatie hebben verwerkt zijn; - Over de gehele wereld(kaart) kunnen zoeken naar skatespots - Onbeperkt aantal spots kunnen vinden en toevoegen - Een verwijzing naar het navigatiesysteem van de mobiel(of googlemaps) - Je favoriete skatespots kunnen opslaan in de app - Zoeken op bepaalde tags (halfpipe, bowl, park etc.) Dingen die wij nog zouden willen toevoegen in een nieuwe versie; - Je skatespot prive of publiekelijk instellen - Delen via social media - Toevoegen van skateshops - Meerdere extremesport spots (longboard, blading, bmx etc.) - Meerdere talen Kernidee Een applicatie bieden aan skateboarders waar ze gemakkelijk en snel skatespots kunnen vinden, toevoegen en delen over de gehele wereld(kaart). 3

4 Conceptmodel Route Skate parken toont weg naar creëert Architectuur bestaan uit Skate winkels bestaan uit bestaan uit Skateboarders voegen Skatespots toe aan Map geven en zien zijn worden toegevoegd aan geven en zien Ratings worden toegevoegd aan Locaties zijn een plaatsen geven Comments worden toegevoegd aan worden toegevoegd aan Foto s wordt toegevoegd aan BMXen Community Informatie Longboarden Overige sporten deelt Rolschaatsen Blading 4

5 Functioneel ontwerp Maps (landingspagina) Favorieten (overzicht) De maps pagina is waar de gebruikers binnen komen, dit moet er dus een goede, functionele uitstraling hebben. De map zal spots over de hele wereldkaart tonen door middel van een kleine foto, dit is gebasseerd op pattern 1. Daarnaast is het van belang dat de gebruiker weet waar hij zelf is op de map, zodat hij grof kan navigeren. Dit is gebasseerd op pattern 2. (NB; In de detailpagina is een optie tot exacte navigatie.) De favorieten lijst biedt de gebruiker een overzicht van zijn opgeslagen skatespots. Het is in een overzicht van belang dat de gebruiker de voor hem meest relevante informatie ziet, geen extra s. Dit is een afbeelding, de titel, de afstand en de populariteit. Hier hebben we zowel pattern 1 als 2 ter inspiratie gebruikt. Deze patterns zijn slechts een kleine greep uit vele. 5

6 Functioneel ontwerp Spot (detailpagina) Toevoegen (aanmaken spot) Op de detailpagina kan de gebruiker alle ins en outs over de skatespot te vinden. Het is van belang dat de gebruiker hier kan vinden wat hij wil vinden, geen overbodige dingen maar wel alles wat nodig lijkt te zijn. Afbeeldingen spreken duizend woorden, zo ook bij een skatespot. De gebruiker zal dus naast een beschrijving ook foto s kunnen vinden van de spot. Tevens zal de gebruiker hier een knop vinden voor navigatie naar de skatespot(via eigen mobiel). Er zijn vele patterns te vinden van detailpagina s, de bovenstaande hebben ons het meest op weg gebracht met wat we wel en niet wilden laten zien. Bij het toevoegen van een skatespot, wil de gebruiker zijn ei kwijt. Wij bieden hem daarom zoveel ruimte als hij zelf wil in het toevoegen van een omschrijving, foto s en catagoriën (tags). Dit onderdeel was lastig te basseren op een pattern omdat het specifieke informatie bevat die grotendeels alleen voor de skatespot app van belang is. De bovenstaande patterns zijn slechts een kleine greep uit de vele die ons inspiratie hebben geboden. 6

7 Scenario 1 - reader Voor gebruik van de applicatie: De gebruiker heeft zin om te skaten met zijn vrienden, ze weten alleen niet waar. Ze pakken de app erbij en beginnen te browsen. Tijdens gebruik van de applicatie: The pool Groene voet Favorites May 2nd, Favorites Favorites Favorites Report 18 Comments: 11 Toffe plek! Did my first flip Great one! My Got to love it Favorite Wanneer de gebruiker de applicatie geopend heeft komt hij op de kaart pagina. Zijn locatie word ingeladen en de map zoekt de dichtsbijzijnde spots. De gebruiker kan over de gehele wereld browsen in deze map. De skatespots zijn op de kaart aangegeven met een miniatuur foto. Wanneer de gebruiker op de foto klikt word de titel van de spot zichtbaar. Hier kan de gebruiker op verder klikken om naar de detailpagina te gaan. Op de detail pagina vind de gebruiker foto s en een omschrijving van de skatespot. Daarnaast kan hij ook beoordelingen lezen in de vorm van comments, likes en favorieten. Deze kan hij tevens zelf ook toevoegen. Wanneer de gebruiker een leuke skatespot heeft ontdekt, kan hij deze opslaan in favorieten. Zo kan hij de spot ieder moment terug vinden. Na gebruik van de applicatie: De gebruiker en zijn vrienden hebben een toffe skatespott gevonden en gaan deze checken. Ze keren eventueel nog terug naar de applicatie om de spot te beoordelen. 7

8 Scenario 2 - creator Voor gebruik van de applicatie: De gebruiker is aan het skaten en komt een toffe plek tegen die hij wil delen met andere skaters. Tijdens gebruik van de applicatie: Title Description Notifications: New spots, nearby Comments About: Skatespott is an app created for a schoolcourse named Social Web for the study Communication and Multi Media Design in Amsterdam - The Netherlands Tags Pool Nice architecture Halfpipe Bowl Skate Shop Board Grind Park Wheels Help: The purpose off this app is to exchange skatespots and keep the fun in the skate community. If the app doesn t work please send your claim to idontcare@skatespot.nl... Add Add Wanneer de gebruiker een nieuwe spot in de applicatie wil toevoegen. Drukt hij op new spot en komt hij wederom bij een kaart. Zodra hij de locatie goed heeft gezet kan hij op voeg toe drukken om toe te voegen. Wanneer de gebruiker de nieuwe skatespot gaat toevoegen word de camera functie meteen geopend. De gebruiker kan ook een foto uit zijn bestaande kiezen door op de vierkantjes te drukken. De gebruiker kan zijn skatespot een titel geven een omschrijving, tags en vervolgens kan de skatespot toegevoegd worden aan de applicatie. Bij instellingen kan de gebruiker aanzetten welke meldingen hij wil ontvangen om op de hoogte gehouden te worden van de applicatie en zijn skatespot. Na gebruik van de applicatie: De gebruiker heeft zijn eerste eigen spot toegevoegd aan de app. Hij blijft op de hoogte van zijn spot door mede-skaters die de spot beoordelen via de app. 8

9 Wireflow 0.1 Laden 5.0 Zoeken 3.0 Favorieten 1.0 Maps 2.0 Toevoegen 6.0 Opties 4.0 Detailpagina 1.1 Maps Camera 2.2 Omschrijven 9

10 Reflectie De samenwerking verliep voorspoedig. We wisten wat we van elkaar konden verwachten en wat we aan elkaar hadden, hierdoor konden we de taken gemakkelijk verdelen en waren de opleveringen aan elkaar proffesioneel. Het proces van het maken van de app verliep ook goed, we hadden vanaf het begin al eenzelfde eindprototype in ons hoofd en we zijn tevreden met het resultaat. Bronnen Kort doelgroep interview Foto s van; < Iconen in de schermen van; < Patterns van; < & < 10