• Halfvet
  • Posts
  • Halfvet #60 – Gradients die niet zuigen

Halfvet #60 – Gradients die niet zuigen

KICKOFF

Erik op een gradient die niet zuigt

Een van de leukste en leerzaamste nieuwsbrieven die ik lees, is The Design Newsletter van Erik D. Kennedy. Elke editie bespreekt hij één ui-gerelateerd onderwerp of doet 'ie een break down van een van z'n designs. Die ontledingen zijn m'n favoriet. Stap voor stap neemt hij je mee in z'n gedachtegang, met veel visuele voorbeelden en een vrolijke schrijfstijl. De tips zijn super praktisch en meteen toe te passen in m'n werk.

Z'n meest recente nieuwsbrief ging over kleurverlopen. In gradients zijn de begin- en eindkleuren vaak vol en helder, maar kan het middenstuk nogal grijzig uitpakken:

Hoe komt dat en is daar wat aan te doen? Leuk dat je het Erik vroeg 🙂

Het modderige midden komt omdat een 'normale' gradient in het kleurenwiel twee kleuren met elkaar verbindt door er een rechte lijn tussen te trekken. Deze lijn gaat over het midden van het kleurenwiel, waar de kleuren flets zijn. De rijke, verzadigde kleuren zitten aan de randen van het wiel.

De oplossing: trek geen rechte lijn, maar buig 'm langs de randen:

Voila 🙌

Probleempje is wel dat de meeste ontwerp-tools alleen 'rechte' gradients kunnen maken. Maar ook daar heeft Erik een antwoord op. Hij bouwde namelijk zelf een Gradient Generator die wél 'kromme' gradients kan maken. Met de tool genereer je verschillende type gradients (linear, radial, conic), eventueel in een hoek of met easing. Het resultaat kun je exporteren als CSS of SVG file (die je in Figma, Sketch of XD sleept).

Bookmarken!

READING LIST

Abstract vroeg 1.000 ontwerpers naar hoe ze werken, wat ze belangrijk vinden en waar ze tegenaan lopen. Twee onderwerpen die vaak terugkomen: samenwerking (steeds complexer werkveld, meer betrokken disciplines, feedback van veel stakeholders) en impact (meer sturing op business impact, data driven design).

Schaduwen kunnen een ontwerp laten vliegen. Maar je past ze pas echt goed toe als je weet hoe ze werken. In deze explainer leer je alles wat je moet weten.

Arun Venkatesan is ontwerper en beschrijft uitgebreid z'n desk setup. Daar zit een hele gedachtegang achter, zowel filosofisch als praktisch. Leuke inkijk!

IN JE FACE

Lekker hoor, een identity met z'n eigen type tool

Collins ontwierp een heerlijke visual identity voor The San Francisco Symphony. De eerste viool wordt gespeeld door de variable font typografie die samen met DINAMO is ontwikkeld. In dit soort toepassingen kunnen variable fonts echt shinen. Kijk maar.

Mooi wijntje

Noors ontwerpbureau Olssøn Barbieri ontwikkelde een frisse identity en verpakking voor de non-alcoholische wijn Ambijus. Met schitterende fruit-illustraties.

MUST: MAARTEN JANSSEN

Maarten is freelance UX designer met tandenstookverslaving

Must read

Offscreen – Mijn favoriete vorm om lezend mezelf te verdiepen als maker van digitale producten: een analoog magazine. Eens in de vier maanden lange artikelen — die soms voelen als huiswerk — maar als ik ze uit heb echt nieuwe inzichten geven. Ik las bijvoorbeeld twee jaar geleden al over de extreem-rechtse neigingen van algoritmes; nu alom bekend als de fabeltjesfuik.

Must see

Bijlmer – Ik heb een mooie uitgeteste combi MUST SEE + LISTEN: pak trein of metro naar de Bijlmer en maak daar een lekkere wandeling en luister ondertussen naar deze tweedelige podcast. Wist jij bijvoorbeeld dat door de honingraat vorm alle woningen evenveel licht binnen krijgen? Fascinerend ook hoe zulke sociale design principes ook te star zijn volgehouden, waardoor de stad van de toekomst al weer deels gesloopt moest worden voordat die af was.

Must use

Loom – Een ideale tool, die helemaal tot z’n recht komt in tijden van thuiswerken. Presenteer werk updates via een screenrecording — inclusief jezelf in een video-bolletje — zodat jezelf geen ellenlange motivaties hoeft te typen of weer een meeting moet plannen. De ontvanger hoeft geen ellenlange mails te lezen en kan direct reacties achterlaten op de timecodes. Met een gratis account zijn je filmpjes max. 5 minuten. Perfecte vorm van asynchroon samenwerken.

TOOLS

Blobmixer

  • Uhmmm vult awkward stiltes tijdens video calls met liftmuziek.

  • Ethical Design Guide verzamelt voorbeelden van do-no-harm design.

  • Deep Nostalgia brengt portretfoto's tot leven door de gezichten te animeren.

  • Penpot is een open source, web based design en prototype app.

  • GitHub Skyline maakt van je GitHub bijdrages een slicke 3d visualisatie.

  • Rise Calendar is een todo-app vermomt als agenda. Nieuw project van Rick Pastoor.

  • Blobmixer maakt customizable 3d blobs.

All caught up.

In de vorige Halfvet deelde ik een aantal ideation methodes die we bij GRRR veel gebruiken. Joost Roozekrans reageerde met een boekje dat hij over dit onderwerp schreef: How to Create Better Ideas. Leuk & praktisch!

En de vorige keer vroeg ik om Halfvet extra te promoten zodat ik de 1000 abonnees kan aantikken. Dat is gelukt! Deze week kon ik Eva V. verwelkomen als duizendste lid 🎉🎉🎉🎉🎉 Zo vet!!!

Tot over twee weken,

Jeroen.

Join the conversation

or to participate.