Blurry Image Placeholders, Generated With Minimal CSS

May 1, 2025 by Donald Papp 9 Comments

Low-quality image placeholders (LQIPs) have a solid place in web page design. There are many different solutions but the main gotcha is that generating them tends to lean on things like JavaScript, requires lengthy chunks of not-particularly-human-readable code, or other tradeoffs. [Lean] came up with an elegant, minimal solution in pure CSS to create LQIPs.

Here’s how it works: all required data is packed into a single CSS integer, which is decoded directly in CSS (no need for any JavaScript) to dynamically generate an image that renders immediately. Another benefit is that without any need for wrappers or long strings of data this method avoids cluttering the HTML. The code is little more than a line like <img src="…" style="--lqip:567213"> which is certainly tidy, as well as a welcome boon to those who hand-edit files.

The trick with generating LQIPs from scratch is getting an output that isn’t hard on the eyes or otherwise jarring in its composition. [Lean] experimented until settling on an encoding method that reliably delivered smooth color gradients and balance.

This method therefore turns a single integer into a perfectly-serviceable LQIP, using only CSS. There’s even a separate tool [Lean] created to compress any given image into the integer format used (so the result will look like a blurred version of the original image). It’s true that the results look very blurred but the code is clean, minimal, and the technique is easily implemented. You can see it in action in [Lean]’s interactive LQIP gallery.

CSS has a lot of capability baked into it, and it’s capable of much more than just styling and lining up elements. How about trigonometric functions in CSS? Or from the other direction, check out implementing a CSS (and HTML) renderer on an ESP32.

A Dual Mirror System For Better Cycling Safety

May 1, 2025 by Donald Papp 53 Comments

Rear-view mirrors are important safety tools, but [Mike Kelly] observed that cyclists (himself included) faced hurdles to using them effectively. His solution? A helmet-mounted dual-mirror system he’s calling the Mantis Mirror that looks eminently DIY-able to any motivated hacker who enjoys cycling.

One mirror for upright body positions, the other for lower positions.

Carefully placed mirrors eliminate blind spots, but a cyclist’s position changes depending on how they are riding and this means mirrors aren’t a simple solution. Mirrors that are aligned just right when one is upright become useless once a cyclist bends down. On top of that, road vibrations have a habit of knocking even the most tightly-cinched mirror out of alignment.

[Mike]’s solution was to attach two small mirrors on a short extension, anchored to a cyclist’s helmet. The bottom mirror provides a solid rear view from an upright position, and the top mirror lets one see backward when in low positions.

[Mike] was delighted with his results, and got enough interest from others that he’s considering a crowdfunding campaign to turn it into a product. In the meantime, we’d love to hear about it if you decide to tinker up your own version.

You can learn all about the Mantis Mirror in the video below, and if you want to see the device itself a bit clearer, you can see that in some local news coverage.

Continue reading “A Dual Mirror System For Better Cycling Safety” →

Gaze Upon Robby The Robot’s Mechanical Intricacy

May 1, 2025 by Donald Papp 7 Comments

One might be tempted to think that re-creating a film robot from the 1950s would be easy given all the tools and technology available to the modern hobbyist, but as [Mike Ogrinz]’s quest to re-create Robby the Robot shows us, there is a lot moving around inside that domed head, and requires careful and clever work.

The “dome gyros” are just one of the complex assemblies, improved over the original design with the addition of things like bearings.

Just as one example, topping Robby’s head is a mechanical assembly known as the dome gyros. It looks simple, but as the video (embedded below) shows, re-creating it involves a load of moving parts and looks like a fantastic amount of work has gone into it. At least bearings are inexpensive and common nowadays, and not having to meet film deadlines also means one can afford to design things in a way that allows for easier disassembly and maintenance.

Robby the Robot first appeared in the 1956 film Forbidden Planet and went on to appear in other movies and television programs. Robby went up for auction in 2017 and luckily [Mike] was able to take tons of reference photos. Combined with other enthusiasts’ efforts, his replica is shaping up nicely.

We’ve seen [Mike]’s work before when he shared his radioactive Night Blossoms which will glow for decades to come. His work on Robby looks amazing, and we can’t wait to see how it progresses.

Continue reading “Gaze Upon Robby The Robot’s Mechanical Intricacy” →

Read Motor Speed Better By Making The RP2040 PIO Do It

April 29, 2025 by Donald Papp 8 Comments

A quadrature encoder provides a way to let hardware read movement (and direction) of a shaft, and they can be simple, effective, and inexpensive devices. But [Paulo Marques] observed that when it comes to reading motor speeds with them, what works best at high speeds doesn’t work at low speeds, and vice versa. His solution? PicoEncoder is a library providing a lightweight and robust method of using the Programmable I/O (PIO) hardware on the RP2040 to get better results, even (or especially) from cheap encoders, and do it efficiently. Continue reading “Read Motor Speed Better By Making The RP2040 PIO Do It” →

Weird And Wonderful VR/MR Text Entry Methods, All In One Place

April 29, 2025 by Donald Papp 5 Comments

Are you a developer or experimenter pondering options for text entry in virtual or mixed reality? If that’s the case (or you’re merely curious) then here’s the resource you need: TEXT, or the Text Entry for XR Trove. It’s a collection of all the things people have tried when it comes to creating text entry interfaces for virtual and mixed reality (VR/MR) systems, all in a searchable list, complete with animated demonstrations.

