Definitief Prototype

Link naar werkend definitief Prototype V5: https://xd.adobe.com/view/7dde3c5e-cf97-4edf-813d-a5d44fcbb6d2-288d/?hints=off

Onderstaand heb ik alle belangrijke schermen van mijn app per onderdeel uitgelicht, op volgorde, en onderbouwd waar nodig. Dit zijn schermen uit de laatste versie, deze kunnen dus ook worden bekeken via de link naar het werkende prototype of in de schermopname van het prototype.

Loading screen

• Om gebruikers kennis te laten maken met het logo, de naam en de look en feel van de app;

• Het Henkel logo voor het wekken van vertrouwen. (Product Quality Review);

• De eerste micro animatie om voor engagement te zorgen. (Costa, 2020);

• Om het zo echt mogelijk te maken en het idee te geven dat er een gave nieuwe app aan het laden is voor het eerste gebruik.

Onboarding

• Om de gebruiker te laten weten waar de app voor bedoeld is en wat deze te bieden heeft: verwachtingsmanagement.

• Zit hier omdat de gebruiker nu nog kan kiezen of de app wel voldoende bij hem/haar past om een account aan te maken. Mocht dit namelijk onverhoopt niet zo zijn dan heeft iemand al een account wat ie weer moet verwijderen.

Sign-up / Login

• Dit kan met bestaande Ask Team Clean credentials. Nieuwe accounts zijn automatisch ook Ask Team Clean accounts, mensen die een nieuw account aanmaken ontvangen hier netjes een email over met bevestiging en uitleg (buiten de app).

• Kan ook met Facebook en Google, dit is gebruikelijk en bespaard de gebruiker tijd.

Cleaning Schedule Generator

De Cleaning Schedule Generator is een groot onderdeel van de app, maar dit wordt maar één keer doorlopen door de hoofdgebruiker van een schoonmaak team (een huishouden). De gegevens die hier worden ingevuld kunnen later in de app worden aangepast via het account van de hoofdgebruiker. Andere gebruikers kunnen dit ook inzien en een wijzigingsvoorstel sturen naar de hoofd- en eventuele andere gebruikers.

Team

De eerste stap in de generator is het samen stellen van een team. De hoofdgebruiker nodigt diens huisgenoten uit door voor hen een naam, profielicoon en email adres in te vullen. De uitgenodigde huisgenoten ontvangen een email met een deeplink (Google Ads Help, z.d.) waarin zij direct hun account kunnen verifiëren en in het juiste team in de app terecht komen.

De kleuren achter het icoon van gebruikers staat vast. De eerste gebruiker heeft altijd een blauwe achtergrond, dit omdat dit goed bij de stijl van Team Clean past.

De tweede gebruiker krijgt een roze achtergrond, de derde een gele en de vierde een paarse. De reden hiervoor is dat in de Proof of Concept en later ook uit diverse Prototype Tests naar voren kwam dat de kleuren onderscheidender zijn dan de iconen. De kleuren worden in de app gebruikt om het verschil tussen gebruikers aan te geven, nooit zonder icoon, maar het icoon heeft dus minder focus dan de kleur, aldus de doelgroep.

Om te voorkomen dat de app volledig onbruikbaar wordt voor kleurenblinden. Daarom heb ik meteen bij de eerste versie al onderzoek gedaan naar gepaste combinaties, en mij tegelijkertijd zoveel mogelijk aan de bestaande Team Clean stijl gehouden.

Rooms

Om de taken die in het schema worden geplaatst, aan te laten sluiten op de woonsituatie van de gebruiker, wordt hen gevraagd aan te geven hoeveel- en wat voor soort kamers er in hun woning zijn. Als een gebruiker bijvoorbeeld aangeeft dat er één slaapkamer is, maar er zijn twee bewoners, dan kunnen slaapkamertaken worden verdeeld in plaats van dat deze dubbel op het schema komen te staan. En is het niet aan de orde om het balkon schoon te maken als er helemaal balkon is, bijvoorbeeld.

Gebruikers krijgen hier niet de ruimte om zelf kamers toe te voegen die zij eventueel missen, omdat het schema voor hen gegenereerd kan worden vanuit een database met alle mogelijke taken die allemaal een bepaald (vast) aantal munten waard zijn.

Een USP van de app is dat deze het schema genereert zonder dat de gebruiker hier zelf al teveel over hoeft na te denken of kennis hoeft te hebben van schoonmaken; En een belangrijk element is het verdienen van munten voor het opbouwen van een routine, die vervolgens kunnen worden ingewisseld voor echte producten. Dit is fraudegevoelig, en om dit te beperken kunnen gebruikers taken zelf niet wijzigen.

