Vixiom Axioms

September 12, 2006

Visual Web App Design

Filed under: Flash, Flex, Misc., Ruby on Rails Alastair @ 12:59 pm

My web application planning usually includes the outline from the client proposal as a feature list and a series of hand drawn diagrams (with many eraser marks), sometimes the diagrams where converted to adobe illustrator documents if the app was complex enough that the client needed to see the app flow before we begin building. However actually designing an app diagram in illustrator rather than tracing one makes my head hurt.

In search of brain-pain free visual design process I fired up google to see what I could find. There’s a product called Inspiration which started out as a brain-storming tool but also makes good application flow diagrams. They had a free 30 day trial so I downloaded it and started plotting my app, the first time I launched the program it worked fine, the second time I had Photoshop open as well and Inspiration crashed itself and Photoshop (and I thought the days of conflicting apps where long gone with OS 9 extensions). From then on even with no other apps running Inspiration would crash on launch.

Back the drawing board.

Next I tried Visual Paradigm for the Unified Modeling Language (UML) it runs on OS X and Windows and unlike Inspiration is designed just for visual application design. There’s a free community edition which lets you have one type of diagram per project, and there are many types (Class Diagrams, Business Work flow, Deployment Diagrams, etc.). The diagram I used to design my app is the Business Work flow which is one of the more basic ones, you’re not focusing on classes yet just the overall flow of the app.

Even with such a basic diagram you start to see potential problems in the design of the app before you put any hackery to paper, and no more erasing :)

Business Workflow

Digg! submit Visual Web App Design to stumbleupon.com submit Visual Web App Design to del.icio.us submit Visual Web App Design to reddit.com Like this post? subscribe to the feed.

No Comments »

No comments yet.

RSS feed for comments on this post. TrackBack URL

Leave a comment

*
To prove you're a person (not a spam script), type the security word shown in the picture.
Anti-Spam Image

Powered by WordPress