DIY 3D Hand Controller Using A Webcam And Scripting

Are you ready to elevate your interactive possibilities without breaking the bank? If so, explore [Caio Bassetti]’s tutorial on creating a full 3D hand controller using only a webcam, MediaPipe Hands, and Three.js. This hack lets you transform a 2D screen into a fully interactive 3D scene—all with your hand movements. If you’re passionate about low-cost, accessible tech, try this yourself – not much else is needed but a webcam and a browser!

The magic of the project lies in using MediaPipe Hands to track key points on your hand, such as the middle finger and wrist, to calculate depth and positioning. Using clever Three.js tricks, the elements can be controlled on a 3D axis. This setup creates a responsive virtual controller, interpreting hand gestures for intuitive movement in the 3D space. The hack also implements a closed-fist gesture to grab and drag objects and detects collisions to add interactivity. It’s a simple, practical build and it performs reliably in most browsers.

For more on this innovation or other exciting DIY hand-tracking projects, browse our archive on gesture control projects, or check out the full article on Codrops. With tools such as MediaPipe and Three.js, turning ideas into reality gets more accessible than ever.

FLOSS Weekly Episode 800: Champagning The Ladybird Browser

This week Jonathan Bennett and Aaron Newcomb chat with Andreas Kling about Ladybird, the new browser in development from the ground up. It was started as part of SerenityOS, and has since taken on a life of its own. How much of the web works on it? How many people are working on the project? And where’s the download button? Listen to find out!

Continue reading “FLOSS Weekly Episode 800: Champagning The Ladybird Browser”

Turning Horrible Browser Controls Into A Game

With all of the various keyboards, mouses (mice?), and other human interface devices (HID) available for our computers, there’s no possible way for developers to anticipate every type of input for every piece of software they build. Most of the time everything will work fine as long as some basic standards are kept, both from the hardware and software sides, but that’s not always the case. [Losso] noticed a truly terrible volume control method when visiting certain websites while also using a USB volume knob, and used this quirk to build a Breakout game with it.

It turns out his volume control knob would interact simultaneously with certain video players’ built-in volume control and the system volume for the operating system, leading to a number of undesirable conditions. However, the fact that this control is built in to certain browsers in the first place led to this being the foundation for the Breakout clone [Losso] is calling KNOB-OUT. Unlike volume buttons on something like a multimedia keyboard, the USB volume control knob can be configured much more easily to account for acceleration, making it more faithful to the original arcade version of the game. The game itself is coded in JavaScript with the source code available right in the browser.

If you’d like to play [Losso]’s game here’s a direct link to it although sometimes small web-based projects like these tend to experience some slowdown when they first get posted here. And, if you’re looking for some other games to play in a browser like it’s the mid-00s again, we’re fans of this project which brings the unofficial Zelda game Zelda Classic to our screens.

Fork! Ladybird Browser And SerenityOS To Go Separate Ways

In the monthly Ladybird Browser update video which we’ve placed below, SerenityOS founder [Andreas Kling] announced an interesting development. The browser has been forked from the OS that has been its progenitor, and both projects will now proceed separately. This frees the browser from the SerenityOS insistence on avoiding external libraries, and allows it to take advantage of stable, fast, and mature open source alternatives. This is already paying dividends in compatibility and speed, and is likely to lead further towards a usable everyday browser as time goes by.

As the world of fully-featured web browser engines has contracted from a number of different projects to little more than Google’s Blink and Mozilla’s Gecko, Ladybird has found itself in an unexpected position. It is vital that the browser market retains some competition and does not become a Google monoculture, so while it might not seem so at first glance, the news of Ladybird going alone has the potential to be one of the most far-reaching open source stories of the year.

If you’d like to try Ladybird you’ll have to get your hands slightly dirty and build it yourself, but we’d expect ready-built versions to appear in due course. We took a look at an earlier version of Ladybird last year, as well as SerenityOS itself.