Scheduled days

Uit o.a. interviews met de doelgroep heb ik gehaald dat het best goed mogelijk is dat iemand op bepaalde dagen niet thuis komt. Zo kan een student of starter bij een partner slapen, of regelmatig een weekend naar familie zijn. Daarom is het mogelijk om vaste dagen uit te sluiten (maximaal drie), waarop de gebruiker geen huishoudelijke taken op diens rooster krijgt, en verderop in de app is het ook mogelijk om taken tot 24 uur uit te stellen.

De reden achter het maximaal uitsluiten van 3 dagen en het maximaal uitstellen van een taak voor 24 uur, is dat de app gemaakt is voor mensen die graag een schoonmaak routine willen opbouwen en een standaard schonere leefomgeving voor zichzelf willen creëren. Wanneer alle taken een week blijven liggen en bijvoorbeeld allemaal op één dag worden uitgevoerd, worden deze doelen niet behaald en zou de app dus het probleem van gebruikers niet oplossen.

Level of cleanliness

Tenslotte zijn er gradaties in hoe schoon app gebruikers hun huis willen hebben. Dit heb ik vertaald naar Casual, Super en Extreme. Wanneer de gebruiker voor Casual kiest verschijnen er minder schoonmaak taken in het schema dan wanneer de gebruiker voor Extreme kiest, en vanzelfsprekend kan een team dat een Extremely Clean huis wil ook binnen een kortere periode meer munten verdienen.

Loading screen

Dit loading screen zit hier om de app realistischer te laten lijken en de gebruiker even een pauze te bieden tussen het invullen van informatie en het terugkrijgen van iets vanuit de app. Ik had het rad heel graag willen animeren zodat deze ook ronddraaide, maar ik heb dit element een beetje onhandig gedesigned en dit animeren lukt niet zonder hier onwijs veel tijd in te steken, wat ik liever in functionaliteiten stopte.

First Time Use Tutorial

Omdat de app ontzettend uitgebreid is en veel gebruik maakt van micro interacties en verschillende vormen van interactie (dit is een van de randvoorwaarden aan de opdracht) heb ik een first time use tutorial ingevoegd. Dit is een veelgebruikte oplossing om te voorkomen dat een gebruiker niet snel genoeg leert omgaan met een digitaal product en daardoor afhaakt. (Coyle, 2018)

De tutorial werd ingevoerd na Versie 2 omdat bij het testen van Versie 2 naar voren kwam dat bepaalde gestures niet voor zich spreken en bepaalde functionaliteiten onbekeken bleven. De tutorial heeft verschillende iteraties gezien nadat deze in het leven is geroepen in Versie 2.5, zo begon het als een beknopte video met een achtergrond overlay, vervolgens werd dit na testen en itereren een blurred achtergrond en tenslotte werden er knoppen aan de tutorial toegevoegd om de gebruiker meer controle te geven over hoe snel deze de uitleg bekijkt en begrijpt.

Een schermopname van het doorlopen van de tutorial video:

Home

De home van de app is een hub waarop gebruikers hun schoonmaak taken en die van huisgenoten kunnen bekijken en afvinken, het belangrijkste scherm in de app. Boven de taken heb ik speelse card components geplaatst, deze geven een belangrijke en leuke indicatie van het proces van de gebruiker en dienen als call to action naar de andere pagina's naast home.

App navigatie

Op iedere pagina is het tweedelige app menu hetzelfde. Bovenin ieder scherm bevindt zich een header met daarop de Ask Team Clean knop en de knop naar het account van de gebruiker. Onderin ieder scherm bevindt zich de bottom bar navigation, wat gebruikelijk is voor apps. De knoppen hierin zijn outlined, maar vullen op met een donkerdere kleur wanneer ze zijn aanklikt. Echter, om de 'home' in de navigatie bar zit een blauwe bubbel. Dit is om aan te geven dat de homepagina een hub is waarop alles samenkomt en ook dat dit de belangrijkste pagina in de app is. De blauwe bubbel is onderdeel van de Team Clean huisstijl: mijn eigen doorvertaling van de stijl van het Ask Team Clean platform, voor sisterbrand Team Clean Routine.

Takenoverzicht opties

Op de home kunnen gebruikers hun eigen taken voor vandaag en morgen vinden. Dit is niet voor een hele week omdat o.a. uit interviews met de doelgroep naar voren kwam dat een lange lijst met to-do's demotiverend kan zijn, en ook omdat het opbouwen van routine inhoud dat taken om de zoveel tijd herhaald worden, alles alvast op één dag doen is dus niet de bedoeling.

