050 – 553 23 34
Sinds de start van Convident werken wij met Adobe Illustrator. Dit bevalt goed maar we zijn altijd op zoek naar manieren om ons proces te verbeteren. Met name op het gebied van webdesign. Belangrijke redenen voor het kiezen van Figma boven Adobe Illustrator zijn de workflows en de manier waarop klanten feedback kunnen geven. In dit artikel gaan we dieper in op de voor- en nadelen van deze nieuwe werkwijze.
Wat is Figma?
Figma is een interface design software die je kunt gebruiken in de webbrowser of kunt downloaden als programma. Het biedt handige tools voor de ontwerpfase van een webdesign project. Met Figma werk je volledig in de cloud en is daarom ook buiten het kantoor goed te gebruiken. Meerdere designers en programmeurs kunnen tegelijk aan hetzelfde project werken en elkaar van feedback voorzien.
Voordelen Figma
Het werken met Figma bevalt ons goed, dit zijn de voordelen die wij ervaren:
Werken in de cloud
Met Figma werk je in de cloud. Voorheen was dit niet mogelijk. In de cloud werken zorgt ervoor dat we altijd bij onze designs en wireframes kunnen. Niet alleen wij profiteren hiervan, ook de klant kan altijd bij de ontwerpen vanaf elke locatie (zolang er een internet verbinding is). Hiernaast sturen wij nog steeds afbeeldingen van de ontwerpen mee zodat de klant deze ook offline beschikbaar heeft.
Is een collega ziek? Dan beschikken we altijd direct over de laatste versie van het design vanuit de cloud. We kunnen direct de draad oppakken en eventuele aanpassingen doen. Daarnaast wordt er ook altijd automatisch een back up gemaakt. Een computer crash zorgt niet meer voor problemen want de laatste wijzigingen worden direct opgeslagen.
Componenten
Voorheen was het niet mogelijk om een centrale bibliotheek aan te maken met daarin componenten. Op iedere pagina moesten de componenten handmatig aangepast worden. Met de centrale componenten bibliotheek van Figma is het mogelijk om één component aan te maken en dit te gebruiken op meerdere plekken in het design. Moet het component aangepast worden? Dan kan dit vanuit de centrale bibliotheek gebeuren en verandert het component automatisch overal in het design.
Ook geeft Figma bij ieder component direct de juiste CSS code weer. Dit zijn de codes die gebruikt worden voor onder andere het lettertype, de kleur en de afstanden. Bij Adobe Illustrator moesten we deze waarden nog altijd handmatig invoeren in de code van de website. Nu is het een kwestie van kopiëren van de weergegeven CSS code en het staat foutloos op de website. Het werkt een stuk sneller en voorkomt fouten.
Figma prototyping
Prototyping is nog zo’n functie die inmiddels veel gebruikt wordt door ons team. De functie zorgt ervoor dat we een interactieve presentatie van het design kunnen geven. Klanten kunnen via een deelbare link toegang krijgen tot het design in de cloud en rustig op eigen locatie rondkijken.
Door prototyping kunnen er connecties tussen verschillende pagina’s en designs gemaakt worden. Zo kan de klant rondklikken en lijkt het alsof de website al online staat. Dit geeft een duidelijk beeld van hoe het eindresultaat eruit gaat zien en hoe het functioneel zal werken.
Notitie functie
Binnen het Figma design is het mogelijk voor de klant om notities achter te laten. Moet er een lettertype aangepast worden of moet er een knop anders? Het specifieke component kan door middel van een notitie aangewezen worden en deze notitie belandt direct op de to-do lijst van de designer en/of programmeur. Zo kunnen er geen misverstanden ontstaan over het aan te passen onderdeel van het design.
Voorheen stuurden we bij een nieuw ontwerp een PNG-afbeelding op die de klant kon bekijken. We kregen dan vaak een e-mail terug met daarin puntsgewijs de wijzigingen die nodig waren. Dit was vaak open voor interpretatie, want ‘die knop linksboven moet anders’ is minder duidelijk dan een specifieke aanbeveling bij de betreffende knop.
De mensen die aan het specifieke project werken ontvangen ook een e-mail zodra er een notitie achtergelaten is en deze notitie wordt direct aan de to-do lijst toegevoegd. Zijn de aanpassingen gedaan? Dan kunnen we dit gewoon aangeven als ‘opgelost’ en gaan we door naar de volgende verbetering.
Versie beheer
Voorheen werden bestanden van verschillende versies apart opgeslagen: homepage versie 1, homepage versie 2, enzovoort. Dit nam veel opslagruimte in beslag en er moest regelmatig gezocht worden naar een bepaalde versie.
Met het cloud werken van Figma worden al deze versie wijzigingen automatisch opgeslagen. Daarnaast zijn ze in te zien en op te zoeken per datum. Vorige week wat aangepast? Dan zoeken we eenvoudig tussen de laatst aangepaste versies en gaan we weer verder waar we gebleven waren. Het werkt makkelijker en het zorgt ervoor dat we alle revisies in een overzicht hebben.
Nadelen Figma
Er zijn ook een aantal nadelen aan het werken met Figma. Hieronder volgen de nadelen die wij ervaren hebben:
Internet afhankelijk
Het werken met Figma is volledig internet afhankelijk. Het is weliswaar te gebruiken in een internetbrowser of applicatie voor de laptop, maar heeft internet nodig om de bestanden uit de cloud te halen. Even snel onderweg wat aanpassingen doen zit er dus niet meer in zonder wifi of een internetbundel. Omdat wij tegenwoordig altijd verbonden zijn, zorgt dit doorgaans niet voor hele grote problemen.
Gewenning aan Adobe Illustrator
Adobe Illustrator is een programma waarin ook veel les gegeven wordt op scholen. Nieuwe werknemers kunnen hier dus vaak al mee uit de voeten. Dit zorgt ervoor dat ze snel aan het werk kunnen en weinig instructies nodig hebben.
Bij Figma is dit vaak niet het geval. Naast dat er minder mee gewerkt wordt op bijvoorbeeld scholen is de overgang van het ene programma naar het andere ook groot. De manier waarop het programma ingevuld is, zoals de componenten, layers en hotkeys, zijn allemaal anders. Het vergt dus iets meer werk om wegwijs te worden in Figma als je Adobe Illustrator gewend bent. Gelukkig is het programma vrij intuïtief en zijn veel shortcuts hetzelfde gebleven.
Alleen webdesign bij Figma
Met Figma werken we aan het webdesign en hiervoor werkt het ook prima. Maar het programma is niet gemaakt om bijvoorbeeld logo’s te ontwerpen. Hiervoor maken we nog steeds gebruik van Adobe Illustrator.
Conclusie Figma vs Adobe Illustrator
Kortom: Wij proberen met deze stap onze klanten een beter idee te geven van de gemaakte ontwerpen en alvast feeling te geven over hoe de website er uit komt te zien. Ook hebben wij deze stap gedaan vanwege de vele bovengenoemde voordelen die Figma biedt om onze workflow te versnellen en te verbeteren. Wij werken inmiddels met veel plezier met dit programma en hebben al veel positieve feedback van klanten ontvangen over onze nieuwe werkwijze.
Heb je nog vragen over Figma of zou je graag een dergelijk ontwerp door ons laten ontwerpen? Neem vooral contact op en wij kijken wat we voor je kunnen doen.
Contact
Convident is een full-service webbureau dat zelf up-to-date blijft met marketing trends en ontwikkelingen. Naast dat onze eigen creatievelingen daar zelf midden in zitten en altijd de laatste snufjes willen ontdekken, doen we dit natuurlijk ook voor onze klanten. Hiermee voorzien we onze relaties van de laatste trends met het oog gericht op de toekomst. Heeft jouw organisatie een specifiek vraagstuk en kan Convident je helpen op het gebied van (online) marketing, branding of met het ontwikkelen van een toekomstgerichte website, webshop of app? Neem dan contact met ons op of plan gelijk een afspraak!