Illustration i Figma
Figma är primärt ett webbdesignverktyg. Så, jag använde det naturligtvis för att rita illustrationer.
Figma är nuförtiden de facto-standard för nästan all sorts (manuell) design av gränssnitt och digitala lösningar. Men, i början av 2020 var det extremt ovanligt att se någon som faktiskt ritade bilder i Figma. Jag ville testa, om inte annat för att lära mig själv att bända bättre bézier-kurvor.
Det hela började med en tweet
I mars 2020 la jag ut en tweet med en switch som jag höll på att rita i Figma. Jag brukade inte få särskilt mycket respons på sociala inlägg – ett ”ok” då och då, ett ”snyggt”, kanske en lajk eller två.
Men den här visades mer än 66 000 gånger. Alltså, w00t? Jag fick också flera direktmeddelanden som undrade om ”du verkligen gjorde det här i Figma” och om ”du snälla kunde göra en tutorial om hur man lorem ipsum”.
Bra för egosystemet®, antar jag, men sedan tänkte jag att jag kanske borde gräva lite djupare i att göra vektorgrafik i en mjukvara som egentligen är riktad till webbdesigners.
Så: off for a vector journey.
Vad ska man rita?
Det måste vara något som går att härma från verkliga livet. En katt? Nä. En bil? Nej, jag gillar varken katter eller bilar.
Kanske ett pseudoverkligt föremål? Något digitalt som är interaktivt? Kanske skulle jag helt enkelt försöka rekonstruera utseendet på ett musikprogram? Varför inte ge sig på en av Reason Studios moduler? Så fick det bli.
En rackmodul, omritad
Efter några kvällar tillsammans med Figma hade jag min egen version av Reasons MClass-modul klar. Allt är vektorer, utom trästrukturen där jag använde en repeterad bitmap. Att fuska lite kändes okej.
Vill du ha en egen kopia av illustrationen ovan går det bra att ladda ned den från Figma Community. Och bara för att vara extremt tydlig: jag tar ingen ära för originaldesignen. Reason Studios äger all rätt till namn, design och funktion.
Nästa grej
Dra i reglaget för att se vektorkonturerna mot den färdiga designen.
Bilden ovan gjorde jag genom att först 3D-modellera texten och rendera en förlaga med blanka reflexer. Sedan började arbetet med att rita om allt i Figma. Som sagt … bitvis har jag haft för mycket tid.
Men vad är en ”Reko”? Hur ska jag kunna veta det? Påhitt, alltsammans.
Sen: in med grejen i en annan grej
Ännu en illustration, den här gången av en ny påhittad sak. Visuella fel finns här och där, men på det hela taget är jag ganska nöjd med finishen. Hundra procent vektorer – inga bitmapz kom till skada i arbetet.
Vad mer?
Jag ritade ytterligare några saker till, mest för övnings skull. Sedan kom livet emellan – covid, en frustrerande husrenovering och mycket jobb. Förhoppningsvis kommer inspirationen och energin tillbaka någon gång. 🙃