• Gebruikers kunnen filteren op alleen hun eigen taken, maar ook een overzicht van de taken van hun huisgenoten. Zo kunnen ze zien of er misschien een klus die dringend gedaan moet worden, niet wordt uitgesteld door een huisgenoot, en ook zien welke huisgenoot de taak te doen heeft.

• Taken kunnen worden afgevinkt met een swipe gesture. Dit is een veelvoorkomend design pattern, en wordt kenbaar gemaakt aan gebruikers in de first-time use tutorial. Verplaatsen naar de volgende dag kan door te drag-en-droppen, wederom een veelvoorkomend pattern (zoals bijvoorbeeld in de meeste agenda applicaties) die kenbaar wordt gemaakt in de tutorial.

• Verplaatsen van morgen naar vandaag is ook mogelijk, flexibiliteit is iets wat de doelgroep graag wil, en in deze beperkte mate is het nog niet te veel in strijd met de essentie van de app: het opbouwen van de schoonmaak routine.

Steals

Als een gebruiker zijn/haar taken niet binnen 24 uur voldoet of verplaatst naar de volgende 24 uur (dit kan eenmalig), verplaatst deze zich automatisch naar de 'steals' sectie. Andere gebruikers kunnen deze taak dan stelen en daarmee dus ook de muntjes die met deze taak kunnen worden verdient. Zo wordt extra werk beloond, en kan worden voorkomen dat taken blijven liggen en het huis vies blijft.

Gebruikers kunnen in hun account de notificaties die zij ontvangen van de app personaliseren, en hier ook aangeven bijvoorbeeld meldingen te willen ontvangen wanneer er steals beschikbaar zijn.

Taak detailpagina's

Taken kunnen worden uitgeklapt door erop te klikken, dit wordt aangegeven met de pijltjes op de card components die ik heb gebruikt om de takenkaartjes mee vorm te geven. Taak detailpagina's zijn ontzettend belangrijk in de app, deze geven gehoor aan de eisen van bestaande Ask Team Clean gebruikers om voorgestelde producten bij informatie van Team Clean te ontvangen; en aan de wensen en eisen van de focus doelgroep om uitleg bij taken te krijgen en eigen aantekeningen bij taken met huisgenoten te delen.

Een extra toevoeging hieraan komt uit de Product Quality Review: een knop die vanuit de app naar het Ask Team Clean live platform linkt waar de gebruiker nog meer informatie over de specifieke taak kan vinden. Voor nu is dit een pagina met gerelateerde artikelen, maar in de toekomst wordt dit een op maat gemaakte landingspagina voor de taak (ook ter sprake gekomen in Product Quality Review).

Score

Op de score pagina kunnen gebruikers in verschillende overzichten bekijken hoeveel munten zij al hebben verdient en in welke periode zij bijvoorbeeld niet zo goed hebben gepresteerd en in welke periodes wel. Onder de score overzichten zijn ook nog achievements te vinden die gebruikers kunnen unlocken door de bijbehorende challenges te voldoen.

Score overzicht opties

In gesprekken en tests met de doelgroep kwam naar voren dat het vergelijken van scores met huisgenoten een gevoel van competitie geeft en een motiverende werking heeft.

• Om de progressie van gebruikers zo overzichtelijk mogelijk te maken heb ik een weekoverzicht toegevoegd waarin gebruikers kunnen zien hoeveel munten zij die week maximaal kunnen verdienen en hoeveel zij er al hebben verdient. Ze kunnen dit ook van hun medebewoners bekijken.

• Vervolgens is er een maandoverzicht in vorm van een cirkeldiagram die in een oogopslag duidelijk maakt wie er het hardst heeft schoongemaakt in huis.

• Tenslotte is er een jaar chart die weergeeft in welke periode iedere gebruiker minder goed of juist beter heeft gepresteerd. Hier is ook nog de mogelijkheid om de vergelijking met medebewoners uit te zetten en enkel eigen progressie te bekijken.

Deze statistieken kennen meerdere iteratieslagen en zijn aan de hand van input van de doelgroep zo vormgegeven en filterbaar als ze zijn.

Achievements

Achievements zijn een vorm van gamification, welke ik heb toegevoegd om gebruikers zelf extra uitdaging op te laten zoeken en 'goed gedrag' te belonen. Een voorbeeld van zo'n achievement is een streak opbouwen voor een week voor 5 extra muntjes, dit kan oplopen tot een jaar voor 500 munten. Een ander voorbeeld is de Early Bird badge die kan worden verdient door schoonmaak taken te voldoen voordat de app een reminder heeft verstuurd. Dit activeert de gebruiker om actief zelf aan zijn/haar schoonmaak routine te werken. Door de verschillende levels in achievements worden gebruikers aangemoedigd om de app langdurig en actief te blijven gebruiken.

