Look closely … 😢 By Jorge Gamboa (via Artists.Without.Borders)
The Making of ”Welcome Home” by Spike Jonze
I really enjoyed Apple’s “Welcome Home” ad for the HomePod, directed by Spike Jonze: Over at AdWeek there’s a behind the scenes video available showing how they made it: In particular, we get immersed in the choreography and the production design. But we also see how other elements came together, like the lighting, music and …
Continue reading “The Making of ”Welcome Home” by Spike Jonze”
The Broccoli Tree: A Parable
Patrik Svedberg had been taking photos of a particular and unique tree which he named “The Broccoli Tree”. He posted the photos on an Instagram account dedicated to the tree. And then one day, he noticed something was wrong with the tree. This video by Seth Radley tells the story. To share something is to …
Convert SVG to JSX with SVGR
Subsetting web fonts with glyphhanger
glyphhanger is a great tool to work with web fonts, developed by the folks at Filament Group. It serves two goals: It shows what unicode-ranges are used on a web page: # local and remote URLs $ glyphhanger ./test.html $ glyphhanger https://example.com # output characters instead of Unicode code points $ glyphhanger ./test.html –string # …
Fancy Words and Big Concepts
Using @supports to detect if a browser supports CSS Variables
UPDATE: The code snippet has been updated to use –custom instead of –. When Ire originally tweeted this — was a valid name for a custom property. This is no longer the case. As tweeted by Ire Aderinokun: @supports (color: var(–custom)) { /* has support */ } Not too surprising if you’ve used Feature Queries …
Continue reading “Using @supports to detect if a browser supports CSS Variables”
A New View of the Moon
Rough.js – Create SVGs with a hand-drawn, sketchy, appearance
Rough.js is a light weight (~8k), Canvas based library that lets you draw in a sketchy, hand-drawn-like, style. The library defines primitives to draw lines, curves, arcs, polygons, circles, and ellipses. It also supports drawing SVG paths. To get started first create a rough canvas: const rc = rough.canvas(document.getElementById(‘canvas’)); On that rough canvas you can …
Continue reading “Rough.js – Create SVGs with a hand-drawn, sketchy, appearance”
Enabling experimental Developer Tools Experiments
Using chrome://flags/ it’s possible to enable “Developer Tools Experiments”. On the most recent Fronteers Conference, Umar Hansa showed that there are even more DevTools Experiments that one can enable: Enable “Developer Tools Experiments” via chrome://flags/ if you haven’t already In the DevTools, go to Settings and select Experiments Hit SHIFT 6 times After having done …
Continue reading “Enabling experimental Developer Tools Experiments”