Design

Binnen het design proces is er veel ontworpen op verschillende vlakken. Zo is de UI/UX ontworpen en zijn de spelelementen met de animaties gemaakt. 

UI/UX

Mid fidelity

De applicatie wordt een verticale app en zal ook niet kunnen draaien naar een horizontale stand. Dit is gedaan omdat de camera wordt gebruikt, en veel personen houden de telefoon zo vast dat de handen voor de camera zitten. Daarnaast is er ook rekening gehouden met de camera aan de voorkant, aangezien deze bovenaan in het midden zit. Hierdoor is het een onderdeel van het scherm geworden, waar niks geplaatst kan worden.

Er missen verder nog een aantal aspecten. Zo was er geen rekening gehouden met een Game Over scherm en een uitlegscherm hoe de AR werkt. Verder is het ook niet technisch haalbaar om van de load game een aparte pagina te maken. De button start dus meteen de game die opgeslagen is en gaat niet naar een apart scherm. 

High fidelity

Vanuit de mid fidelity is er gewerkt aan het design. Zo zijn de knoppen en de achtergrond gemaakt. Verder zijn ook de elementen voor het spel zelf gemaakt, zoals de leeftijdsbalk en de munten.  Verder is er ook een Game Over scherm toegevoegd en een pop-up die vraagt of je de game wilt opslaan wanneer je het spel afsluit. 

Wel moet er nog een scherm komen voor de uitleg van het spel zelf. Deze zal meteen geopend worden na het starten van het spel. Daarnaast is er bij het scherm van de elementen ook een extra functie gemaakt waarbij er makkelijker naar het andere evenwicht element gegaan kan worden, door op de afbeelding te drukken. 

Spel elementen

Privacy

Voor het element privacy is gekozen voor een hangslot. Online veiligheid wordt vaak aangeduid door een hangslot of een schild. Zo wordt er een hangslot gebruikt in de adresbalk voor een SSL certificaat, waarmee aangegeven wordt dat de persoonlijke gegevens beschermd worden. Aangezien een hangslot beter bij het element van aandachtseconomie past, is hiervoor gekozen.

Aandachtseconomie

Het element voor een aandachtseconomie is gemaakt als een notificatie die een persoon op zijn/haar telefoon ontvangt. Binnen een aandachtseconomie draait het om het verkrijgen en behouden van de aandacht. Wanneer iemand een notificatie binnenkrijgt op zijn/haar telefoon, dan gaat meestal de gehele aandacht naar dat bericht.

levensstijl2D

Gezondere levensstijl

Een gezondere levensstijl gaat vaak samen met gezond eten en sporten. Er is uiteindelijk gekozen voor het onderwerp sporten, aangezien er bij eten ook gedacht kan worden aan te veel eten, wat juist meer bij welvaartziektes hoort. 

Welvaartsziektes

Welvaartsziektes gaan voornamelijk over medische aandoeningen die veroorzaakt worden door slecht/veel eten en te weinig beweging. Aangezien het om medische aandoeningen gaat is er gekozen voor een medicijn, aangezien er geprobeerd wordt de welvaartsziektes met medicijnen en andere middelen op te lossen, in plaats van het te voorkomen. 

Serious games

Dit was een van de moeilijkste elementen om uit te beelden. Vooral omdat voor een gameverslaving al een controller wordt gebruikt en dat niet ook voor serious games gebruikt kan worden. Er is uiteindelijk gekozen voor een award. Zo zijn de meeste serious games gemaakt met een award systeem, waardoor het motiverend is om te gebruiken.

 

Gameverslaving

Voor een gameverslaving is gekozen voor een game controller, aangezien het meteen duidelijk is dat het gaat om games. Als er gekozen was voor een telefoon of computer, dan had dat ook veel andere betekenissen kunnen hebben. Dit is weliswaar een oude game controller, maar ook een simpele variant, om het dichter bij de andere elementen te houden. 

Arm & Rijk

