A Bit More Info on Balsamiq Mockups
Peldi had some questions from my earlier post, so I figured I’d answer them here.
Arbitrary Lines
Mockups supports a Vertical Rule and a Horizontal Rule. These are two separate “line” components, each is locked to its axis. I was thinking it might be simpler to have just one line component, and let the user drag, drop, and resize the line to any position, length, or angle. This would make it more like a line from a 2D drawing tool, like this:
Shapes
Mockups has a rectangle shape, and you can resize and move it. I would suggest adding a few more drawing-tool-like features:
- In addition to resizing the rectangle, let us rotate it to any angle.
- As you mention, add an ellipse tool. Like the rectangle, let us drag and drop, resize, and rotate.
Honestly, if we had lines, rectangles, and ellipsis, each with resize and rotate capability, we could draw just about anything we wanted to. Hell, I could use Balsamiq Mockups to create my comics.
Arrows
Peldi mentioned an arrow feature in the works. One kind of arrow might look something like this:
I suppose this kind of arrow would just be a predefined polygon that I could move, resize, and rotate. If implemented properly, Mockups could include an entire palette of polygons, each would resize and rotate the same way. In theory you could even define your own custom polygons, given the ability to draw arbitrary lines and group things together.
The second kind of arrow would be much simpler: just let us specify the shape of the start and/or endpoint of any line.
Storyboarding
I agree, make this a standalone tool.
One More Idea
Take a look at the source code for the Napkin Look and Feel. This has a neat package called sketchers that draws “jittery” lines and makes polygons look like they are hand-drawn with some randomness. You might get some good ideas from that work.
Eric, thanks for the answers, and for taking the time to make the pictures (they really help my little brain)
I understand the value of arrows and lines to help with marking up a Web/Software mockup, and I am planning on adding those.
Shapes I still don’t get though. Mockups is a UI wireframing / prototyping tool, and I don’t want it to become a generic diagramming tool (though, as you say, I am pretty close). I do not want to add rotation exactly for this reason (I have never seen a GUI with tilted buttons, or at least not a good one!), and generic shapes fall in that same category in my mind. I only have rectangles because they are used often to group UI containers together in dialogs and such.
Thanks for the Napkin link, I’ll take a look, though I must admit I really like my wife’s actual hand-drawings, which is what I use now.
Once again thanks for taking the time to help me make Mockups as good as it can be!
Peldi
I agree with Peldi about the rotated dialog boxes and so-on - while it might be nice for someone who knows about UI design (that’s not me by the way!) to be able to rotate things arbitrarily, if you give that power to clients designing UIs through JIRA, you’re going to start having to answer questions about why a rotated ListBox isn’t possible, when Balsamiq Mockups let the client draw it in the first place. Perhaps there needs to be an ‘Idiot Mode’ which removes most rotate functionality - it could be integrated with the JIRA permissions system.