Categories
Uncategorized

SoundProp – Sound Effects with Processing & MIDI

Sometimes you forget to document things, and sometimes you try to get ahead of the game. Back around 2009 I was one of the organizers of Web414, Milwaukee’s Web Community Meetup, and at some point Gabe and I turned it into a live talk show. Yeah, I don’t know how we managed to do that, but… it happened. We had guests and we interviewed them, and even had a musical guest once! Anyway, one of the things I did was add sound effects to things because… well, I love that kind of shit. So yeah, my first “Sound Effect Board” was a web page on my web site I called ShowProp which used Flash to play some sound effects at the push of a button. (Still there, still mostly works. Here’s another silly web/sound thing from 2010, Evil-O-Mator.)

Where was I? Oh yeah, sound effects! Typically I was the co-host while Gabe was the primary host, so I would work the sound effects board at the appropriate (or inappropriate time.) It was fun.

And then I started messing around with Processing in 2010 and eventually started a re-write of ShowProp that would run locally on my computer rather than a Flash-enabled web page. (Flash is Dead! Sort of…) Processing is still very much alive, and I use it fairly often for creative coding, and hey, I figured since it’s 2020 it was time to update things.

I should mention that in 2019 I got my first “real” MIDI device, an Arturia Beat Step. A local synth guy was selling it for… wow, less than half the price of a new one. (I guess I got a deal!) I say my first “real” MIDI device because I’ve built them before, for myself, for museum exhibits, etc. but I had never bought a commercial unit before. Since I had this around, and I enjoy screwing around with MIDI, I dug into MIDI support in Processing, and…

I ended up redoing my old ShowProp sketch to be SoundProp, which is a Processing sketch that accepts MIDI input and plays sounds. It’s the second fanciest sound board style device I’ve used this year. (Yeah, I use others.) I also discovered the sound playing capabilities of Processing have greatly improved over the years, so that was an added bonus.

So basically, my sketch has a bunch of audio files, and each is mapped to a MIDI pitch which is sent by one of the 16 pads. Now, because it’s MIDI and not key commands it always works, no matter what application is in the front. No fumbling around to pull up the right window before you press a key or click a mouse. All the Sounds! All the Time!

The UI is quite minimal. It’s just a window that is 250 pixels by 130 pixels. I typically just launch the application and minimize it. (And hey, this will run as a native—well, Java—application on macOS, Windows, and Linux… in theory.)

If I get around to it I’ll clean it up and upload the code, and maybe create a video showing it work, though it’s not really that exciting, but hey… 2020, whaddaya want!?

Categories
Uncategorized

Reflect-O-Scope

The Reflect-O-Scope was an interactive museum exhibit I worked on a few years ago. It was a fantastical machine that allows users (typically children) to slide materials under a microscope and examine them. The materials were from the sponsor of the exhibit and consisted of specialty tape materials adhered to plastic boards.

One of the original ideas was to allow for focusing, but that got scrapped. We figured kids would put almost anything under a microscope, their hand, their little sister, etc. Focusing meant a moving mechanism, and it was deemed to complex at the time.

The sculptural build was done by John McGeen and Austin Boechler. My focus was on the hardware and software. There’s a USB microscope connected to a computer and then a small HDMI display in the “goggle” shaped piece that the user looks into. It’s all a bit “periscope” like in design.

The original design also had a secondary monitor (a large TV) that would be mounted further away, so people could see weird things on the TV and it would draw them over. Lots of features got killed due to lack of time or other reasons. Most of what you see on a museum floor probably started out a lot more complex when originally designed, and then simplified as time goes on.

I wrote the software, which is just an application written in Processing that automagically launches at boot up, runs full screen, and shows the output from the USB microscope. There’s also a companion application called “List Cameras” that can display all the connected USB cameras and all of the possible resolutions they support. This is there in case the USB microscope ever needs to get replace. The exhibit tech just needs to run the application and then edit a config file. No recompiling of the application is necessary.

One more fun addition was a white plastic tube running along the outside with some NeoPixels in it featuring some funky color runs to add to the fantastical nature of the piece.

One of the nice things about this component was that the software was created in-house, so the component could be replicated easily without additional license fees. (We had an amazing software partner we used for the complex things, but simple stuff was done, when possible, in-house by the tech team, which was basically me.)

Categories
Uncategorized

Shape Grid Circles

example-001

I love plotters and plotter art and if you’re into robots or other machines that draw, you should check out #PlotterTwitter and DrawingBots.net

example-002

While I’m still working on my new plotter (which is really an old HP7475A) I figured I’d have fun with Processing and write some code to generate some nice vector art. This is something I do every now and then. I’m someone who believes in writing code for pleasure. Some people are into that… I’m one of them.

example-003

I’ve also released this code in case someone else wants to generate some art for use with their own plotter or whatever device they have that can do something with it. (Like a laser cutter, for instance.) And yes, the sample images you see on the page were generated by the sketch. There are a few variables you can change to adjust things, like the spacing between circles, steps between circles inside of circles, and setting the limit on the smallest circle.

example-004

You can find the code on GitHub: Shape-Grid-Circles.

If you make something cool with this code, let me know! I’d love to see what you come up with.

Categories
Uncategorized

Rectangle Chaos

rects-01

I started playing around with the #plottertwitter thing and wanted to do some creative coding with Processing, and at least one person asked about the code, so I’ve included it below.

rects-02

Instead of drawing a rectangle, I’m creating a shape, and then varying the position of it a bit more with each row that is drawn. I reused some code I’ve used plenty of times before that keeps track of where things are drawn so the code knows when to start a new row, and when the screen is filled. After it draws a screen full it will save a PDF and exit.

Once you have a PDF (which is a vector file) you can make your plotter (or laser cutter, or CNC machine) do what you want with it. I typically bring the PDF into Inkscape and make any adjustments needed before I save it out in a format suitable for the machine I’ll be sending it to.

Find the code on GitHub: Rectangle-Chaos

If you make something cool with this code, let me know! I’d love to see what you come up with.

Categories
Uncategorized

In Advance of Troubleshooting

Teensy

I’m working on a new exhibit that will be using an Arduino (actually, a Teensy++ 2.0) to talk to an application running on a PC via serial data. The Teensy will be sending one byte to control the application’s behavior. This is an upgrade from an older version where the Teensy just sent keystrokes to the application. The nice thing about sending keystrokes is that it was very easy for anyone to troubleshoot because they could just open Notepad and press some buttons to see if they were sending any output. The bad part was that if a normally closed switch was open, it would just stream characters to the computer, which could make things hard to troubleshoot for some people.

ATMTester

To deal with the troubleshooting issue (which will eventually come up, as it always does) and make it easy for non-technical people to view a serial data stream, I wrote a simple application in Processing that reads the byte and displays the value, along with the status of each physical control of the exhibit.

ATMTester

The exhibit should always have the Teensy plugged into COM3 on the PC, but again, once something leaves the shop we never know what strange things might happen. When the application starts up it will present a dialog showing the COM ports, and asking you to select the correct one. If you select the wrong one it will just display nothing. This should be enough to help troubleshoot things via phone or email.

The trickiest part was the code to choose the COM port. (I know, we don’t call them “COM ports” on Mac OS X, and yes, the application works fine on Mac OS X, that’s another thing I love about Processing.) The code for choosing the COM port came from this forum thread How to let the user select COM (serial) port within a sketch?.

I did have to install Java to get the application to run, but it looks and functions like any other Windows application. Here’s hoping this all works and never has to be used, but is there just in case…