Shop

De shop pagina geeft weer hoeveel munten een gebruiker heeft, gevolgd door een paar uitgelichte speciale items die de gebruiker kan kopen met zijn/haar verdiende munten, en vervolgens het standaard aanbod aan producten. De uitgelichte speciale items zijn op dit moment enkel 'Moments Boxen', dit is een van de voorgestelde innovatie features voorafgaand aan dit project vanuit Wayne Parker Kent aan Henkel, welke ook positief uit het marktonderzoek is gekomen.

Uit een laatste user test kwam de suggestie om favorieten toe te voegen. Dit heb ik nu niet toegepast in verband met tijd, maar ook omdat het aanbod nog klein is. In het adviesrapport neem ik mee dat dit een leuke uitbreiding zou zijn en gebruikers in gelegenheid stelt om bijvoorbeeld spaardoelen voor zichzelf op te stellen.

Shop overzicht opties

In de shop kan worden gefilterd op het aantal punten, dit heb ik uit Design Patterns gehaald, zoals bijvoorbeeld de T-Mobile shop. Ik heb hiervoor gekozen omdat er geen tientallen producten in de shop zullen staan in eerste instantie. Wanneer het aanbod wordt uitgebreid kunnen ook filter en sorteer opties worden uitgebreid met categorieën, en zoeken per kamer/taak bijvoorbeeld.

Shop item detailpagina's

Items in de shop, zowel Moments Boxen als de reguliere items, hebben een detailpagina waarop kort wordt uitgelegd wat het item is en waarvoor het gebruikt kan worden. Op dit scherm zit één prominente knop (Babich, 2020) waarmee het item aangekocht kan worden, de knop is tevens een progressbar die aangeeft of iemand al voldoende punten heeft om een item te kopen of niet. Middels een minder aanwezige terugknop op de gangbare plek linksboven kan de gebruiker natuurlijk wel terug naar de shop.

Shop order bevestiging

Wanneer een gebruiker zijn/haar munten inwisselt voor een product belandt hij/zij op een succespagina in de app. Hierop wordt weergeven wat de vervolgstappen zijn: de gebruiker ontvangt een voucher voor het verkozen product via het e-mailadres dat is gekoppeld aan zijn/haar account. Om deze reden gaat het toevoegen van huisgenoten in het eerste gebruik ook per email en niet per bijvoorbeeld sms. Mocht het zo zijn dat een gebruiker de email misloopt of dat het verkeerde mailadres is gekoppeld aan zijn/haar account, dan kan de gebruiker via de account pagina zijn/haar order history bekijken en hier via een contactoptie zijn/haar probleem oplossen. Dit scherm heb ik in verband met tijd niet uitgewerkt.

Ask Team Clean

Ask Team Clean begon als het platform dat ik zou innoveren, maar al snel werd duidelijk dat ik het platform ging verrijken met een externe oplossing omdat de doelgroep hier meer behoefte aan heeft. Het is echter wel zo gebleven dat mijn Team Clean Routine app moet bijdragen aan traffic en aantal gebruikers op Ask Team Clean. Doordat accounts van nieuwe app gebruikers automatisch ook Ask Team Clean accounts worden heb ik geprobeerd dit te starten, maar het echte kennismaken met het Ask Team Clean platform moet natuurlijk verlopen in de app.

Direct gerichte informatie zoeken (via ATC knop)

In de top banner op iedere pagina is de Ask Team Clean button te vinden. Deze wordt ook genoemd in de onboarding als source om informatie over schoonmaken te vinden, en komt nog een keer terug in de tutorial video. Via de knop komen gebruikers terecht op het live platform binnen een in-app browser. Dit is een simpele en gebruikelijke oplossing, waarvoor ik heb gekozen om aan de vraag van de opdrachtgever om de oplossing gemakkelijk toepasbaar te houden, te voldoen.

Op de homepage van het platform vinden gebruikers direct een search bar waar zij hun vragen kunnen intypen, de 'Ask' Team Clean knop voldoet zo aan de verwachting van de gebruiker dat er vragen kunnen worden gesteld en antwoorden kunnen worden gevonden.

