A rather geeky/technical weblog, est. 2001, by Bramus
With CSS Variables now being under development for Edge (the last of the modern browsers to not support it yet) it’s time to dig up this brilliant post on CSS Variables. If you’re under the impression that CSS Variables offer nothing new when compared to Preprocessor variables, then this post is a must-read for you: …
Continue reading “Why You Should Be Excited About Native CSS Variables”
Artist Walead Beshty has been shipping boxes built out of laminated glass panels. The boxes are built to the exact size of standardised FedEx boxes, so that they perfectly fit inside ‘m. The glass works are shipped unprotected, so that cracks appear with each successive shipment. The FedEx waybills, customs documentation, and any shipping stickers …
Virtual reality is a brand new frontier, but there are already tools that cover almost all the steps of creating a new experience (thank you, game industry). Sketching however, still remains a method that works … if you do it right: I used to do a lot sketches of only part of the view, or …
AnimatedVectorDrawableSeeing Lottie in action, I was reminded of Android’s AnimatedVectorDrawable which also allows one to do vector based animations. This class animates properties of a VectorDrawable with animations defined using ObjectAnimator or AnimatorSet. If you’re familiar with SVG, the AnimatedVectorDrawable XML contents will look familiar. The “Endless Pin Jump” animation (pictured above) for example is …
Continue reading “Animating vectors in Android with AnimatedVectorDrawable“
By the folks at AirBnB: Lottie is an iOS, Android, and React Native library that renders After Effects animations in real time, allowing apps to use animations as easily as they use static images. Lottie uses a JSON file – generated by the BodyMovin plugin for After Effects as its source, and then renders it …
Continue reading “Easily add high-quality animation to any native app with Lottie”
At Uber, we use maps for everything — visualizing millions of geo data points, monitoring road conditions, and advocating for policy change in cities around the world. Over the last few years we have experienced immense growth. As a result, we have many teams across the organization producing map visualizations for a wide range of needs. We …
Again great stuff by the Boston Dynamics team. It looks like their Atlas robot with wheels underneath it. (fragment starts at 3:45) It’s satisfying to see how smooth this thing goes and jumps, all whilst remaining in perfect balance. It’s also pretty scary to know that this thing can outrun me any time … I, …
nth-of-m-child(n,m) Selector. As explained/linked in (ab)using CSS3’s :nth-child() selector to invent new ones and Quantity Queries for CSS it’s possible to create new types of CSS selectors by cleverly combining a few the available CSS pseudo selectors. One of those new selectors is the :nth-of-m-child selector: /** * :nth-of-m-child selector * This selector will select the …
In the past I’ve seen some demos like this one that use JavaScript/math to calculate the hover direction upon mouseenter. Detecting the direction is also possible sans JavaScript, by adding triangular hitareas to a box/link in combination with the CSS General Sibling Selector (viz. ~) to rotate the content. Internally it looks like this: Note …