Uit het onderzoek is gebleken dat vooral het verschil in vermogen de grootste factor is in de ongelijkheid tussen arm en rijk. Spaargeld is een vorm van vermogen. De meeste personen denken wanneer ze een spaarvarken zien aan spaargeld, waardoor er hiervoor gekozen is.

horizontalisering42D

Horizontalisering

Bij horizontalisering gaat het om gelijkheid in de samenleving. Er is gebruik gemaakt van een weegschaal, omdat deze staat voor balans. Wanneer er meer gelijkheid is, is er eigenlijk ook meer balans. Een weegschaal staat niet alleen voor balans, maar ook voor afwegingen maken en innerlijke balans.

 

elementen-54

Elementen in het spel – UI

Naast het plaatsen van de elementen in het spel, worden ze ook gebruikt in de UI. Zo heeft elk element een eigen scherm, waar de elementen op een vlak getoond worden. Hierdoor wordt het visueel duidelijk welk scherm bij welk element hoort. De elementen zijn hetzelfde als de elementen in de wereld zelf, maar bij de elementen van privacy en aandachtseconomie zijn de gaten vervangen door illustraties. 

Typografie & Kleuren

titelsapp-53

Titels

De titels binnen de app bestaan uit het lettertype Candara regular. Om dit lettertype rondere hoeken te geven is er met offset path gewerkt. Dit om het lettertype wat meer karakter te geven, zodat het meer lijkt op een spel lettertype.

Tekst

De rest van de tekst binnen de app is of Lato regular, Lato bold of Arial. Voor de kleinere teksten is Arial gebruikt, omdat dit een wat breder font is waardoor het beter leesbaar is. 

Kleuren

De kleuren die gekozen zijn, zijn lichte kleuren, maar met een hoog contrast. Veel spellen zijn erg kleurrijk, dit was iets wat ook in dit spel belangrijk was. De geel en bruin tinten zijn gebruikt voor de buttons in het spel. De blauwe kleuren zijn gebruikt voor de achtergronden en de groene kleuren voor de grote titels. De rode kleuren zijn alleen gebruikt voor de levens. 

kleuren-51

Animaties

Bij elk spelelement is een animatie gemaakt. Het originele idee was om de camera een animatie te laten instantiëren. Dit betekent dat wanneer het element midden op het scherm staat, dat dan de animatie in een loop afgespeeld zou worden en pas stopt wanneer het niet meer in het midden staat. Dit idee is later weggelaten, aangezien het technisch niet mogelijk was. De animaties zijn dus ook niet gebruikt.

Privacy

Serious gaming

Aandachtseconomie

Gameverslaving

Arm en rijk

Welvaartsziektes

Horizontalisering

Gezondere levensstijl

Wereld

De wereld

In eerste instantie was de wereld gemaakt als een soort floating island, maar door de AR positie was de onderkant vaak niet te zien en leek het raar. Hierdoor is gekozen voor een disc, waarbij er delen zoals de rivier en de wegen afgesneden worden. 

Verder zijn er vele andere elementen gemaakt. De grote thema’s binnen de wereld zijn: een stad, een park, een boerderij, een bos en een dorp. Hiervoor zijn de bijbehorende elementen gemaakt. De stijl is niet geheel low poly, maar er is wel gelet op het gebruik van polygons, aangezien dit meer geheugen inneemt. 

Overige elementen

Naast alle voorgaande elementen die gemaakt moesten worden, zijn er ook nog andere elementen die niet bij een van de bovenstaande categorieën horen. 

Indicator

De indicator is gebruikt om aan te geven wanneer de camera een oppervlakte herkent. Deze wordt dan getoond en beweegt ook mee met de bewegingen van de telefoon. De indicator verdwijnt weer wanneer de wereld geplaatst is. 

Aangezien deze indicator zichtbaar is op verschillende kleuren, moet het goed opvallen. Vandaar dat gekozen is voor de m van Mixtopia. Hieromheen staat een cirkel, met een glow, zodat het een groter contrast heeft met de achtergrond.