Animated Architecture

Can animated architectural models provide useful views of a distributed system?

BrokenLink My first attempt at an AnimatedArchitecture communicates data flow through a 4-tier system. http://home.earthlink.net/~paulcaswell/ea2002/models/AniArchOne.html BrokenLink

My second attempt zooms in on the EJB connection and remote method invocation. It is more focused towards the developers and includes sample code. http://home.earthlink.net/~paulcaswell/ea2002/models/AniEJBWhite.html

I think animated models can be useful in communicating abstractions of complex system. (they are also a lot of fun to create!). The static models (see ArchitecturePictures) I have seen do not emphasize the need for the components to collaborate together, resulting in the CrisisOfFragmentation. Developers crafting their piece of the system, focusing on engineering excellence and 'how' their component works (which is a GoodThing) but not looking outward towards the users of the component, not agreeing on a stable and unambiguous interface of 'what' service it is providing and not assisting in the integration efforts.

In the first model I have abstracted much of the detail, leaving what looks like a cartoon. It is useful by communicating a goal shared by multiple developers (not an XP project in this case, code and components are owned not shared (pair programming still encouraged), interfaces only are shared). An early increment is to achieve this end-to-end flow implementing a simple UseCase or UserStory.

Do you see any value in such a simple model? What models would be useful in your projects?

-- PaulCaswell

Cute. Now all you have to do is explain...

What is that blue box that flashes in the web server? A web page? Wouldn't the web page stay active until the response HTML was generated to the browser?
the blue box is the form data from the web page, the yellow is the web page
What is the bouncing blue ball in one of the EJB containers? A transaction?
a serialized java object (pass by value) containing the where data for the request. I have not included transactions visually on this model, it can be assumed the blue ball exists within a transaction
It appears that the request/message/locus of control changes "format" according to its shape and color? What is the format of a square vs a circle?
circle - java object. square is not a java object. I'm using the square to represent 1.form data (blue); 2.SQL select statement(blue) 3. Results Set (brown)
I guess the color brown represents the business data. (Watch the moving square/circle very carefully.)
yep
Does the data "encapsulate" the blue bouncing circle thingie when it returns through the EJB container???
no - it aggregates it (the brown/blue circle is the search criteria + the results). I agree the coloring looks like it does, I will change this
In the servlet engine, the request returns by a different path than took on the way out. I assume this is a diagram error.
not an error. this is model 2 MVC behaviour. In the struts framework: a HttpServlet? (1) receives the request passes the data to a subclass of the Action class (2), this mediates with the enterprise objects. the return path passes the results to an ActionForward? class (3) which maps to the JSP which contains the layout format the results)

Being able to control the step-by-step animation, and having corresponding text to explain the steps would be nice. coming soon!

With proper tools, I think this style of presentation could have value. But it does have its drawbacks. -- JeffGrigg

I think this is much more than cute, although I would also be interested in the answers to the Jeff Grigg's questions above.

I just tried something similar (but much cruder) in a ppt slide show for B2B ecommerce conversations. Will be trying it out on an audience Tuesday Feb 5 and will report back. I think animation will be very useful for understanding some kinds of problems (list not provided), but needs very clear references for the dynamic icons. -- BobHaugen

I like the direction you're taking. It's better than the ugly 3D object hierarchy visualizations that were all the hoopla at OOPSLA. However, Jeff is right in that the first animation leaves the viewer still dumbfounded. If you added more detail, like breaking the animation down to a series of subanimations (steps, if you will) with a little text explaining what's going on and what the major actors in the scene are, it would be a lot more powerful. I'm aware there's text below the animation, but if were inlined it would be more effective. The second animation has too much text. It doesn't make much sense to me as someone who doesn't know the purpose of the system. Maybe I'm not the audience, however. -- SunirShah

Some GraphicalProgrammingLanguages have animation as a built in feature.

does anyone have any references for this?