Continue reading “Fork! Ladybird Browser And SerenityOS To Go Separate Ways”

Play Giant Tetris On Second-Floor Window

Sometimes it seems like ideas for projects spring out of nothingness from a serendipitous set of circumstances. [Maarten] found himself in just such a situation, with a combination of his existing Tetris novelty lamp and an awkwardly-sized window on a second-floor apartment, he was gifted with the perfect platform for a giant playable Tetris game built into that window.

To make the giant Tetris game easily playable by people walking by on the street, [Maarten] is building as much of this as possible in the browser. Starting with the controller, he designed a NES-inspired controller in JavaScript that can be used on anything with a touch screen. A simulator display was also built in the browser so he could verify that everything worked without needing the giant display at first. From there it was on to building the actual window-sized Tetris display which is constructed from addressable LEDs arranged in an array that matches the size of the original game.

There were some issues to iron out, as would be expected for a project with this much complexity, but the main thorn in [Maarten]’s side was getting his controller to work in Safari on iPhones. That seems to be mostly settled and there were some other gameplay issues to solve, but the unit is now working in his window and ready to be played by any passers-by, accessed by a conveniently-located QR code. Tetris has been around long enough that there are plenty of unique takes on the game, like this project from 2011 that uses Dance Dance Revolution pads for controllers.

CADmium Moves CAD To The Browser

For plenty of computer users, the operating system of choice is largely a middleman on the way to the browser, which hosts the tools that are most important. There are even entire operating systems with little more than browser support, under the assumption that everything will be done in the browser eventually. We may be one step closer to that type of utopia as well with this software tool called CADmium which runs exclusively in a browser.

As the name implies, this is a computer-aided design (CAD) package which looks to build everything one would need for designing project models in a traditional CAD program like AutoCAD or FreeCAD, but without the burden of needing to carry local files around on a specific computer. [Matt], one of the creators of this ambitious project, lays out the basic structure of a CAD program from the constraint solver, boundary representation (in this case, a modern one built in Rust), the history tracker, and various other underpinnings of a program like this. The group hopes to standardize around JSON files as well, making it easy to make changes to designs on the fly in whatever browser the user happens to have on hand.

While this project is extremely early in the design stage, it looks like they have a fairly solid framework going to get this developed. That said, they are looking for some more help getting it off the ground. If you’ve ever wanted something like this in the browser, or maybe if you’ve ever contributed to the FreeCAD project and have some experience, this might be worth taking a look at.

The Most Annoying Thing On The Internet Isn’t Really Necessary

We’re sure you’ll agree that there are many annoying things on the Web. Which of them we rate as most annoying depends on personal view, but we’re guessing that quite a few of you will join us in naming the ubiquitous cookie pop-up at the top of the list. It’s the pesky EU demanding consent for tracking cookies, we’re told, nothing to do with whoever is demanding you click through screens and screens of slider switches to turn everything off before you can view their website.

Now [Bite Code] is here to remind us that it’s not necessary. Not in America for the somewhat obvious reason that it’s not part of the EU, and perhaps surprisingly, not even in the EU itself.

The EU does have a consent requirement, but the point made in the article is that its requirements are satisfied by the Do Not Track header standard, an HTTP feature that’s been with us since 2009 but which almost nobody implemented so is now deprecated. This allowed a user to reject tracking at the browser level, making all the cookie popups irrelevant. That popups were chosen instead, the article concludes, is due to large websites preferring to make the process annoying enough that users simply click on the consent button to make it go away, making tracking much more likely. We suspect that the plethora of cookie popups also has something to do with FUD among owners of smaller websites, that somehow they don’t comply with the law if they don’t have one.

So as we’d probably all agree, the tracking cookie situation is a mess. This post is being written of Firefox which now silos cookies to only the site which delivered them, but there seems to be little for the average user stuck with either of the big browsers. Perhaps we should all hope for a bit more competition in the future.

Cookies header: Lisa Fotios, CC0.