Friday, 15 May 2009

UML Sequence Diagrams on the Web

I find the sequence diagram to be one of the most useful UML diagrams - but it's also one of the most fiddly & annoying to generate in a diagramming tool. There's a few reasons for that:
  • there's a large amount of implicit structure which is tedious to maintain
  • sequence diagrams quickly get complex for processes with lots of actors and/or actions
  • I can never remember all the conventions for representing concepts like alternation, loops and nesting
Luckily, the web to the rescue! The websequencediagrams website has a on-line diagram generator which uses a simple language to describe the diagram. This works well precisely because of the structure in sequence diagrams. Because they are inherently linear in structure, they are more constrained than other UML diagrams.

The language supports just about everything you might want - signal types, groups, nesting, notes, lifelines, etc. It outputs in images or as PDF - and it even has cool styles! Here's the idea:
loop 1000 times
Me->Visio: draw sequence diagram
Visio->Me: frustration
Me->Google: search for better way
Google->Me: find websequencediagram tool
Me->WebSequenceDiagram: draw sequence diagram
WebSequenceDiagram->Me: happiness!


I've blogged about the appeal of specifying UML diagrams using code before. I'm not sure how much traction TextUML is getting - but it's hard to resist the appeal of a web interface, a simple language, and sexy ouput.

Now, if only someone would develop a force-directed web-based state diagram engine...

Note: there's some other alternatives to the websequencediagram tool - the author blogs about them here. The most interesting from my point of view is sdedit, which is open-source and Java-based. It's more powerful, but the language looks a mite complex. (Too bad there's no standard language for describing UML - maybe the Three Amigos should skip a siesta and whip one up.)


Jonathan said...


Regina Obe said...

This is very cool. I especially like the napkin version

Now I can throw out all my paper napkins and use virtual ones.

Dr JTS said...

Right, the napkin style! I thought this was totally cool when I first saw this site, but then I forgot to post a diagram using it. I'll have to think of a suitable sequence and post something...

Regina Obe said...


you know if doxygen or if Graphviz or whatever can read this notation. What would be really sweet is if I could stuff this in a comment for a function or class and have doxygen output the graphically representation of the text sequence diagram. That way I can have pseudo code in place before I write the real code.

I'm experimenting with that in one of my spatial projects where I need to break up a query into separate queries to feed back to the client based on the length of the buffer region they are asking for and the number of feature types in the report they selected. Its a good way to think out the steps.

Dr JTS said...


AFAIK, no. That would be cool, though. Perhaps its possible to make a plugin for Doxygen to get it to do this?

Part of the problem is that I don't think there's any standard textual notation for UML diagrams. This is a big flaw, IMHO. Clearly it's useful being able to express diagrams in text - so why not recognize this and develop a standard for it? (There is the XMI export format, but I suspect this is not readable by normal humans).

Also cool would be a way to derive the textual sequence from actual code. I realize that some UML tools can probably do this - but maybe it's easier going from code to this language?