Preface
Goal: Starting from Requirement.
We should move on to other artefact as well as below questions:
Consider examine one, by one.
Other Artefacts
Other related diagram has been asked to ChatGPT as below questions:
If seems to be there are few thing I miss. We need more explanation, I will start from class diagram in this article, followed by use case diagram and sequence diagram next article. Test and deployment would require special section in this article series.
Constraint
Other Consideration
I know how boring it looks like reading above string. Instead of textual, we can examine the diagram right away.
Use Case Diagram
Starting from Use Case.
+----------------------------------------------------+
| User Management System |
+----------------------------------------------------+
| <<use case diagram>> |
+----------------------------------------------------+
| [Admin] |
| - Manage Users |
| - Manage Roles |
| - Manage Permissions |
| - Assign Roles to Users |
| - Assign Permissions to Roles |
| |
| [User] |
| - Login |
| - View Profile |
+----------------------------------------------------+It is still unclear to me, so I ask for the second time.
+----------------------------------------------------+
| User Management System |
+----------------------------------------------------+
| <<use case diagram>> |
+----------------------------------------------------+
| [Admin] |
| - Manage Users |
| - Manage Roles |
| - Manage Permissions |
| - Assign Roles to Users |
| - Assign Permissions to Roles |
| |
| [User] |
| - Login |
| - View Profile |
+----------------------------------------------------+
+--------+ +--------+
| Admin | | User |
+--------+ +--------+I finally get those actors.
Diagram as Image
Rewrite Diagram from Text to Image
I don’t why the actor in use case diagram has very big head. But I draw them anyway.
You can obtain the schematic source of PlantUML diagram here:
Not sure. I don’t know, what I’m doing.
Simple PlantUML
Consider examine generated PlantUML from ChatGPT. Then compare with my SVG design above.
@startuml
actor User
actor Admin
usecase Register
usecase Login
usecase Logout
usecase View Profile
usecase Edit Profile
usecase Create User (Admin)
usecase Edit User (Admin)
usecase Delete User (Admin)
User --> Register
User --> Login
User --> Logout
User --> View Profile
User --> Edit Profile
Admin --> Create User (Admin)
Admin --> Edit User (Admin)
Admin --> Delete User (Admin)
@endumlThe code above won’t work, because it use space without double quote. So I make a few tweak, and voila. The code works.
The generated diagram from draw.io can be shown as below
You can obtain the schematic source of PlantUML diagram here:
Better PlantUML
Since it is far different from my SVG. I ask again.
@startuml
title User Management System Requirements
actor User
actor Admin
rectangle "User Management System" {
rectangle "User Management" {
usecase "Register"
usecase "Login"
usecase "Logout"
usecase "View Profile"
usecase "Edit Profile"
}
rectangle "Admin Management" {
usecase "Create User (Admin)"
usecase "Edit User (Admin)"
usecase "Delete User (Admin)"
}
User --> "User Management"
Admin --> "User Management"
Admin --> "Admin Management"
}
@endumlThe code above would work with a little trick.
The generated diagram from draw.io can be shown as below
You can obtain the source SVG image here:
Since it is far different from my SVG. I ask again.
By comparation, It is far better than my diagram.
What is Next 🤔?
Remember these tree basic diagrams:
- Use Case Diagram
- Class Diagram
- Sequence Diagram
Do not just jump into coding, it is pretty bad idea. Consider draw, at least these three for any project.
Consider continue reading [ User - Class Diagram ].
Thank you for reading.