Opdracht 1: iQueen App 3a:
Flowchart
iQueen APP
iQeen APP
Nieuws overzicht
HOME/ NIEUWS
Evenementen Q-day
Jouw planning
A’dam live chart
Evenementen overzicht
Planning overzicht
A’dam live chart
Keuze hulp app
Info
Delen met vrienden
Delen op Facebook
Evenement Feesten
Bepaald Feest
Toevoegen aan planning
Vrienden zoeken
Meer info
Bepaalde Vrijmarkt
Vervoer Delen met vrienden
Agenda’s zoeken
Vrijmarkten
Route beschrijving
Social stuff
Evenement zoeken
Delen op Facebook
wijzig
Nieuws topic
Delen op Facebook
Weer
Nieuws
Eten en drinken
Toevoegen aan planning
Bus
Trein
Nieuws overzicht
Weer overzicht Nieuws topic
Eten en drinken overzicht
Agenda delen op Facebook
Opdracht 1: iQueen App 3b: Wireframe: Hoofdmenu
1 2 Q-Day Amsterdam App Evenementen 3 Q-day 2013
Achtergrond Achtergrond met koninginnedag thema. Er is gebruik gemaakt van de pattern ‘Deep Background’ (pagina 499)
2
Titel Deze titel geeft weer om welke App het gaat. Deze is niet klikbaar.
3
Navigatiekolom De 6 belangrijkste knoppen zijn groot afgebeeld in de ‘Grid of Equals Pattern’. (pagina 149) Op deze manier laat je zien dat deze knoppen even relevant zijn.
4
Nieuws knop Wanneer men op deze knop klikt krijgt hij een scherm met het volledige nieuwsoverzicht.
5
Nieuws overzicht De laatste nieuwsberichten worden hier weergegeven.
Jouw Q-Day planning
A’dam live chart
Keuzehulp App
Info
Social stuff
4 Nieuws 5
1
Nu.nl | Slecht weer op Koninginnedag AD.nl | Drukte op koninginnedag Nu.nl | Koninginnedag in A’dam
Opdracht 1: iQueen App 3b: Wireframe: Nieuwsoverzicht
1 Terug
2
Qday Nieuws
Nu.nl | Koninginnedag Slecht Weer. Nu.nl | Loveland Qday AD.nl | Beatrix viert feest Nu.nl | Drukte in A’dam met Qday Nu.nl | Koninginnedag Slecht Weer. Nu.nl | Koninginnedag Slecht Weer.
1
Terugknop Met deze knop ga je terug naar het vorige scherm.
2
Nieuws Het volledige overzicht van alle nieuwsberichten worden hier weergegeven met een thumbnail en de titel van het nieuwsbericht. Hier word gebruik gemaakt van de ‘News Box pattern’. (blz. 430) en de Thumbail-and-Text List pattern (blz. 459)
Opdracht 1: iQueen App 3b: Wireframe: Evenementen A
1 Terug
Evenementen
1
Terugknop Met deze knop ga je terug naar het vorige scherm.
2
Vrijmarkten
2
Icoon Hier komt een afbeelding/icoon te staan die past bij het thema ‘vrijmarkten’ en ‘feesten’ die verder in de huisstijl passen van de App.
3
Navigatielijst Onder de titel van het onderwerp komt een lijst te staan met verschillende evenementen. Dit zijn allemaal links. Hier word gebruik gemaakt van de ‘Menu Page’ Pattern (blz. 90)
4
Bodem navigatiebalk Linksonder staat de ‘home’ knop die je terugbrengt naar het hoofdmenu. De andere iconen geven de andere meest relevante 4 opties aan. De knop waar op geklikt word, word opgelicht. Hier word gebruik gemaakt van de ‘Bottom Navigation’ pattern (blz. 456)
Reigersbos Centrum A’dam Arena Amsterdam Zuid Sloterdijk De Dam 3 Waterlooplein
Feesten
SlamFM! 538 Qday Qday Houseday Qday Festival Loveland Qday God Save the Queen Qday Jazz
4
Opdracht 1: iQueen App 3b: Wireframe: Evenementen B
Loveland Qday
Terug
1
Toevoegen aan planning Met deze knop voeg je deze activiteit toe aan je planning. Deze kun je later raadplegen in de optie ‘planning’
2
Delen via Facebook Met deze knop kan de activiteit gedeeld worden via Facebook. Hier word gebruik gemaakt van de ‘Sharing Widget’ pattern. (blz. 426)
3
Delen met vrienden Met deze knop kan je deze activiteit delen met vrienden. Vervolgens kan er gekozen worden tussen verschillende communicatiekanalen zoals hatsapp, email of Facebook.
4
Activiteiten beschrijving Hier staat een beschrijving van de desbetreffende activiteit. de tekst loopt verder door als je naar beneden scrollt. de afbeelding en de knoppen om te ‘delen’ blijven wel gewoon telkens staan. Onderaan kun je klikken op de link ‘Ga naar ( ) website om naar de volledige website van het desbetreffende evenement te gaan.
Loveland Qday
1
3
2 Toevoegen aan planning
Delen via Facebook
Delen met vrienden
Geen Koninginnedag in Amsterdam zonder Loveland. Tenminste, dat vinden wij. Op 30 april is het Oosterpark in Amsterdam het decor voor Loveland Queensday. Na een memorabele editie in 2011 zijn we terug in 2012 op een grotere locatie met nog meer groen. Voor het echte oud-Hollandsche koninginnedaggevoel komt er een kleine kermis en een snuffelmarktje. Ga naar Loveland Qday website
4
Opdracht 1: iQueen App 3b: Wireframe: Jouw planning
1
terug
3
Jouw Q-day Planning
2
wijzig
9:00 - 12:00 | Vrijmarkt in Sloterdijk
1
Terug Met deze knop, keer je terug naar het vorige scherm.
2
Wijzig Wanneer je op wijzig drukt krijg je de mogelijkheid om de agenda te veranderen
3
Activiteit thumbnail Dit zijn kleine thumbnails met een afbeelding van de gekozen activiteit op die dag.
4
Agenda punten Wanneer je op een van deze punten drukt kan je kiezen voor meer informatie, wijzigen of verwijderen.
5
Agenda Delen Als je op deel agenda klikt, kan je hem via een social media delen, zodat al je vrienden kunnen zien wat jij gaat doen op koniginnendag.
13:12 - 14:00 | Theater 14:00 - 15:00 | Voorstelling
4
15:00 - 16:00 | Vrijmarkt in Sloterdijk 20:00 - 21:00 | Tiesto - Op de Dam
5
Deel via: social media
Opdracht 1: iQueen App 3b: Wireframe: A’dam Live Chart
A’dam Live Chart
Terug
1
A’dam Live Chart Met deze optie kun je via je camera op je telefoon door de stad lopen en zien waar de evenementen zijn. Er word gebruik gemaakt van ‘Augmented Reality’
2
Evenementen Pop-Up Als je in de buurt bent van een evenement verschijnt er een pop-up balk met gegevens van het feest. Hier word gebruik gemaakt van de ‘Titled Sections’ Pattern
3
Evenementen Overzicht Andere evenementen in de buurt worden ook weergeven in een pop-up. Om ruimte te besparen zie je alleen de naam van het feest. Als je erop klikt krijg je de volledige gegevens te zien. Rood gekaderde pop-ups zijn evenementen die je in jouw planning hebt toegevoegd.
4
Meer info/Facebook Als je klikt op ‘meer info’ kom je op de informatie pagina van het evenement. Via de Facebook knop kun je dit evenement delen met je Facebookvrienden. ier word hier gebruik gemaakt van de ‘Richly Connected Apps’ Pattern (blz. 470)
1 3 Loveland Qday
2 SlamFM! Party Rembrantplein 3 14:00 - 23:00 Routebeschrijving
4 meer info
Opdracht 1: iQueen App 3b: Wireframe: Info A
1
App Info
terug
2 Vervoer
Het weer
Nieuws
Eten en drinken
1
Terug Met deze knop, keer je terug naar het vorige scherm.
2
Navigatiekolom De 4 belangrijkste knoppen zijn groot afgebeeld in de ‘Grid of Equals Pattern’. (Pagina 149 ) Op deze manier laat je zien dat deze knoppen even relevant zijn.
Opdracht 1: iQueen App 3b: Wireframe: Info B
1
App Info - Weer
terug
2 1
Terug Met deze knop, keer je terug naar het vorige scherm.
2
Vernieuwen Met deze knop, vernieuw je het weer.
3
Het weer Hier kan je zien hoe het weer is op de dag zelf en op het moment van kijken. Dit wordt geupdate wanneer je naar de pagina gaat.
4
Grafiek Hier kan je zien hoe het weer is op de dag zelf en je kan in de grafiek naar rechts scrollen om verder op op de dag te kijken.
3
4
Opdracht 1: iQueen App 3b: Wireframe: Keuzehulp
Qday Keuzehulp
Terug
1
Selecteer tijd Hier kun je de voorkeur voor een bepaald tijdsbestek aangeven.
2
Evenementen keuze Hier kun je je voorkeur voor een bepaald evenement aanvinken met de pattern ‘Dropdown Chooser’ (pagina 380).
3
Locatie Hier kun je een locatie invoeren zoals de naam van een gebouw, plein of een adres. Dit is de pattern ‘Fill-in-the-blanks’ (pagina 362). Op basis van de ingevulde gegevens zoekt de App zelf de matches voor wat je hebt ingevuld. Ook kun je ervoor kiezen om je huidige locatie te gebruiken.
4
Volgende Als alle voorkeuren geselecteerd zijn en je op de knop ‘volgende’ klikt. Dit is de pattern ‘Prominent “Done” Button’ (pagina 257) Zoekt de app op basis van je voorkeuren een aantal evenementen uit waarbij je door steeds gespecifieerdere voorkeuren aan te geven uiteindelijk een evenement krijgt die bij je past. Deze kun je vervolgens aan jouw planning toevoegen.
Kies jouw Qday Selecteer tijd:
1
Tot
2 Soort evenement.. Feest Vrijmarkt Typ locatie in...
3 gebruik huidige locatie
4 Volgende
Opdracht 1: iQueen App 3b: Wireframe: Social Stuff
1 Terug
Social Stuff 1
Terug Met deze knop, keer je terug naar het vorige scherm.
2
Agenda’s zoeken Met deze optie kan je agenda’s van vrienden zoeken en inzien.
3
Vrienden zoeken Met deze optie kan je je vrienden die ook in Amsterdam zijn vinden. Dit gaat in combinatie met de A’dam live chart.
3
Agenda Delen Met deze optie zorg je er voor dat jouw agenda direct gedeeld wordt via Facebook. Dit is de pattern ‘Sharing Widged’ (pagina 426)
Agenda’s van vrienden zoeken: 2
Typ naam in...
Waar zijn mijn vrienden nu? 3
3
Typ naam in...
Mijn agenda delen