There are a lot of different ways to approach this problem, ranging from simple to strange.

VR and MR are new frontiers, and optimal interfaces are still very much a work in progress. If one wishes to avoid reinventing the wheel, it’s a good idea to research prior art. This resource makes it very easy to browse all the stuff people have tried when it comes to text entry.

It’s also fun just to browse and see what kinds of unusual solutions people have come up with that go pretty far beyond “floating over-sized virtual keyboard”. Lenstouch for example involves tapping directly on the touch-sensitive front of the headset, and PalmType reminds us somewhat of the Palm Pilot’s Graffiti system.

It’s a treasure trove of creativity with a nice, searchable interface. Have you come up with your own, or know of a method that isn’t there? Submit it to the collection so others can find it. And if you’re in the process of cooking something up yourself, we have some DIY handwriting recognition resources you might find useful.

Save Cells From The Landfill, Get A Power Bank For Your Troubles

April 27, 2025 by Donald Papp 34 Comments

A hefty portable power bank is a handy thing to DIY, but one needs to get their hands on a number of matching lithium-ion cells to make it happen. [Chris Doel] points out an easy solution: salvage them from disposable vapes and build a solid 35-cell power bank. Single use devices? Not on his watch!

[Chris] has made it his mission to build useful things like power banks out of cells harvested from disposable vapes. He finds them — hundreds of them — on the ground or in bins (especially after events like music festivals) but has also found that vape shops are more than happy to hand them over if asked. Extracting usable cells is most of the work, and [Chris] has refined safely doing so into an art.

Disposable vapes are in all shapes and sizes, but cells inside are fairly similar.

Many different vapes use the same cell types on the inside, and once one has 35 identical cells in healthy condition it’s just a matter of using a compatible 3D-printed enclosure with two PCBs to connect the cells, and a pre-made board handles the power bank functionality, including recharging.

We’d like to highlight a few design features that strike us as interesting. One is the three little bendy “wings” that cradle each cell, ensuring cells are centered and held snugly even if they aren’t exactly the right size. Another is the use of spring terminals to avoid the need to solder to individual cells. The PCBs themselves also double as cell balancers, providing a way to passively balance all 35 cells and ensure they are at the same voltage level during initial construction. After the cells are confirmed to be balanced, a solder jumper near each terminal is closed to bypass that functionality for final assembly.

The result is a hefty power bank that can power just about anything, and maybe the best part is that it can be opened and individual cells swapped out as they reach the end of their useful life. With an estimated 260 million disposable vapes thrown in the trash every year in the UK alone, each one containing a rechargeable lithium-ion cell, there’s no shortage of cells for an enterprising hacker willing to put in a bit of work.

Power banks not your thing? [Chris] has also created a DIY e-bike battery using salvaged cells, and that’s a money saver right there.

Learn all about it in the video, embedded below. And if you find yourself curious about what exactly goes on in a lithium-ion battery, let our own Arya Voronova tell you all about it.

Continue reading “Save Cells From The Landfill, Get A Power Bank For Your Troubles” →

Tiny, Hackable Telepresence Robot For Under $100? Meet Goby

April 17, 2025 by Donald Papp 10 Comments

[Charmed Labs] are responsible for bringing numerous open-source hardware products to fruition over the years, and their latest device is an adorably small robotic camera platform called Goby, currently crowdfunding for its initial release. Goby has a few really clever design features and delivers a capable (and hackable) platform for under 100 USD.

Goby embraces its small size, delivering what its creators dub “tinypresence” — or the feeling of being there, but on a very small scale. Cardboard courses, LEGO arenas, or even tabletop gaming scenery hits different when experienced from a first-person perspective. Goby is entirely reprogrammable with nothing more than a USB cable and the Arduino IDE, while costing less than most Arduino starter kits.

Recharging happens by driving over the charger, then pivoting down so the connectors (the little blunt vampire fangs under and to each side of the camera) come into contact with the charger.

One of the physical features we really like is the tail-like articulated caster at the rear. Flexing this pivots Goby up or down (and can even flip Goby completely over), allowing one to pan and tilt the view without needing to mount the camera on a gimbal. It also comes into play for recharging; Goby simply moves over the disc-shaped charger and pivots down to make contact.

At Goby‘s heart is an ESP32-S3 and OmniVision OV2640 camera sensor streaming a live video feed (and driving controls) with WebRTC. Fitting the WebRTC stack onto an ESP32 wasn’t easy, but opens up possibilities beyond just media streaming.

Goby is set up to make launching an encrypted connection as easy as sharing a URL or scanning a QR code. The link is negotiated between bot and client with the initial help of an external server, and once a peer-to-peer connection is established, the server’s job is done and it is out of the picture. [Charmed Labs]’s code for this functionality — named BitBang — is in beta and destined for an open release as well. While BitBang is being used here to make it effortless to access Goby remotely, it’s more broadly intended to make web access for any ESP32-based device easier to implement.

As far as tiny remote camera platforms go, it might not be as small as rebuilding a Hot Wheels car into a micro RC platform, but it’s definitely more accessible and probably cheaper, to boot. Check it out at the Kickstarter (see the first link in this post) and watch it in action in the video, embedded just below the page break.

Continue reading “Tiny, Hackable Telepresence Robot For Under $100? Meet Goby“ →