UML object collaboration diagrams ​

When I was studying software engineering, some courses I attended used UML for object-oriented modelling. During those university years, I frequently found myself drawing those diagrams. A particular pain point was maintaining consistency: whenever something needed to be changed (like renaming a message), the changes had to be manually propagated across the diagrams in the documentation.

This motivated me to develop an interactive tool that connects different views of an object-oriented program, making it easier to link the different diagrams together with the code.

The system provides three synchronized views of the program: an UML object collaboration diagram showing runtime interactions, an UML class diagram displaying the static structure, and a code panel showing the actual implementation.

The views are integrated — objects can be rearranged with automatic connection routing, clicking elements in one view highlights related elements in others through animated indicators, and changes like renaming are automatically propagated across all views.

I started developing the tool using JavaScript for the browser, but I never actually finished its implementation. Nonetheless, I decided to write a bit about it here anyway because I believe seeing the idea might make you think about the possibility of having tools like this one.

Aside: why “collaboration diagrams”? ​

Class diagrams are the most widely used UML diagrams, but they only capture the static high-level structure of a program. Collaboration diagrams (called “communication diagrams” in UML 2.0) show the dynamic interactions between objects, making them particularly valuable for understanding object-oriented systems in action.

I prefer the term “collaboration diagram” over “communication diagram” for describing object interactions, because I think it’s a more appropriate metaphor to show how objects work together to fulfill their responsibilities^[1].