This is absolutely wonderful!
There’s deep dives and then there’s Marcin’s deeeeeeep dives. Sit back and enjoy this wholesome detective work, all beautifully presented with lovely interactive elements.
This is what the web is for!
The next best thing to having Kurt Vonnegut at the blackboard.
Want to take a deep dive into tiling images? Like, a really deep dive. Rob has you covered.
An absolutely gorgeous piece of hypermedia!
Data visualisations and interactive widgets enliven this maze of mathematics. Dig deep—you may just uncover the secret passages that join these concepts together.
The forbidden symmetry of Penrose tiles and quasicrystals.
This is the trick that Charlotte used to get the nifty blobby effect on last year’s UX London site. Now there’s a tool to help you do the same.
This great post by Hui Jing is ostensibly about CSS shapes and exclusions, but there’s a much broader message too:
Build demos, and play around with anything that seems remotely interesting. Even if that feature is in early stages, or only supported by 1 browser. And then talk about it, or write and tweet about your experience, your use cases, what you liked or disliked about it.
We can shape the web to what we want it to be, but only if we get involved.
A lovely bit of data visualisation from Nadieh showing the differences and commonalities in constellations across cultures. As always, she’s written up the process too.
Marcin built this lovely little in-browser tool to demonstrate how segmented type displays work at different sizes.
Tal Leming’s thoroughly delightful (and obsessive) account of designing the 90 Minutes typeface for U.S. Soccer.
FIFA has strict regulations that govern the size and stroke weight of numbers and letters used on official match uniforms. This made me unbelievably paranoid. I had a nightmare that one of the national teams would be set for kickoff of an important match and the referee would suddenly blow the whistle and say, “Hey, hey, hey! The bottom stroke of that 2 is 1 mm too light. The United States must forfeit this match!”
This is impressive—a fully featured graphics app for creating SVGS right in your browser.
Metaballs, not to be confused with meatballs, are organic looking squishy gooey blobs.
Here’s the maths behind the metaballs (implemented in SVG).
Oh, how I wish I could’ve been at Web Directions Code in Melbourne to see this amazing presentation by Charlotte. I can’t quite get over how many amazing knowledge bombs she managed to drop in just 20 minutes!
A handy tool with some pre-made CSS clip paths that you can then tweak to your heart’s desire.
This is a really intriguing book that combines design theory and programming—learn about contrast, colour, and shapes, with each lesson supported by code examples.
It’s still a work in progress but the whole thing is online for free. Yay for web books!
Eric walks through a really nice use of CSS shapes and @supports on a page of the An Event Apart site.
It’s a nice little illustration of how we can use advanced features of CSS right now, without the usual wait for widespread support.
Jen tackles six aspects of web design that were true …but no longer.
- Everything must be a floating bar of soap
- Rectangles; only rectangles
- We can’t control the fold
- 12 columns is best
- We have to use a layout framework
- We are stuck in a rut because of RWD
This is a great free service for generating small subsetted icon fonts. Launch the app and have a play around — you can choose from the icons provided or you can import your own SVG shapes.
Nice touch: you can get the resulting font (mapped to your choice of unicode characters) base-64 encoded for your stylesheet.