The Slowest Screen I’ve Ever Rapidly Prototyped

I wanted to sketch out a screen recently in a manner that didn’t imply any specific technology so I took a couple of hours to explore two ways of rapidly prototyping.


The first I tried out was Balsamiq Mockups that my friend Matt Smith recently pointed out on twitter. This was a really easy web-based tool to use and I quickly produced the following mockup:

balsamiq mockup

I had also recently noticed SwingPad was mentioned on twitter by Andres Almiray and I wanted to give it a whirl. SwingPad is a GroovyConsole-like application that lets you create and run groovy scripts that produce swing interfaces. If you’re not familiar with Groovy, one of the things it allows you to do is to build Swing component graphs using a SwingBuilder. So I dropped the Napkin Look & Feel jar into the SwingPad lib directory and cranked out this little script:

UIManager.setLookAndFeel(new NapkinLookAndFeel())

panel(preferredSize: new Dimension(300, 350) ) {
    vbox() {
        panel(alignmentX: Component.LEFT_ALIGNMENT) {
            gridLayout(columns: 2, rows: 2)
            label(text: 'Zip Code:')
            textField(text: '75218')
            label(text: 'City:')
            textField(text: 'Dallas')
        }
        rigidArea(height: 10)
        button(text: 'Map It!')
        rigidArea(height: 10)
        label(text: 'Here is your map of zip code 75218:')
        rigidArea(height: 5)
        panel(
                alignmentX: Component.LEFT_ALIGNMENT,
                preferredSize: new Dimension(200, 200),
                border: lineBorder(color: BLACK)) {
            borderLayout()
            label(
                text: 'Map',
                horizontalAlignment: SwingConstants.CENTER,
                verticalAlignment: SwingConstants.CENTER)
        }
    }
}

It actually took me hours to get the screen to look how I wanted it to. But this wasn’t any fault of SwingPad, but rather my own inexperience with Swing and all of its idiosyncrasies. But in the end I was happy with the results:

zip code mockup

I think I would use either approach again in the future. Although, unless I was actually doing Swing on a project I would probably take the Balsamiq approach purely in the interest of time.

There are no comments on this post

Leave a Reply