Design Patterns

Page 1

AVV 4 Kookwekker App Apple Watch

Naam Omar Vasquez Jesus Studentnummer 500 704 100 Klas DMCI V1-11 Docent H.E.M. van Vugt Vak Design Patterns Opdracht AVV 4 Versie 0.1 Datum 26-9-2015


Inhoudsopgave

Inleiding

Tijd veranderen oplossingen 3 Tijd veranderen gekozen oplossing 4

In dit document zijn voorbeelden en ontwerpen (screenflow) opgenomen met betrekking tot het bedenken en ontwerpen van een kookwekker applicatie voor de Apple Watch. Er zijn drie verschillende userstories gekoppeld aan de ontwerpen zo is elk ontwerp een uitgelicht onderdeel van de gehele App. De ontwerpen voor de applicatie zijn gebaseerd op voorbeelden van mogelijke oplossingen, gekozen oplossing en de human interface guidelines van de Apple Watch.

Tijdsmeting starten oplossingen 5 Tijdsmeting starten gekozen oplossing 6 Signaal ontvangen oplossingen 7 Signaal ontvangen gekozen oplossing 8 Screenflow 9

Legenda 1x tap

Ingedrukt houden

Swipen/sliden naar links (tussen schermen of voor radio buttons)

Swipen/sliden naar rechts (tussen schermen of voor radio buttons)

