KICKOFF

Bij GRRR zijn we overgestapt van Sketch naar Figma. De switch heeft even geduurd omdat ik het lang niet de moeite waard vond. Sketch, Figma en XD waren lange tijd redelijk inwisselbaar en uiteindelijk kon je er hetzelfde mee creëren. Maar nu zijn we om en het bevalt prima.

De pro's en cons hebben we uitgebreid onderzocht: de design features, de handover naar frontenders, de import-mogelijkheden en de kosten. De weegschaal sloeg uit naar GO. Het zat 'm niet in één killer feature, maar de optelsom van veel kleine voordelen (een aantal worden hier genoemd. En hier legt Font Awesome uit waarom ze voor het ontwerpen van iconen Illustrator hebben verruild voor Figma).

De nadelen van switchen waren overzichtelijker. Hier de punten waarover we twijfelden, voor als je zelf de afweging gaat maken:

Suboptimaal

• Importeren: Sketch-files kun je importeren in Figma (en andersom), maar dan bestaat het risico dat teksten verschuiven en styles en overwrites verloren gaan.

• Performance: Figma werkt duidelijk trager op oude computers, met een RAM van <4GB of slechte grafische kaart. Dit geldt dus ook voor klanten die je ontwerpen moeten bekijken op brakke pc's.

• Offline werken: zonder internet kun je je documenten niet bereiken. Als tijdens het werken internet wegvalt, kun je blijven doorwerken, maar zodra je je window sluit, is je file niet meer te bereiken.

• Interface: zelf vind ik de flat interface met kleine letters en weinig kleur juist fijn, maar meerdere collega's klaagden hierover.

• Kosten: Figma Professional is beduidend duurder dan het vergelijkbare Sketch Standard: Sketch kost $9 per editor per maand, Figma kost $15 per editor per maand.

Dan nog twee Figma tips voor wie zich extra wil skillen:

Figma Academy — www.figma.academy

Leer Figma door een cursus die wordt gegeven ín Figma.

Schema, a one-day design systems conference by Figma — schema.figma.com

7 oktober organiseert Figma een online conferentie over design systems.

READING LIST

Perceived brightness: an essential concept for UI design — bootcamp.uxdesign.cc

Brightness is een belangrijk onderdeel bij het maken van kleurenpaletten; dit artikel laat zien waarom. Het managen van brightness in UI software is trouwens erg lastig, maar wordt binnenkort een stuk makkelijker met de introductie van de LCH-kleurnotatie (check de uitleg in Halfvet #41).

Designing Beautiful Shadows in CSS — www.joshwcomeau.com

Default shadows zijn mèh. Beter geef je ze wat liefde in CSS.

Reviewing a design for accessibility — www.a11yproject.com

Handige opsomming van laag hangend fruit als je je design wil checken op toegankelijkheid. Onderaan wordt gelinkt naar een volledige checklist van WCAG.

Grainy Gradients — css-tricks.com

CSS-tutorial om met noise grainy gradients te maken. Vet 🤩

IN JE FACE

Universal Everything heeft Infinity gelanceerd: een film die nonstop speelt, geen einde heeft en iedere keer anders is als je 'm bekijkt. Het toont een parade van random gegenereerde figuren, born from code. Waanzinnig mooi.

Het Consumer Aesthetics Research Institute is een lexicon van visuele trends vanaf de jaren '70 tot nu. Fantastisch om in te grasduinen, alleen al om de categorienamen: Cyberbougie, Eco-Beige, Neoliberal Vector Minimalism, Pinterest Mom 😀

Wieden+Kennedy Amsterdam heeft Huis Marseille in het nieuw gestoken en het ziet er heel fijn uit. Het logo is gebaseerd op de prachtige gevelbelettering (raar dat dat niet eerder is gedaan in de identity) en is er ook als monogram dat linkt naar het frame in fotografie. Ook de rest van de identity is classic, contemporary en crisp. 👌

MUST: WOUTER VAN BREEVOORT

Wouter is Halfvetter, visual designer en illustrator.

Activiteit om geïnspireerd te raken:

Surfen en/of skateboarden. Je bent eigenlijk aan het spelen met vallen, opstaan en weer doorgaan. Dat vertaalt zich in m'n werk.

No-code tool die me veel tijd heeft bespaard:

Voice-Flow. Makkelijk met drag & drop een voice app ontwerpen. De interface is onwijs intuïtief. Maar eigenlijk is het doel van deze tool helemaal niet wat ik tof vind. Door een gesprek met je gebruiker te ontwerpen, heb ik in Voice-Flow een extra dimensie gevonden om ook de user experience en -interface beter te ontwerpen. Deze tool is eigenlijk voor (visual en UX) design wat de e-bike is voor veel yuppen: niet per se bedoeld voor hen, maar wel handig!

Productiviteitstip die echt hielp:

Mezelf boos maken. Ik zet een timer van 10-15 minuten en ik schrijf alles op waar ik boos over ben of waar ik me aan erger. Geen censuur. Rauw. En daarna verscheur ik het. En die fuck you mindset brengt inspiratie en assertiviteit met zich mee. Elke dag weer.

TOOLS

• Doppler is een type scale tool inclusief optie voor line-height.

• Shaper laat in een voorbeeld-design zien wat de gevolgen zijn als je CSS-waardes aanpast voor type, spacing en kleur.

• Super Agent is een Chrome extensie die cookies op websites automatisch accepteert of juist niet. Wat een uitvinding 😍

• Playform laat je met AI spelen zonder code.

• Auto Interfaces verzamelt... auto interfaces.

• Sessions brengt al je collaborative tools samen op één plek. Integraties met GoogleDocs, Miro, Figma, enz.

• City Roads laat van steden alleen de straten zien, ook te downloaden als vector-file. ❤️

All caught up.

Het format van MUST is slightly aangepast en bestaat nu uit Halfvet-lezers die hun inspiratie delen. Jij ook op die plek? Reply even en we gaan het regelen.

Tot over twee weken!

Jeroen.