Turning a screenshot into a prototype with Grails

Question

We're beginning to design a new product, and our UI guy is knocking out screenshots like there's no tomorrow. Our boss, though, wants to be able to actually interact with the site as it would look with various features and skins. I can whip up simple features pretty quickly with Groovy on Grails (or any of a dozen other options), but what I don't have is a really quick way to turn a picture into an interactive website. Is there an application out there that takes an image, lets me mark certain areas as "input box named X goes here, this bit is a button that submits to the Y controller", and then generates some HTML that my boss can muck around with and we can all iterate off of?

Answer 1

I would just use http://www.balsamiq.com/products/mockups. Easy and Fast to use. You can make them interactive quite easily.

Oh and Bosses love that tool. They can muck around all they like. Devs like it cuz they don't have to be involved with making them interactive. Downside is devs do have to deal with the fact that Bosses can change the world without much effort.

Comment overheard in the room: "ya, his UI guy should be using that and not making screenshots. silly UI guys"

Answer 2

That sounds like a great idea for a web service. Unfortunately, while I don't know of anything that can directly translate screenshots this way, you can use Balsamiq's Mockups, Pencil (very nice, Mozilla-based), or Mockingbird.

Answer 3

Instead of making screenshots, there are enough tools to make actual prototypes like iRise, Serena, 10screens etc. Maybe your UI person is better off using those as both the designer and others will be able to change the prototypes.

Thanks Sunil

http://www.10screens.com