Direct relevante informatie vinden (via detailpagina's)

Op taak detailpagina's staat ook een knop vlak onder de uitleg bij de taak, met daarop 'See related articles'. Deze knop linkt naar een resultatenpagina op het live platform met daarop artikelen die passen bij een steekwoord dat gekoppeld is aan de taak. Ook dit is een tijdelijke oplossing om tijd te besparen, want in de Product Quality Review is kort besproken dat er een landingspagina kan worden gebouwd op Ask Team Clean platform voor iedere taak in de Team Clean Routine app waar deze knop na verloop van tijd naartoe kan linken, om gebruikers zo nog meer tegemoet te komen.

Ondanks dat dit alles zich buiten de app bevindt, heb ik dit wel meegenomen om mijn prototype om de ervaring zo compleet mogelijk te maken.

Account

De knop naar de account pagina zit rechtsboven in de top banner. Dit is een gebruikelijke plek voor een account knop of een instellingen knop. In dit geval zitten de instellingen voor de app in het account van de gebruiker, ook iets wat voor gebruikers voor zich spreekt, zo kwam uit meerdere user tests en ook de validatie van peers op het eindproduct. Op deze pagina kunnen gebruikers hun profiel icoon aanpassen evenals hun account gegevens, maar ook kunnen er notificatie personalisaties worden gedaan en kan het gegenereerde schoonmaak schema worden aangepast.

Manage profile

Via 'manage profile' passen gebruikers hun account gegevens aan, zoals naam, email adres en wachtwoord. Ook vinden gebruikers hier hun order history, waarin zij kunnen terugvinden welke producten ze hebben gekocht met hun verdiende munten. En tenslotte de chore history, waarin gebruikers de door hen voldane taken kunnen terugvinden en eventueel kunnen terugzetten wanneer deze perongeluk zijn afgevinkt. Dit wordt ook uitgelegd in de tutorial video.

Notifications

Al vroeg in mijn onderzoek werd duidelijk dat het ontvangen van reminders over huishoudelijke taken een cruciaal onderdeel van mijn oplossing zou zijn. Dit heeft er zelfs toe geleid dat ik geen oplossing meer ging ontwerpen voor op het live platform van Ask Team Clean, maar overstapte naar een complementaire app na overleg met belanghebber en opdrachtgever.

Gebruikers kunnen zelf instellen op welke dagen en tijdstippen zij reminders ontvangen over hun schoonmaak taken. Daarnaast is het ook mogelijk om notificaties aan te zetten voor nieuwe producten in de shop, voor het behalen van achievements en voor een maandelijks of wekelijks overzicht van wie er het hardst heeft gepoetst in het huishouden.

Ik heb deze schermen zo ver mogelijk uitgewerkt maar heb dit niet zo uitgebreid werkend kunnen maken als de rest van de app in verband met tijd.

Schedule

Ook het gegenereerde schoonmaak schema van de gebruiker moet natuurlijk kunnen worden aangepast. Wanneer gebruikers bijvoorbeeld hebben gekozen voor een Casually Clean schema maar merken dat zij het huis zo nog niet schoon genoeg vinden, kunnen zij dit aanpassen en zo hun schema uitbreiden. Wanneer een gebruiker dit aanpast krijgen andere gebruikers hier een melding voor.

Omdat pas in de laatste test werd genoemd dat goedkeuring van medegebruikers hierin wel gepast was en ik hier zelf eigenlijk niet zo bij stil had gestaan, heb ik deze melding nog niet uit kunnen werken. De instellingen zelf zijn wel aanwezig en klikbaar in het prototype.

Legal

Omdat het gebruikelijk is dat er in de instellingen van iedere app of platform een paar documenten te vinden zijn heb ik ook Terms of Use toegevoegd en deze gelinkt aan de Terms of Use die ook gebruikt worden voor het Ask Team Clean platform. De gebruikelijke Privacy Policy staat er ook in. Als de app straks daadwerkelijk ontwikkeld wordt verwacht ik dat Henkel hier zelf documenten voor zal opstellen dus het leek mij niet nodig om hier verder in te duiken.

Notes:

Dit is er nieuw: - Usability Improvements. Swipen nog niet getackeld maar blijft een prototype, gewoon geduldig mee om gaan is een groot ding en internetsnelheid speelt een rol in soepelheid en duur van animaties en switches. - Meer detailpagina's voor shop items en voor alle moments boxen, ook bestelbevestiging pagina. - Account settings volledig uitgewerkt. Vooral belangrijk om notificaties volledig te kunnen personaliseren, niet alleen de reminders zoals in V4. Alle iconen kunnen nu ook worden aangeklikt (vertaald niet door naar hele app ivm tijd).