Creating sequence diagrams
In this document, we briefly describe a few different ways to create sequence diagrams.
This post was most recently updated in October 2011. It is intended for programmers in a degree-level academic program that focuses on software development. This post will likely be updated a few times in the near future, to add more detail and information.
.
A brief survey of sequence diagram creation toolsets
Students in Seneca’s ICT software development programs learn to use Rational Rose to create sequence diagrams, and other software system design modeling assets.
Visual 2010 Ultimate Edition now includes tooling that enables the creation of sequence diagrams.
Online, there are many tools that are offered, in both free and pay-for versions. In the following section, we’ll look at one of these tools.
.
Websequencediagrams.com
Websequencediagrams.com is an online tool that enables you to create and save sequence diagrams. Its syntax is easy and discoverable. It enables you to save your work in a PNG image, a PDF, or as source text. It also provides online tooling, via an API.
A recent post by the author (Web service security principles – OAuth 2.0 example) included two sequence diagrams.
The source text for the first diagram is below:
.
participant Resource\nOwner as RO participant "Web\nBrowser" as ClientUI participant Client\nApp as Client participant Authorization\nServer as AS participant Resource\nServer as RS RO->ClientUI: [1] want protected resource activate RO activate ClientUI ClientUI->Client: [2] GET protected resource activate Client Client-->ClientUI: [3] HTTP 302 redirect deactivate Client deactivate ClientUI ClientUI->AS: [4] GET authentication UI activate ClientUI activate AS AS-->ClientUI: [5] respond with authentication UI ClientUI-->RO: [6] view authentication UI RO->ClientUI: [7] enter credentials ClientUI->AS: [8] POST the credentials AS-->ClientUI: [9] HTTP 302 redirect to redirection endpoint deactivate AS deactivate ClientUI ClientUI->Client: [10] GET auth grant exchanged activate ClientUI activate Client Client->AS: [11] POST request access token activate AS AS-->Client: [12] respond with access token deactivate AS Client-->ClientUI: [13] HTTP 302 redirect deactivate Client deactivate ClientUI ClientUI->Client: [14] GET protected resource activate Client activate ClientUI Client->RS: [15] GET protected resource (with access token) activate RS RS-->Client: [16] respond with the resource deactivate RS Client-->ClientUI: [17] render resource in browser deactivate Client ClientUI-->RO: [18] view the resource deactivate ClientUI deactivate RO
.
The source text for the second diagram is below:
.
participant Resource\nOwner as RO participant "Web\nBrowser" as ClientUI participant Client\nApp as Client participant Authorization\nServer as AS participant Resource\nServer as RS RO->ClientUI: [1] want protected resource activate RO activate ClientUI ClientUI->Client: [2] GET protected resource activate Client Client->RS: [15] GET protected resource (with access token) activate RS RS-->Client: [16] respond with the resource deactivate RS Client-->ClientUI: [17] render resource in browser deactivate Client ClientUI-->RO: [18] view the resource deactivate ClientUI deactivate RO
.
.
.
.
