Creating a curtain behind an application


Several things from my past combined recently, leading me to create something I think is a unique user interface effect. I call it a "curtain", as it is essentially a curtain behind the working window of your application. For instance, assume that you're using a text editor in a "normal" work environment, with windows from other applications open, and other icons laying on your desktop. This might look a lot like Figure 1.

Figure 1: A window named "My Editor" on a typical desktop.

As you can see this is a little cluttered, but I think it represents the view of many desktops in the world (and hopefully not just my own).

In Figure 2 you see what happens when I enable the curtain. (I've also come to think of this as "raising the shields" or a "cloaking device", especially after watching too many Star Trek episodes.) Here you just see the one window you really want to interact with at this moment. I like this because it is much less cluttered, and helps me focus on "the task at hand".

Figure 1: The same window, now with a black curtain behind it.


To run this application on your system you can download the jar file at this link:

Assuming you have Java 1.5.x or newer installed (also known as Java 5.0), after you download the file you can run the demo application like this:

java -jar curtain.jar

Once the demo is started, you can click the "On" button to show the curtain, and the "Off" button to hide the curtain. Or, if you prefer, you can click the curtain itself to hide it.

I should also note that the demo has one bad feature right now. Currently what I'm doing to enable the curtain is putting the simulated editor frame "always on top." This lets me make sure the editor is always on top, and the curtain is always behind it. I'll fix this in future releases, but for now, that's how it works.

As you'll see I bring the curtain into view, and send it out of view, with a little animation. I found that just making the background instantly dark, or instantly light, was not good on the eyes. I may eventually create a number of animations, but for now this will do. Note that it isn't finished either -- it runs too fast on some systems -- but hopefully it gets the idea across.


Other notes about the curtain ... it doesn't have to be black, it can be any color ... for that matter it can be any image, including an animated image, even a tv show or movie ... I started off creating this to look more like Expose on the Mac, but decided I wanted a dark curtain instead of a dimmed background ... if you don't have Java 5 installed on your system, or can't run the JNLP demo for some other reason, when the curtain is enabled it slides in from the left, and when it is disabled it slides back out to the left ... you need some type of transition here, as just turning the curtain on/off immediately is not very pleasing to the eyes..

I hope you enjoy this feature as much as I do. Feel free to use it in your own applications. Drop me a line if you're interested in the Java source code for this application, and I'll try to get it out here a little quicker. ;)