This sequence diagram starts when a user visits a login page. The ​​user enters their username and password and hits the login button. The login page sends a message to the database with the user login data to be checked. Once the database has checked the username and password, two possible paths emerge (alternative fragment). If the login data is correct, the database sends a message that the user login has been accepted. If the login data was incorrect, the system sends the user a message indicating so. The system clears the password field. Then the user can enter the password again.

User login page

User login diagram code in Gleek

User -Visit->+ Login page
User -Enter a username/password-> Login page
User -Login-> Login page
Login page -Send username/password hash->- Database
Database -Validate user data-> Database

/alt Login data is correct
Database -. User login accepted->+ Login page
Login page -Redirect-> Login page
Login page -. Successful login (message)->- User

/else Login data is incorrect
Database -. User login rejected->+ Login page
Login page -Redirect-> Login page
Login page -. Clear the password field-> User

About sequence diagrams

Sequence or event diagrams help create an overview of how a system works. Sequence diagrams show how all the different parts interact with each other over time, carry out the required actions, and complete processes. A sequence diagram descends from top to bottom showing a sequence of interactions and sequence diagram notations.

Similar sequence diagram examples

Online shopping sequence diagram

Sales process sequence diagram

Notes template sequence diagram

State synchronisation sequence diagram

ATM withdrawal sequence diagram