
Nationaal Muziekinstrumenten Fonds
Werkzaamheden:
Webdesign, icon design
Resultaat:
www.muziekinstrumentenfonds.nl
Introductie
Wat is het Nationaal Muziekinstrumenten Fonds:
Het NMF is een Nederlands fonds dat muziekinstrumenten in bruikleen geeft aan talentvolle musici. Ongeveer 400 artiesten maken op dit moment gebruik van de instrumenten van het NMF en in totaal hebben bijna 2500 artiesten gebruik gemaakt van de collectie.
De doelstelling van het NMF is het stimuleren van muzikaal talent door het in bruikleen geven van muziekinstrumenten, het beheer van Nederlands cultureel erfgoed (de collectie muziekinstrumenten) en muziekeducatie.
Mijn rol:
In mijn tijd als stagiaire bij Driebit werd ik gevraagd om het herontwerp te maken voor de website van het Nationaal Muziekinstrumenten Fonds.
Het project was een paar maanden voor mijn komst al van start gegaan dus de briefing lag klaar en ik kon direct beginnen met het ontwerp. Mijn onderdeel van het project duurde ongeveer 7 á 8 weken. Ik was vrij in het ontwerp maar ik werkte wel nauw samen met mijn begeleider die mij hielp in mijn ontwikkeling.
Tijdens het project zijn wij meerdere keren in contact geweest met de klant om de vooruitgang, wensen en behoeften te bespreken.
Doelgroep:
Deze website is opgericht om de donateurs van het Nationaal Muziekinstrumenten Fonds inzicht te geven in de uitgaven van het donatie geld en om opkomende evenementen bij te houden.
De donateurs zijn over het gemiddeld 70+ en zijn liefhebbers van klassieke muziek. De doelgroep vindt persoonlijk contact en een laagdrempelige sfeer prettig.
Zowel donateurs van kleine als grote bedragen moeten zich prettig voelen bij het fonds en de uitstraling ervan.
Het proces
Om het ontwerpprogramma Sketch te leren kreeg ik als eerst de opdracht om de oude website na te maken in Sketch. Hierdoor leerde ik hoe de website in elkaar zat en kon ik mijzelf bekend maken met de verschillende stijlen en kleuren die het NMF gebruikte.
Wireframing:
Vervolgens ging ik aan de slag met het maken van een aantal wireframes. Bij Driebit werden de wireframes meestal gemaakt met een ‘script’ font en in grijs en zwarte tinten om aan de klant duidelijk te maken dat het om een eerste versie gaat waarbij er nog geen aandacht besteed hoeft te worden aan kleurgebruik en exacte vormgeving.
Kaartensysteem:
In de hieronder weergegeven wireframes is de koppeling te zien tussen de artiest en het instrument wat zij via het NMF in bruikleen hebben. Iedere kaart bevat een korte introductie met in de rechterbovenhoek het gekoppelde item.
Naast de lijst is een filter toegevoegd om het zoeken in de grote collectie gemakkelijker te maken net als een zoekbalk boven de lijst om specifieke opdrachten te doen.
Uitwerking
Webdesign:
Dit webdesign was mijn eerste ervaring met Sketch, hiervoor werkte ik mijn ontwerpen altijd uit in Adobe Photoshop. Om Sketch beter te leren kennen heb ik de oude website nagemaakt om de tool te leren maar ook om de oude website te begrijpen.
De hoofdonderdelen van de website staan hieronder afgebeeld:

Uitwerking van de homepage, collectie en musici pagina’s

Uitwerking van de mobile homepage en nieuwspagina
Icons als back-up voor missende foto’s:
Omdat niet alle artiesten en instrumenten een bijgeleverde foto hadden werden deze afbeeldingen vervangen door iconen. Echter waren deze qua vormgeving inconsistent en hebben wij besloten om een nieuwe iconen set te maken voor de belangrijkste onderdelen.
Om de iconen als een één geheel te laten voelen heb ik gebruik gemaakt van open vector lijnen. Hierdoor zijn ze herkenbaar als set.
Het liefst zouden wij hebben gezien dat iedere artiest en instrument een foto had maar met de grote hoeveelheid artiesten en instrumenten is het in de praktijk onontkoombaar dat er hier en daar een afbeelding mist. De iconen moeten daarom met een vriendelijke uitstraling een back-up vormen wanneer een foto niet van toepassing is.
Wat ik heb geleerd
Dit was mijn eerste langdurige project in deze industrie. In de tussentijd heb ik veel geleerd over het design proces en de uitwerking van een ontwerp, hierdoor zijn er verschillende zaken die ik op dit moment anders zou hebben gedaan dan hoe ik het ten tijde van dit project heb gedaan.
Zo zijn de wireframes in de loop van de tijd kwijtgeraakt of zijn ze van minimale kwaliteit en ook het document was erg rommelig en niet “pixel perfect”.
Maar voor mij altijd leuk om terug te zien dat het daadwerkelijk online staat en gebruikt wordt.
Tegenwoordig let ik er goed op dat ik de oorsprong van het ontwerp goed bewaar en ook kwalitatief beter uitwerk tot een hi-fi wireframe. Ook de documenten zijn zorgvuldiger bijgehouden om eventuele frustraties bij collega’s te voorkomen.
Bekijk de volledige website op: