Organiseren betekent in dit geval optimaliseren. Je bespaart jezelf, en zelfs je klanten, veel kostbare tijd door je werk te organiseren.
En laten we eerlijk zijn: tijd is alles. Het betekent dat je meer tijd zult hebben om aan je designs te werken en minder tijd zult spenderen aan de zoektocht naar dat ene bestand ‘dat je toch zeker op je bureaublad had opgeslagen’.
Mijn collega's en ik gebruiken Figma voor al onze ontwerpen. Figma is niet state-of-the-art. Het is meer dan dat. Heb je Figma nog niet geprobeerd? Breng er dan vandaag nog verandering in om je designs naar nieuwe hoogtes te tillen.
Omdat Figma een cloud-based tool is, heb je geen nood aan externe opslagservers zoals een Drive of Dropbox. Je kunt gemakkelijk toegang krijgen tot alles wat je nodig hebt via de browser en desktop app.
Dit elimineert natuurlijk een hoop organisatorisch werk: je hoeft niet langer bestanden door te sturen of te wachten op enorme WeTransfer links die een eeuwigheid duren om te maken (en nog langer om te downloaden).
Binnenin Figma heb je verschillende niveaus. In het voorbeeld hieronder heb je verschillende bestanden (files) die allemaal in hun eigen project zijn opgeslagen. Deze projecten zijn onderdeel van een Team, wat het hoogste niveau is in Figma.
Het is aan te raden om verschillende bestanden per onderwerp te maken. Bijvoorbeeld, één bestand is gewijd aan wireframes, een ander aan ontwerpen en een derde aan prototypes.
Door emoji's te gebruiken, kun je nog meer structuur aanbrengen in je bestanden. In het voorbeeld hieronder heb ik een speld gebruikt om de thumbnail aan te duiden, vlaggetjes om de taal van de pagina weer te geven, een verfpalet voor de designs, enz.
Ik heb ook afstandhouders toegevoegd (de lijntjes '----' die je ziet) om nog meer structuur in het bestand aan te brengen.
In Figma worden je bestanden getoond als een overzicht van alle pagina's die je in dat bestand hebt. Daar is niets mis mee, maar ik vind het gemakkelijker om een thumbnail aan het bestand toe te voegen zodat het gemakkelijker navigeert. Figma maakt standaard geen thumbnail, dus dit zal je zelf moeten doen.
Of je nu in Figma werkt (wat je echt zou moeten doen) of niet, je moet altijd je lagen een naam geven. En noem ze niet gewoon 'layer 1' 'layer 2',... Geef ze een naam die zinvol is, zodat andere designers die in hetzelfde bestand moeten werken, gemakkelijk een laag kunnen vinden wanneer ze wijzigingen moeten aanbrengen.
Het benoemen van je lagen maakt het werken aan een ontwerp in team een stuk eenvoudiger. Je hebt niet echt vaste afspraken nodig rond deze benamingen. Geef het gewoon een naam die logisch is. Het voorbeeld hieronder is hoe ons team de verschillende layers benoemde voor onze website ontworpen in Figma:
We hebben allemaal wel eens te maken gehad met de botsing tussen al te creatieve designers en praktische developers. Het gebeurt, en het is volkomen normaal.
Er zijn echter een heleboel manieren om de samenwerking tussen deze twee branches in je studio te verbeteren.
Wanneer we aan een project werken, maken we twee verschillende bestanden aan: een 'Discovery'-bestand en een 'Final'-bestand.
In het Discovery-bestand kunnen ontwerpers van alles uitproberen. Zodra het ontwerp is goedgekeurd, getest en gevalideerd, voegen we het toe aan het Final bestand. Dat is het bestand dat we delen met onze developers.
Developers hebben alleen toegang tot het Final bestand. Dat betekent dat ze alleen werken aan ontwerpen die zijn goedgekeurd, waardoor situaties worden voorkomen waarin een developer begint te werken aan een ontwerp dat, eenmaal technisch geïmplementeerd, er heel anders uitziet omdat de designers enkele wijzigingen hebben aangebracht.
Ons team gebruikt Notion om onze workflow verder te documenteren. Door deze handige tool te gebruiken, kan je context geven aan je ontwerpen en kan je gemakkelijk bijhouden waar je bent in het ontwerpproces en wie waar aan werkt.
Zodra een project klaar is, bundelen we het in een klikbaar prototype dat wordt gedeeld met de klant. De klant ontvangt een link en kan volledig zien hoe het eindproduct eruit zal zien.
Onze klant kan opmerkingen toevoegen en vragen stellen. Aan onze kant kunnen we eenvoudig zien waar opmerkingen zijn toegevoegd en kunnen we direct aan de slag. Dit neemt een hoop heen en weer gemail weg dat het geval zou zijn geweest als we het project met een WeTransfer-link hadden verzonden.
Tot nu toe zijn we nog niet tegen een opslagruimte-limiet aangelopen, ook al hebben we aan een heleboel projecten gewerkt. Weer een groot voordeel van Figma.
Als je je werk in Figma naar een klant stuurt en ze zitten in de 'view-only mode', dan hoeven ze er niet voor te betalen. Alleen wanneer je dingen direct in Figma wilt bewerken, heb je een betaald account nodig. Nog een voordeel.
Het organiseren van je design files en workflow in Figma is eenvoudig:
Gebruik de verschillende niveaus (team, project, bestanden,...) in uw voordeel
Gebruik emoji's en afstandhouders om meer structuur aan te brengen
Geef je lagen altijd een naam
Maak een thumbnail in Figma
Gebruik een 'Discovery' bestand voor je designers en een 'Final' bestand voor je developers
Documenteer je workflow. Dit kan gedaan worden met tools zoals Notion.
Volg deze handige richtlijnen en je zult je hele workflow in een handomdraai optimaliseren.
Schrijf je in voor de nieuwsbrief & ontvang alle nieuwste updates.
