emmavdboom

[emmavdboom]

Dit is mijn definitieve animatie.

https://mymedia.avans.nl/media/Definitieve+animatie/1_cebt0fau

Bron home icon:  Snip Master, https://icon-icons.com/nl/pictogram/home-mono/105947, geraadpleegd op 22 maart.

[emmavdboom]

Dit is de animatie met de aangepaste pijl. Ook ben ik erachter gekomen dat op de laatste pagina er ook een home knop moet zijn, dus hier ga ik mee verder.

[emmavdboom]

Dit is de animatie geworden. De feedback die ik hierop kreeg was dat ik de pijl kleiner moest maken en dat er iets met de pijl moest gebeuren zodat het duidelijk is dat er geklikt is met de pijl. Hier ga ik een nieuwe animatie voor maken.

[emmavdboom]

Na ook het menu en de laatste pagina met de informatie, in de stijl van de pagina van de longen met keuze, zijn dit de uiteindelijke pagina’s geworden. 

[emmavdboom]

Ik was toch nog niet helemaal tevreden over de kleur. Daarom ben ik hiermee verder gegaan, want de paarse achtergrond paste er niet helemaal bij. Ook heb ik de pijl voor terug gaan een drop shadow gegeven zodat dit overeen komt met de andere knoppen. De afbeelding van de longen in de navigatie balk was eigenlijk ook overbodig en niet heel mooi, dus deze heb ik weggelaten. Aan de hand van de Instagram pagina van colours.cafe ben ik gaan kijken naar de kleuren combinaties. Uiteindelijk heb ik aan verschillende mensen gevraagd welke hun het beste vonden en zelf vond ik de derde variatie (blauw) het beste en de ondervraagde vonden dit ook. 

[emmavdboom]

Aan de hand van de feedback ben ik ook gaan kijken naar de typografie. Na feedback te hebben gevraagd aan andere heb ik gekozen om de typografie van foto 1 te kiezen. Deze typografie past goed in de stijl door de dunne en ronde lijnen.

Om duidelijk te maken dat je op de illustraties kan klikken heb ik er een kader om heen gemaakt als aanduiding dat je op die opties kan klikken.

[emmavdboom]

Voor de navigatie voor de pagina met de informatie over de categorie die je gekozen hebt heb ik 2 versies gemaakt. Uiteindelijk heb ik voor versie 2 gekozen omdat dit het meest voorkomt en het duidelijkste overkomt volgens personen waar ik het aan gevraagd heb. 

[emmavdboom]

Na aanleiding van de feedback over navigatie ben ik daarmee aan de slag gegaan. Ook heb ik de laatste symbolen afgemaakt. Voor de navigatie ben ik gaan kijken voor de kleuren van de navigatie balk. Uiteindelijk heb ik voor de laatste kleur (geel) gekozen omdat dit niet te druk overkwam, voor jongens en meisjes geschikt is en deze kleur ook weer terug komt in het symbool voor astma.

Bronnen:

- Cystic fibrosis: https://www.google.com/search?q=cystic+fibrosis+illustration&tbm=isch&ved=2ahUKEwjt2Lv4j6LoAhWYu6QKHUTjAbUQ2-cCegQIABAA&oq=Cystic+fibrosis+ill&gs_l=img.1.0.0i19j0i8i30i19l2.22104.22715..24150...0.0..0.69.253.4......0....1..gw s-wiz-img.......35i39j0j0i30._xvHyXX8X4g&ei=BhVxXu29EJj3kgXExoeoCw&bih=754&biw=1536&safe=strict#imgrc=_KD5jg 2GJTQsnM&imgdii=h3FNLfYrvw2CeM, geraadpleegd op 17 maart.

- Longkanker:  Scio21, https://www.istockphoto.com/nl/vector/illustratie-van-longkanker-gm1053085436-281347041, geraadpleegd op 17 maart.

[emmavdboom]

Feedback

Na het inleveren van versie 2 ga ik verder met de feedback over kleur en  hiërarchie.

- Navigatie duidelijker maken.

- Pijl vorm en kleur aanpassen.

[emmavdboom]

Hier heb ik de start knop kleiner gemaakt en de laatste pagina met grootte goed aangepast.

[emmavdboom]

Om kinderen op een gemak te stellen tijdens het ziekenhuis bezoek heb ik gekozen om te kijken hoe een vrolijk rustig achtergrond muziek erbij zou zijn. Ook heb ik het tweede click geluidje er even opnieuw ingezet omdat het klonk als of het een ander geluid was dan de rest van de click geluiden. Nu klopt dit wel.

Bron achtergrond muziek: https://freesound.org/people/reasanka/sounds/383023/, reasanka , geraadpleegd op 4 februari 2020

[emmavdboom]

Uiteindelijk heb ik alle schermen in een animatie gezet met de juiste guide character. Aan de soepelheid en de indeling van de schermen zelf wil ik na aanleiding van feedback verder mee gaan.

[emmavdboom]

Dit zijn alle schermen tot nu toe. Met het openingsscherm en hoofdmenu ben ik tevreden. Hoe ik de keuze menu pagina precies wil hebben ben ik nog niet uit. Ook de informatie pagina kan overzichtelijker, maar hoe ik dit wil hebben ben ik ook nog niet over uit.

Bron bronchitis: geraadpleegd op 2 maart 2020, www.depositphotos.com

Bron longontsteking:  geraadpleegd op 2 maart 2020, https://nl.123rf.com/photo_45688680_longontsteking-de-anatomische-structuur-van-de-menselijke-long-vector-illustratie-op-ge%C3%AFsoleerde-achte.html

Bron informatie bronchitis: geraadpleegd op 2 maart 2020, https://www.longfonds.nl/acute-bronchitis/symptomen-acute-bronchitis?gclid=CjwKCAiA-vLyBRBWEiwAzOkGVGNDp7GWu5lu1KT-TJcoqsLG6zDj4B3EASYIniwmwatxj-fx74FchhoCqJoQAvD_BwE

[emmavdboom]

Na aanleiding van de feedback dat de guide character hedendaagser moest en niet te meisjes achtig ben ik verder gegaan. Uiteindelijk heb ik mijn vriendin gevraagd of ik haar als guide character mocht gebruiken aangezien ze een hedendaagse jonge verpleegster is. Ik wilde dat de guide character er niet al te echt uit zag, maar ook niet veel te nep/cartoon achtig. Dit is me denk ik goed gelukt, want de guide character ziet er aardig uit, hedendaags en past bij de stijl.

Bron foto: Merel van de Veerdonk, geraadpleegd op 28 februari 2020.

[emmavdboom]

Ik ben weer verder gegaan met het animeren na aanleiding van de feedback. De animaties waren iets te subtiel en daarom heb ik ze zo aangepast dat ze zeker opvallen en dat het doel van de animatie ook duidelijk is. Ook ben ik gaan kijken naar het geluid, maar hier ben ik nog niet te vreden over. (zie bron geluid bij eerste post over geluid).

[emmavdboom]

Ik ben gaan kijken naar hoe ik het openingsscherm eruit zou willen laten zien. Ik wilde duidelijk maken in het openingsscherm dat het is bedoeld om informatie op te zoeken oven een ziekte. Ik heb twee versies gemaakt waaruit ik er één ga kiezen voor versie 2 met iteratie.

[emmavdboom]

Animatie gemaakt in After Effects voor de feedback wanneer je met de muis over een optie hovert.