A Swing User Interface

Today is a great day… I am done with school! I will finally get my M.S. in Computer Science. Today was also the day we finished our final assignment. Our goal was to write some sort of a component-oriented/network-distributed VNC clone. I ended up in charge of the UI that I had to crank out in very little time. Just for fun, here are some pictures from that application.

The following picture shows the mockup I did in Photoshop. Forget about that “Pause” icon, it sucks but I got lazy and didn’t want to find a better one. And yes, I did borrowed everything from various Mac OS X apps (the tabs come from Transmit and the slider from iPhoto.)


Next, here is a screenshot of the actual application running on Windows XP. Despite the Aqua-like components, the design works pretty well. It took me by surprise.


My only problem with this UI is that I couldn’t find an easy way to get a unified toolbar, as show in the mockup. While the toolbar looks fine on Windows, it looks a bit weird on Mac OS X, as shown below. The gradient in this picture appears while waiting for the first picture of the remote desktop to be received (or around the said picture if the window is too large.)


The user interface contains some other niceties. For instance, the toolbar icons turn black, as on Mac OS X, when pressed, pausing a remote connection dims the picture and tabs show cool mouse over/pressed effects.

If you are curious on how I implemented the mockup, I’d be more than happy to share the code with you. The tabs are drawn with a tabbed pane UI delegate, as is the slider. Anyhow, I though it’d be to show that a Swing UI does not have to look like Swing, and that can be achieved very easily.

57 Responses to “A Swing User Interface”

  1. Tristan Seifert says:

    I’m really curious on the VNC code… can you send it to me? I don’t care if it is buggy or so, just to learn from the code.

    My email:

    dont_write_this_seiferttristan gmail

    and don’t forget to add .com at the end.