Preface
Goal: Starting from Requirement.
One question at a time.
Sequence Diagram: Master
+----------------------------------------------------+
| User Management System |
+----------------------------------------------------+
| <<sequence diagram>> |
+----------------------------------------------------+
| |
| Admin |
| | |
| v |
| [ Manage Users ] |
| | |
| v |
| <<create>>UserController |
| | |
| v |
| [ add_user(user_info) ] |
| | |
| v |
| <<create>>UserService |
| | |
| v |
| [ validate_user_info(user_info) ] |
| | |
| v |
| [ Add User to Database ] |
| | |
| v |
| Database |
| |
+----------------------------------------------------+
I really have no idea why the textual diagram look like above result. I guess I need the image representation.
PlantUML
So I ask again.
@startuml
title User Management System
actor Admin
Admin -> [Manage Users]: selects
[Manage Users] -> UserController: create
UserController -> [add_user(user_info)]: call
[add_user(user_info)] -> UserService: create
UserService -> [validate_user_info(user_info)]: call
[validate_user_info(user_info)] -> [Add User to Database]: call
[Add User to Database] --> Database
@enduml
The generated diagram from draw.io can be shown as below
You can obtain the source SVG image here:
Confused
This image doesn’t look like any sequence diagram I ever draw. Is it beacuse I never have formal IT education? My lack of experience? I guess I have to dig a little deeper.
Sequence Diagram: Detailed
So I ask again.
I accidentaly ask a question that breakdown the master sequence diagram above into detail below. For each response, the generated diagram from draw.io is shown.
User Registration Sequence Diagram
@startuml
title User Registration
actor User
participant "User Registration Form" as Form
participant "User Registration Controller" as Controller
participant "User Database" as DB
User -> Form : Open registration form
Form -> User : Display registration form
User -> Form : Submit registration form
Form -> Controller : Process registration form
Controller -> DB : Create user record
DB -> Controller : User created
Controller -> User : Redirect to login page
@enduml
User Login Sequence Diagram
@startuml
title User Login
actor User
participant "Login Form" as Form
participant "Login Controller" as Controller
participant "User Database" as DB
User -> Form : Open login form
Form -> User : Display login form
User -> Form : Submit login form
Form -> Controller : Process login form
Controller -> DB : Retrieve user record
DB -> Controller : User record retrieved
Controller -> Form : Redirect to home page
@enduml
User Logout Sequence Diagram
@startuml
title User Logout
actor User
participant "Logout Controller" as Controller
User -> Controller : Click logout button
Controller -> Controller : Clear session data
Controller -> User : Redirect to login page
@enduml
Update User Profile Sequence Diagram
@startuml
title Update User Profile
actor User
participant "Profile Edit Form" as Form
participant "Profile Controller" as Controller
participant "User Database" as DB
User -> Controller : Open profile edit form
Controller -> Form : Populate form with user data
Form -> User : Display profile edit form
User -> Form : Submit profile edit form
Form -> Controller : Process profile edit form
Controller -> DB : Update user record
DB -> Controller : User record updated
Controller -> Form : Redirect to profile page
@enduml
Reset Password Sequence Diagram
@startuml
title Reset Password
actor User
participant "Reset Password Form" as Form
participant "Reset Password Controller" as Controller
participant "User Database" as DB
User -> Form : Open reset password form
Form -> User : Display reset password form
User -> Form : Submit reset password form
Form -> Controller : Process reset password form
Controller -> DB : Retrieve user record
DB -> Controller : User record retrieved
Controller -> Form : Display password reset instructions
@enduml
User Activity Monitoring Sequence Diagram
@startuml
title User Activity Monitoring
actor User
participant "Activity Log Controller" as Controller
participant "User Database" as DB
User -> Controller : Perform activity on site
Controller -> DB : Log user activity
@enduml
You can obtain the PlantUML schematic sources here:
- PlantUML: Sequence Diagram: Registration
- PlantUML: Sequence Diagram: Login
- PlantUML: Sequence Diagram: Logout
- PlantUML: Sequence Diagram: Profile
- PlantUML: Sequence Diagram: Password
- PlantUML: Sequence Diagram: Monitoring
Self explanatory.
Now I understand clearly. The sequence diagram looks familiar.
What is Next 🤔?
You should also consider these two in requirement:
- Testing
- Deploying
Consider continue reading [ User - Testing Artefact ].
Thank you for reading.