Draaien naar links of rechts (meestal aan de digital crown van de Apple Watch

Spraakbericht inspreken of beluisteren (meestal voor Siri)

Twee dimensionale haptische terugkoppeling doormiddel van vibraties

Volg de pijltjes voor de juiste volgorde van de verschillende schermen. Van boven naar beneden en van links naar rechts.


De gebruiker wil vanuit de kookwekker App de tijd veranderen, zodat hij de gewenste tijd kan instellen. Oplossingen Probleem omschrijving

De gebruiker wilt met de kookwekker App de tijd kunnen veranderen en instellen om zo de gewenste tijd in te voeren.

Apple Watch - Timer App

Apple Watch - Alarm App

Android Smartphone - Kitchen Timer

Apple Watch Timer App 1.0

Apple Watch Alarm App 1.0 (tijd instellen)

Apple Watch Timer App 1.1

Door de digitale kroon te draaien kan je de tijd instellen. Je kan wisselen tussen een timer die van 0 tot 12 gaat en een timer die van 0 tot 24 uur gaat door zachtjes de scherm aan te raken. AVV4 Kookwekker App Apple Watch

26 september 2015

Met de alarm App kan je door een druk op het scherm de gewenste tijd instellen. Je kan de tijd aanpassen maar op ze manier kan je vaak gebruikte tijden snel gebruiken.

Versie: 0.1

Ontwerper: Omar Vasquez Jesus

Studentnummer: 500 704 100

Android Kicthen Timer App

Kookwekker App voor Android, geeft veel verschillende opties voor het gemakkelijk en overzichtelijk instellen van een tijd voor een timer, de tijden zijn gebaseerd op standaard kook, stoom of grill tijden. 3


De gebruiker wil vanuit de kookwekker App de tijd veranderen, zodat hij de gewenste tijd kan instellen. Gekozen oplossing Gekozen oplossing

Ik heb voor de timer App van de Apple Watch gekozen deze sluit het beste aan bij de probleemstelling en is al een werkende App binnen Apple Watch.

Startscherm App/minuten instellen

1

De oplossing van de alarm app is toch niet handig in verband met dat de gebruiker mogelijk elke keer een andere tijd wilt instellen, en niet met dit scherm wilt beginnen. De oplossing van de smartphone App de kitchen timer heeft wel een aantal functies die in bepaalde gevallen handig zouden kunnen zijn voor de gebruiker. Ze zouden bijvoorbeeld erg van pas komen als Glance voor als je nog 5 min langer kookt etc.

Secondes instellen

Tijd ingesteld klaar voor gebruik

2 8

3

4

5

10

1

Tijd ingesteld op minuten

9 Secondes ingevoerd

Notities

1. Digits voor de minuten van de timer.

6

2. Digits voor de secondes van de timer. 3. Bij het selecteren van een van de digits zal deze een groene omlijning krijgen. 4. Button om de minuten in te stellen. 5. Button om de secondes in te stellen.

7

6. Groene omlijning om de digits van de minuten (selectie) 7. Minuten button kleurt groen als minuten zijn geselecteerd. 8. Groene omlijning om de digits van de secondes (selectie) 9. Secondes button kleurt groen als secondes zijn geselecteerd.

11 AVV4 Kookwekker App Apple Watch

26 september 2015

10. Start/Stop button om de timer te starten of te stoppen. 11. Minuten en Secondes invoeren via de digital crown. Versie: 0.1

Ontwerper: Omar Vasquez Jesus

Studentnummer: 500 704 100

4


De gebruiker wil de tijdsmeting kunnen starten, zodat de ingestelde tijd start vanaf dat moment. Oplossingen Probleem omschrijving

De gebruiker wilt de kookwekker App gelijk kunnen starten vanaf een ingestelde tijd.

Apple Watch - Timer App

Apple Watch - Siri

Android Smartphone - Timer

Apple Watch Siri 1.0

Apple Watch Timer App 1.2

Android Timer App 1.0 Apple Watch Siri 1.1

Na het instellen van de tijd op de timer kan je door op start te drukken de timer starten. AVV4 Kookwekker App Apple Watch

26 september 2015

Doormiddel van Siri is het mogelijk om via spraakberichten bepaalde opties te activeren of voor het bedienen van applicaties dit kan ook gebruikt worden voor andere apps. Versie: 0.1

Ontwerper: Omar Vasquez Jesus

Studentnummer: 500 704 100

Een Timer app die heel eenvoudig maar gebruikersgericht de start en de reset knop sterk naar voren komen. Door op de Start knop te drukken start de Timer per direct. 5


De gebruiker wil de tijdsmeting kunnen starten, zodat de ingestelde tijd start vanaf dat moment. Gekozen oplossing Gekozen oplossing

De workout App heeft een duidelijk zichtbaar en helder start knop dit is natuurlijk wel van belang met een klein device als de Apple Watch. De gebruiker kan bijna foutloos de knop altijd goed drukken.

Tijd is ingesteld

Groot en duidelijke startknop, functionaliteit is hier erg belangrijk.

De tijdsmeting is gestart

Tijdsmeting is actief

4

1

6 Druk op de startknop/digital crown

Popup timer icoontje

Notities

1. De tijd is ingesteld, de Start/Stop button is nu groen. 2. Door op het scherm te drukken kan je de timer starten. 3. Door op de digital crown te drukken kan de timer ook

2

gestart worden. 4. Als de timer gestart is komt er een popup van de timer dit icoontje is een reminder dat je de kookwekker app hebt geactiveerd.

5

3

5. Na het starten van de timer geeft Siri een notificatie dat de Timer gestart is. 6. De Start/Stop knop tekst is geel als er gedrukt is op de knop.

AVV4 Kookwekker App Apple Watch

26 september 2015

Versie: 0.1

Ontwerper: Omar Vasquez Jesus

Studentnummer: 500 704 100

6


De gebruiker wil een signaal ontvangen als de tijd verstreken is, zodat hij weet dat het voedsel naar de volgende stap van bereiding kan. Oplossingen Probleem omschrijving

De gebruiker wilt een signaal ontvangen van de kookwekker App als de ingestelde tijd verstreken is.

Apple Watch App - Glance #1

Apple Watch - Glance #2

Apple Smartphone - Geo locatie

Apple Watch Glance 1.0

Apple Watch Glance 1.2

Google Maps iPhone App 1.0

Apple Watch Glance 1.1

Deze Glance laat de gebruiker korte en directe informatie zien in de vorm van een popup berichtje, dit principe kan ook gebruikt worden voor de kookwekker App. AVV4 Kookwekker App Apple Watch

26 september 2015

Een popup bericht die korte en gevatte informatie geeft over het desbetreffende onderwerp/App. In dit geval zou je verdere kookinstructies kunnen toevoegen aan de kookwekker App.

Versie: 0.1

Ontwerper: Omar Vasquez Jesus

Studentnummer: 500 704 100

Geo locatie popup die de gebruiker snel iets laat weten wat van belang is. Door op een van de knoppen te drukken gaat de gebruiker meestal akkoord met de voorwaarden/optie 7


De gebruiker wil een signaal ontvangen als de tijd verstreken is, zodat hij weet dat het voedsel naar de volgende stap van bereiding kan. Gekozen oplossing Gekozen oplossing

Glance nummer 1 is veruit de best gekozen variant om verschillenden redenen, ten eerste kan het doormiddel van popup de gebruiker per direct weten dat de tijd om is, en geeft het de optie om de app per direct te sluiten vanaf dezelfde glance.

De keus is gevallen op de Glance nummer 1.

Kookwekker glance (info bericht)

1

Haptische terugkoppeling (vibratie)

2

3

Kookwekker App - Apple Watch

7

4

Kookwekker app via glance gesloten

Kookwekker app via glance gesloten 1. Icoon van de kookwekker app. 2. De huidige tijd indicatie.

5

3. Kort en bondige bericht met relevante info over de app. 4. Sluit de kookwekker app door op sluit te drukken. 5. Na het stoppen van de kookwekker verschijnt dit popup bericht. 6. De kookwekker kan ook gesloten worden door de kroonwiel ingedrukt te houden wanneer de glance verschijnt. 7. Door twee dimensionale haptische terugkoppeling krijgt

6

de gebruiker niet alleen via de glance maar ook via vibraties te voelen dat de tijd van de timer is verstreken.

AVV4 Kookwekker App Apple Watch

26 september 2015

Versie: 0.1

Ontwerper: Omar Vasquez Jesus

Studentnummer: 500 704 100

8


Screenflow 1. Tijd instellen

2. Tijd starten

3. Signaal verstreken tijd

1a. Tap 1x op de min button of de sec button om de tijd in te stellen.

2a. Druk op Start om de kookwekker te starten kan ook met wiel.

3a. Vibratie als de tijd verstreken is, druk op sluit om de app te sluiten kan ook met kroonwiel.

AVV4 Kookwekker App Apple Watch

26 september 2015

Versie: 0.1

Ontwerper: Omar Vasquez Jesus

Studentnummer: 500 704 100

9


Naam Omar Vasquez Jesus Studentnummer 500 704 100 Klas DMCI V1-11 Docent H.E.M. van Vugt Vak Design Patterns Opdracht AVV 4 Versie 0.1 Datum 26-9-2015


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.