|
Software for spec'ing ...software ?
Hi,
Everytime I sit down to spec out some software I run into the problem that there doesn't seem to be a good way do the following:
Draw a picture of what you'd like the screen to look like "if it were magic" (to borrow from Alan Cooper)
- So having the ability to draw simple widgets easily (checkbox, list box, etc.)
Create annotations that can be clicked on.
Ability for someone else to modify the above, so that we can collaborate.
Ideally, ability to launch to a new page when you click on something.
I know this seems dreadfully simple, but I can't find anything that works well for this. I could use MS Word's VB forms to do the drawing, and even make a vb form that executes with buttons for "more info... click here". But that's a LOT of complexity which interferes with my flow.
I want something simple.
Maybe an HTML editor is the easiest way to go.
BTW, I've seen text specs and I just can't program from a text only spec, nor can I specify that way. I think very visually.
The real Entrepreneur
Friday, March 12, 2004
Visio can draw UIs...
GiorgioG
Friday, March 12, 2004
I was going to develop something like this but I couldn't find a good tool to help me spec it out.
Mr. Fancypants
Friday, March 12, 2004
What if you had a form editor that created defauly code for any clickable object that automatically pops up - "code to be added here"?
Aaron F Stanton
Friday, March 12, 2004
You could try this tool, although it is intended more for web site UI design than for desktop application UI. The concepts are nice, but I found the tool awkward to use (it may be better with a pen or Tablet PC for input, rather than a mouse), and the tool's navigation and menu style is unusual.
"DENIM is a system that helps web site designers in the early stages of design. DENIM supports sketching input, allows design at different refinement levels, and unifies the levels through zooming."
http://guir.berkeley.edu/projects/denim/
It hasn't been updated for a year, so the authors may have given up on this.
Philip Dickerson
Friday, March 12, 2004
SmartDraw http://www.smartdraw.com
_
Friday, March 12, 2004
This article from the "IBM developerWorks > Web architecture" series discusses using paper prototyping for the purpose of designing user interfaces and screens:
http://www-106.ibm.com/developerworks/usability/library/us-paper/
Especially, see the sidebar "Why not just use Visual Basic, HTML, etc.?" for some reasons to prefer paper prototypes over prototypes developed using PowerPoint, Excel, HTML, software, etc:
"2. Avoid nit-picky feedback. A polished-looking design can actually encourage the wrong kind of feedback. If you're trying to make sure you've got the right content and functionality, you may not want to hear comments like, "Hey, those fields don't line up," or "I don't like that shade of green." Paper prototypes avoid that kind of feedback because it's obvious to users that you haven't specified the look yet. This encourages users to focus on the concepts and functionality."
"3. Encourage creativity. Our brains respond more creatively to things that look somewhat unfinished. And users -- especially non-technical ones -- are often less intimidated by paper prototypes than by computers, so they'll feel more comfortable exploring your design."
"[...] While it may seem counterintuitive to test an interface without using a computer, paper prototyping lets you get maximum feedback for minimum effort. After a few usability tests with a paper prototype, you'll have confidence that you're implementing the right thing."
"[...] Paper prototyping is especially useful for gathering data about the following kinds of problems:
* Concepts and terminology. Do the target users understand the terms you've chosen? Are there key concepts they gloss over or misconstrue? (I've seen these types of usability issues in virtually every interface I've ever tested.)
* Navigation/workflow. If there's a process or sequence of steps, does it match what users expect? Do they have to keep flipping back and forth between screens? Does the interface ask for inputs that users don't have, or don't want to enter?
* Content. Does the interface provide the right information for users to make decisions? Does it have extra information that they don't need, or that annoys them?
* Page layout. Although your scribbled screens may not be pretty, you'll still get a sense of whether users can find the information they need. Do you have the fields in the order that users expect? Is the amount of information overwhelming, not enough, or about right?
* Functionality. You may discover missing functionality that users need, or functionality you'd planned but users don't care about."
Philip Dickerson
Friday, March 12, 2004
Phillip makes some good points. Still... the practical benefits of drawing on a computer can't be ignored. Is it possible to make a series of widets in Visio that look like they're hand drawn? For example, llines aren't perfectly staight, corners don't meet exactly, and so on.
The advantage of using Visio is that it provides images of real widgets. When the design firms up, you could simply replace the hand drawn widget with the real-looking widgets.
Jeremy
Friday, March 12, 2004
Good article. I've read that before.
Paper protyping is great if you're doing this all one-on-one with a non-techie. But I'm trying to spec out one program for myself and another one for another programmer. In that case a lot of the benefits of paper prototyping are lost.
But when youre doing it via the internet, you end up doing a LOT of scan-print-comment-scan-email.
I wonder if a lot of the demand for pen computing is managers who can't type and a lackof software to let you easily sketch something out :-)
I have Smart Draw and that's not bad, but my copy doesn't have any build in widgets for controls (buttons, etc.).
It seems that my venerable vb 6 IDE might be the best way to do this.
The real Entrepreneur
Friday, March 12, 2004
Try the GUI palette in Omnigraffle Pro, but you'll have to buy a mac...
David Roper
Friday, March 12, 2004
Paper prototyping is pushed as something marvelous by people who can't write software.
If you have the ability, use the best tool.
x
Friday, March 12, 2004
The real Entrepreneur ,
SmartDraw has a GUI widget symbols as part of the Pro edition, or you can buy them as an add-on package.
http://www.smartdraw.com/resources/collections/software/index.htm
Anyone considering Visio should take a serious look at SmartDraw too.
_
Friday, March 12, 2004
Use VB or VBA and don't put any code behind the UI. Take screenshots and write up what the UI is supposed to do.
pdq
Friday, March 12, 2004
Perhaps there is an opportunity to write some sort of VB add-in. Something that allows you to add notes etc on the actually form, that disappear at compile time?
Aussie Chick
Friday, March 12, 2004
haven't tried it, but you may be able to do that in C# (and maybe other similar languages).
all the stuff 'drawn' on the form is code. stick it in an #ifdef and it'll go away.
mind you, the IDE would need to understand this.
mb
Friday, March 12, 2004
Hmmm..
Aussie Chick- good idea. Maybe there's an even easier way to do this:
1. Create an array of RTF text boxes (I'll call them RTFboxes). So you'll have RTFbox (1)...(2)...etc.
2. Create a routine that cycles through all of the rtfBoxes and loads 'em from a file at run time and saves them when the program exits. Each box's contents get saved to : formname-controlname-index#.rtf
3. You could set each rtfbox to be "minimized" when you actually run the program, until you click on it, then it expands.
Benefits here are that the developer and the user both get to easily make comments. User doesn't need any special viewer. Developer can make comments while in design time, although.
You just make the rtf box invisible when you ship, or just remove it from the form.
The real Entrepreneur
Friday, March 12, 2004
With VB you could also have the app. actually write out a .FRM file to a text file, in all its entirety, and use the app. as a sort of shell script to execute, compile, open for design, etc., using "VB6.EXE" and its myriad arguments.
KayJay
Saturday, March 13, 2004
Also take a look at http://www.mztools.com/ for some neat extensions to VB. The source is not available, but some really good stuff.
KayJay
Saturday, March 13, 2004
More cool addins for VB (most free):
http://www.orangeandblack.co.uk/vbml.htm
The real Entrepreneur
Saturday, March 13, 2004
Take paper-prototype to Visio. Make a bunch of Visio objects that look like hand-drawn UI controls. That way you get the best (or worst depending on your opinion) of both worlds.
Ken Klose
Saturday, March 13, 2004
 Recent Topics
Fog Creek Home
| 
