Onderzoek, concept en visual design

Stage bij Resoluut

Figma, Adobe Photoshop, Adobe Illustrator, Adobe Lightroom, Adobe InDesign.

2021

Visual design journey

In 2022 liep ik stage als visual designer bij Resoluut in Amsterdam. Hier heb ik mijzelf kunnen ontwikkelen op persoonlijk en professioneel gebied.

Nieuwe tools zoals Sketch, Figma en Principle kwamen in mijn workflow. Nieuwe technieken en ontwerp-principes hebben mijn werk naar een beter niveau weten te tillen. Uit bovenstaande combinatie zijn mooie manifestaties ontstaan. Zoals o.a. het concept voor het geanimeerde inlogscherm voor Simyo en een door mij gegeven After Effects workshop. Scroll snel verder om de hoogtepunten van deze periode te zien!

Motion design

Microanimaties, workshops en motiondesign

Tijdens mijn stage heb ik twee workshops gegeven. De eerste After Effects-workshop kwam tot stand na het idee voor een geanimeerd inlogscherm voor de Simyo applicatie.

Omdat ik tijdens dit project al eerder een conceptanimatie gemaakt had (visual device animatie), heb ik een collega binnen dit project als opfrisser door After Effects begeleid. 

Mijn eigen collega’s waren vervolgens enthousiast en hadden ook interesse in een workshop. Hiervoor heb ik onderzoek gedaan naar wat animatie voor hen kan betekenen en kwam ik uit op microanimatie. In de workshop heb ik informatie gegeven over de soorten animatie/motion, de geschiedenis, 12 principles of animation en technieken. Na het doorlopen van de AE-interface hebben we verschillende oefeningen gedaan.

Concept animatie visual devices

Tijdens een bespreking over het verder ontwikkelen van onderstaande visual devices leek het mij tof om deze te animeren, onder het motto “Simyo beweegt met je mee”. Hiervoor heb ik een conceptvoorstel gemaakt, waaruit het dynamische strooigoed en een aanzet tot motion binnen Simyo voortgekomen is. 

Brandrefresh

Nieuwe beelden voor een brand-refresh

Met een, door een extern bureau opgezette stijl, en door ons ontwikkelde vormtaal zijn er verschillende iconen en illustraties ontwikkeld voor de brand refresh van Simyo. 

Voor de brandrefresh heb ik, zoals Simyo dat noemt, visual devices (rich icons) en illustraties ontwikkeld in de al opgezette,

maar door Resoluut doorgevoerde stijl. Voor het goed overdragen op volgende designers, heb ik een design system gemaakt voor de elementen die in de illustraties voor komen in het programma Sketch.

 Met deze design-library is het heel gemakkelijk om met bestaande elementen een illustratie samen te stellen.

Implententatie brand-refresh website

Voor de implementatie van de brandrefresh naar het product (website en applicatie) hebben we de nieuwe elementen aan de user interface toegevoegd. Dit werd na een stakeholder check opgeleverd aan development. De volgende afbeeldingen is een selectie van de opgeleverde pagina’s.

A/B-test: Overstappen via PDP

Voor de, door het scrumteam opgezette, a/b-test heb ik verschillende flow’s verkend. Gericht op user experience en copywriting, wat een interessante verkenning was. Op onderstaande afbeelding is het uiteindelijke opgeleverde design voor de a/b-test te zien, deze zijn ingezet in de persoonlijke omgeving van de klant.

Welkom in de applicatie

Als warm ontvangst voor de app-gebruikers ben ik de nieuwe elementen van de brand refresh geanimeerd. In de animaties zijn de visual devices en illustraties te zien die met het motto van Simyo ‘met je mee bewegen’.

Design system

Opzetten design system

Bovenstaand project vulde een groot deel van mijn stageperiode. Hiermee heb ik geleerd hoe je met een designssysteem werkt en aanvult. Na dit project mocht ik zelf de basis van een designsysteem opzetten voor een webshop.

Illustratie

Illustratie concepten

Illustratieconcepten voor een paper-ontwerp. Dit zijn ontwerpen om een de stijl te bepalen tussen de vormgever en de klant.