Design System Interaction with Sequence Diagram
Key Note
Why this matter?
A sequence diagram simply depicts interaction between objects in a sequential order i.e. the order in which these interactions take place.
We can also use the terms event diagrams or event scenarios to refer to a sequence diagram. Sequence diagrams describe how and in what order the objects in a system function(v).
These diagrams are widely used by businessmen and software developers to document and understand requirements for new and existing systems.
A sequence diagram (with Draw.io)
A sequence diagram code (with PlantUML)
@startuml
Alice -> Bob: Authentication Request
alt successful case
Bob -> Alice: Authentication Accepted
else some kind of failure
Bob -> Alice: Authentication Failure
group My own label
Alice -> Log : Log attack start
loop 1000 times
Alice -> Bob: DNS Attack
end
Alice -> Log : Log attack end
end
else Another type of failure
Bob -> Alice: Please repeat
end
@enduml
A sequence diagram rendered image (with PlantUML)
↘ with skin ⤵
@startuml
!includeurl https://raw.githubusercontent.com/TheIconic/PlantUML-skins/master/src/sequence/sequence.iuml
Alice -> Bob: Authentication Request
.
.
.
@enduml
Check your understanding
What is?
-
Actor
-
Lifeline
-
Frame
-
Message
-
Synchronous messages
-
Asynchronous messages
-
Create message
-
Delete message
-
Self message
-
Reply message
-
Found message
-
Lost message
-
-
Guards
-
Control
-
Entity
-
Boundary
How to ?
-
Illustrate if-else scenarios?
-
Illustrate an exceptions?
-
Illustrate an condition must passed before an API call (e.g email validation)?
-
Change the color everything (style) for fun
-
with draw.io?
-
with plantUML?
-
Reference
drawio-app.com/create-uml-sequence-diagrams-in-draw-io/
geeksforgeeks.org/unified-modeling-language-uml-sequence-diagrams/
developer.ibm.com/technologies/web-development/articles/the-sequence-diagram
No Comments