October 11, 2022 Smashing Newsletter: Issue #374
This newsletter issue was sent out to 222,341 subscribers on Tuesday, October 11, 2022.
Editorial
New York, New York! As this newsletter is landing in your inbox, SmashingConf New York is kicking off. After three years since we last gathered in NY for SmashingConf, we are so looking forward to spending the next two days together with the community — learning, sharing, and, of course, having fun!
If you couldn’t make it to New York to join us, we’ve prepared a newsletter issue for you that will take you on quite a journey, too. Just like our attendees, you’ll get to explore metropolises (from quite a different perspective), you’ll get to do some networking (in a slightly different way), and you’ll get to sneak a peek into the obscure and hidden corners of the web.
By the way, as we’re closing off the in-person conference year 2022 with New York, we have some wonderful events coming up soon. If you’re up for a free mini-conference experience, join us for our Smashing Meets Design Systems in a little over a month to dive deep into all things design systems, together with Brad Frost, Dan Mall, and Hayley Hughes. Or maybe we’ll see you in one of our upcoming online workshops soon?
Have a smashing day — no matter where in the world you are!
— Cosima
1. A Look Inside QR Codes
Have you ever wondered how QR codes work? Well, they are quite fascinating. So if you are up for a nerdy journey into the world of QR codes, Dan Hollick’s blog post is for you.
The QR code, or Quick Response code, was invented by a subsidiary of Toyota to track parts across the manufacturing process. It had some major advantages compared to barcodes: the QR code could be read at all angles and store more data relative to its size. As Dan explains, this is due to a combination of patterns that store the actual data and patterns that store error correction information to ensure that the QR code stays readable even when parts of it are obscured. Clever! (cm)
2. The Dark Side Of The Web
We all know that the Internet has a dark side, a world (seemingly) far away from friendly communities, happy cat videos, and things that make our lives easier. It’s the part of the web where hackers, breaches, and cybercrime dwell. And as with everything that happens in the underground, real insights into this secret world are quite rare. We came across four fantastic podcasts that are here to change that.
Darknet Diaries is one of them. Already running its 125th episode, the podcast captures and explains the culture around hacking and cyber security. Whether it’s breaches, shadow government activity, hacktivism, or cybercrime, Darknet Diaries dives deep into the hidden parts of the network.
Malicious Life tells the unknown stories of the history of cybersecurity, with comments and reflections by real hackers, security experts, journalists, and politicians. It takes you from the early hacking culture of the 1970s and 80s to today’s advanced cyber threats.
The weekly podcast Hacking Humans looks behind the social engineering scams, phishing schemes, and criminal exploits that are making headlines and taking a heavy toll on organizations around the world.
Last but not least, Exit Scam is a podcast about a mysterious death and a missing fortune. It investigates the death and afterlife of Canadian crypto baron Gerald Cotten who died under mysterious circumstances on his honeymoon in India, causing a $215 million problem for customers of his Bitcoin exchange Quadriga. But is he really dead? (cm)
3. Interactive City Noise Maps
Imagine cities were car-free. There’d be less air pollution, less CO2 emissions, and more green spaces. And it would be a lot quieter, too. But how much noise does road traffic produce in megacities? Noisy Cities, an initiative by the climate charity Possible, lets us experience it first-hand.
Built upon the idea of Karim Douleb’s original Noisy City map of Brussels, Noisy Cities features noise maps for London, Paris, and New York. To explore the loudest and quietest spots in a city, turn on your speakers, and hover your mouse over the map. A decibel scale shows you the noise intensity, and, of course, you will hear the traffic noise changing as you move your mouse’s position. A thought-provoking experience. (cm)
4. Mini Tokyo 3D
Tokyo has one of the most complex railway networks in the world, with more than 2,200 trains running simultaneously during rush hour. Pretty impressive, right? But what’s even more impressive is that you can follow along each of these trains, in real-time, from your laptop at home or smartphone on the go. Mini Tokyo 3D makes it possible.
Each train in operation and airplanes arriving at or departing from Tokyo are represented on the map. You can see each of them moving smoothly over the map, in real-time, color coordinated to the color of their line. Click on a train to see its schedule or click on a station to get more information about it. For a more realistic scenery, the color changes according to the sunrise and sunset times in Tokyo, and a rain animation delivers real-time weather information. To make the experience complete, you’ll find street webcams embedded on the map as well. The project is more than a nice gimmick, though. You can use it for real-time route searches, to find multiple candidate travel routes based on train delays, or to track a train and judge if you should dash to not miss it. (cm)
5. Upcoming Online Workshops
That’s right! We run online workshops on frontend and design, be it accessibility, performance, navigation, or landing pages. In fact, we have a couple of workshops coming up soon, and we thought that, you know, you might want to join in as well.
As always, here’s an overview of our upcoming workshops:
- Smart Interface Design Patterns UX
9h-video course on interface design with Vitaly Friedman - Designing for Emotion Masterclass UX
with Aarron Walter. Oct 17–18 - Pushing CSS to The Limit CSS
with Amit Sheen. Nov 2–10 - Deep Dive On Accessibility Testing Dev
with Manuel Matuzović. Nov 14–28 - Mastering the Design Process Workflow
with Paul Boag. Nov 15–23 - Designing The Perfect Web Forms UX
with Vitaly Friedman. Nov 17–18 - Figma Workflow Masterclass UX
with Christine Vallaure. Nov 17 – Dec 1
6. Network Visualizations Made Easy
Network visualizations with hundreds of thousands of nodes and edges are fascinating. However, the more edges and nodes you have in your network, the more difficult it is to compute and render the layout. Luckily, we have WebGL these days that can do the heavy lifting and render complex visualizations for us. That’s where Cosmograph comes in.
Cosmograph combines a layout algorithm and rendering engine and is capable of visualizing networks that have a million nodes and edges, right in your browser. All the computations and drawing are happening on the GPU in fragment and vertex shaders, avoiding expensive memory operations. Everything you need to do is upload a CSV, and Cosmograph visualizes it for you. If you want to use the power of Cosmograph to visualize big graphs in your own project, also be sure to check out the Cosmos library. (cm)
7. Data Visualization Journal
Can we understand blood test results without numbers? How did Soviet artists design data? And how can you visualize the network of the dragons from Game of Thrones? Data visualization is an exciting topic, and you probably won’t find a resource that dives as deep into it as Nightingale.
Nightingale is the journal of the Data Visualization Society, a non-profit organization that supports the growth, refinement, and expansion of data visualization knowledge regardless of expertise level. Run by a large team of passionate people, Nightingale publishes articles that cover all aspects of data visualization — from personal stories to exploratory research to interviews with leaders in the community, data ethics, and best practices. A treasure chest for everyone interested in data visualization. (cm)
8. Archive Of Found Typography
Camera cartridge loads, shoe polish, spices, soap. Whenever Jonathan Lawrence comes across a piece of vintage packaging, a sign, or other typographic artifact from the past, he takes a photograph and archives it on his blog Type Hunting. And while some might see Type Hunting just as a collection of vintage stuff, these things tell a bigger story.
As Jonathan explains, it’s the personal feel that makes the objects in the collection so appealing. Back when they were designed, there were no marketing teams or research groups; people just needed things to look good and to be produced easily. Jonathan wants to save these pieces of found typography so we can recognize them and learn from them. And indeed, the blog proves that these designs, and the approach behind them, stood the test of time and still inspire today. (cm)
That’s All, Folks!
Thank you so much for reading and for your support in helping us keep the web dev and design community strong with our newsletter. See you next time!
This newsletter issue was written and edited by Cosima Mielke (cm), Vitaly Friedman (vf) and Iris Lješnjanin (il).
Smashing Newsletter
Useful front-end & UX bits, delivered once a week. Subscribe and get the Smart Interface Design Checklists PDF — in your inbox. 🎁
You can always unsubscribe with just one click.
Previous Issues
- Design Systems
- UX Research
- Web Forms
- UX Writing
- New Front-End Techniques
- Useful Front-End Techniques
- Design & UX Gems
- New Front-End Adventures In 2025
- Inclusive Design and Neurodiversity
- UX Kits, Tools & Methods
Looking for older issues? Drop us an email and we’ll happily share them with you. Would be quite a hassle searching and clicking through them here anyway.