Physical knob for virtual sliders in parametric design

Hey folks

Just want to share something I did over the weekend with puck.js. It's pretty simple, but it makes me very happy that it worked so smoothly! It's a physical knob controlling a virtual slider in parametric design tool Grasshopper 3D.

Cheers!

https://twitter.com/gnz/status/126231261­6866844672

2 Attachments

Looks great! Its nice to play with physical buttons and knobs in the world of touchscreens and virtual UIs.

Has the look of a metal case... but I assume it is some kind of plastic / fiber glass reinforced at best to not impact RF.

It's actually what I had in my drawer of enclosures, and I think it's actually aluminum, but for my silly use case, it works well enough, it's not blocking the RF connection. But it's a hack, a proper product design would change to a square form factor to be more composable with multiple knobs, and I would replace the top side of the box with glass-like black material.

That's great! How does it work? BLE HID?

Nope, not HID.

The desktop application side is listening for events that are incoming from a ROS topic over a websockets connection (with roslibpy).

The bridge between puck.js and ROS is a very trivial webpage (source) that connects to the puck.js, and starts an interval to send over the knob's value (an analog pin read) (and also the capsense value, that I didn't use so far). That same page publishes the value to ROS topics via websockets as well.

All and all, it's extremely simple, but it uses a bunch of very unrelated technologies. ;)