Thuisbezorgd app ontwerpen in Adobe XD

Steeds meer van ons leven speelt online af, nu we door corona niet meer naar fysieke winkels kunnen. Dit heeft ervoor gezorgd dat er een heleboel bezorgplatformen zijn ontstaan. Hun enige concurrentiemiddel? Hoe goed en hoe mooi de app werkt! Jij als ontwerper bent dus heel belangrijk, want jouw ontwerpen zorgen ervoor dat de apps makkelijk en aantrekkelijk zijn om te gebruiken. Beter design = meer geld!

Voor deze les is ook een video-tutorial gemaakt te vinden op mvi-plein.nl en youtube:

https://youtube.com/playlist?list=PLGE6DeW2Kdyo0NcPCilsWVXgWS2GTYQz1

https://mvi-plein.nl/knowledge-base/thuisbezorging-app-ontwerpen/

Je gaat in duo’s een app-prototype à la thuisbezorgd ontwerpen. In deze lessenserie ontwerp je jouw eigen thuisbezorgd geïnspireerde app en leer je de basics van Adobe XD.

Je bedenkt wat voor eten je wil gaan verkopen in jouw app en op welke wijze er zal worden gecommuniceerd in deze app. Je doet onderzoek naar de doelgroep en het thema van de app middels het maken van een moodboard. In dit moodboard focus je je op het kiezen van de juiste kleuren en beelden voor jouw app

Het prototype van de app zal worden uitgewerkt en interactief gemaakt worden in Adobe XD. In Adobe XD zullen de leerlingen experimenteren met de visuele stijl van de app, ze maken zelf keuzes voor typografie; lettertype, kleur, plaatsing gebaseerd op hun moodboard. Waar de leerlingen een interactieve navigatie gaan aanbrengen, welke getest zal worden door klasgenoten. Ten slotte presenteren de leerlingen hun app in maximaal 2 minuten om de doelgroep te overtuigen van de functie van hun app.

 

Interactieve chat-app ontwerpen met Adobe XD

Leerlingen ontwerpen en prototypen in duo’s een chat app. Ze bedenken hoe deze app moet werken en op welke wijze er zal worden gecommuniceerd in deze app. Ze doen onderzoek naar de doelgroep en het thema van de app middels het maken van een moodboard. Dit moodboard baseren ze op de apps die ze zelf gebruiken.

Het concept van de app beschrijven ze in een tekstverwerker. De flowchart zal worden uitgewerkt op gestippeld -prototyping papier. Het prototype van de app zal worden uitgewerkt en interactief gemaakt worden in Adobe XD. In Adobe XD zullen de leerlingen experimenteren met de visuele stijl van de app, ze maken zelf keuzes voor typografie; lettertype, kleur, plaatsing gebaseerd op hun moodboard.

Deze visuele elementen worden omgezet in herbruikbare elementen die vervolgens gebruikt worden om de app om te zetten naar twee schermformaten. Waar de leerlingen een interactieve navigatie gaan aanbrengen, welke getest zal worden door klasgenoten.

Ten slotte presenteren de leerlingen hun app in maximaal 2 minuten om de doelgroep te overtuigen van de functie van hun app.

App maken

Leerlingen maken in een informatie app over MVI (Media, Vormgeving, ICT) in een online ontwerpomgeving. Het vak MVI bestaat uit een aantal profielvakken en verschillende keuzevakken. De bedoeling is dat de gebruiker met deze app heel gemakkelijk kan zien wat die verschillende vakken zijn en wat voor producten hierbij gemaakt worden. Daarnaast geeft de app voorbeelden van mogelijke vervolgopleidingen en beroepen.  

De opdracht start met een onderzoek naar de inhoud en functionaliteiten van de app en door middel van een brainstorm ontwikkelen leerlingen een idee voor een eigen app. De opdracht is verdeeld in twee fases waarbinnen verschillende kleine opdrachten worden gemaakt. Na het doorlopen van dit ontwerpproces leveren leerlingen een werkende app in. De opbouw van de opdracht ziet er als volgt uit: 

  1. Concept ontwikkelen en plan maken (Inhoud en functies bepalen, Technisch ontwerp, Wireframe, Plan van aanpak) 
  1. Uitwerken, testen en documenteren (Applicatie uitwerken, Testen en feedback, Verbeteren, Documenteren in een dossier)