« A Website About Screensavers

Responding to the Environment

Most screensavers don't have a way to accept user input once they were running. The user might be able to specify some parameters that control how the screensaver operates, but you can't use the mouse or keyboard without deactivating a running screensaver, so interaction is basically impossible.

There are certainly some exceptions to that. I think After Dark had some screensavers which were really games that activated after a certain amount of idle time, and would keep running until you were done with them. But in general, once a screensaver is activated, it will run without any input from the user.

But modern computers have many ways of sensing their environment that go beyond keyboards and mice. They have cameras, microphones, bluetooth, and active internet connections. There's a lot of potential ways to use these features to generate a modern screensaver that goes beyond what was possible with the classic screensavers of the 1990s.

For example, you could develop a screensaver that detects when a bluetooth device is nearby, and activates or deactivates accordingly. You could lock your computer automatically just by walking away from it. A screensaver can easily check the weather, news, and all sorts of other things via the internet, or measure how much bandwidth a computer is using on the local network.

I decided to make a screensaver that uses noise levels via the microphone of the computer as an input. First I made an SVG of a smiley face inspired by the pain scale that is found on the walls of hospitals and doctor's offices all over the world.

Pain Scale

I made several aspects of the SVG controllable – the eye movement, the color, and the mouth and wrapped them in some Javascript to control it all.

I spent a long time fiddling with the positioning, the colors, etc, etc, until I was pretty happy with the results.

Lonely Computer

Then, I added the p5.js sound library to the project, and wrote some code to listen to the current noise level of the microphone on the computer – this code assumes that you have a mic – if you don't, it won't work.

I spent awhile messing around trying to get the levels right, but basically when the screensaver activates, you see a big face on your screen. If you make noise, the face reacts by changing color according to the pain scale colors, and by smiling or frowning. The reaction is random – sometimes the face likes noise, and sometimes it likes quiet. If you make more noise, it will react more severely.

You can see a preview of what it would look like if you were using this screensaver in Before Dawn. Also, here's a poor quality video of the screensaver reacting to Epic Sax Guy:

Although I think I'll keep noodling with it, I'm happy with the result – it's very basic, but interesting, and I think it has generated some ideas that I can use to build other screensavers.