Use Case Diagram in draw.io (Actors and Use Cases)
Draw a UML use case diagram for free in draw.io. Learn how to turn on the UML shapes, draw the system boundary, place actors outside it and use cases inside it, connect them, and show an include relationship, using an online shop.
Step by step
Who uses the system
- Use case diagrams. A use case diagram shows who uses a system and what they can do with it. It's one of the first diagrams a business analyst draws. Here we build one for an online shop.
- Blank diagram. Start a blank diagram in draw.io.
- UML shapes. Click More Shapes, tick UML and click Apply. This adds the UML shapes, which include the actor and the use case.
The system boundary
- System boundary. First, draw the system boundary. Drag a Container from the General shapes onto the page, make it tall and name it after the system: Online shop.
Actors and use cases
- Actor. An actor is a role, not a person's name, and actors stand outside the boundary. Drag the Actor stick figure from the UML shapes onto the page, outside the container, and name it Customer.
- Use case. Use cases are ovals inside the boundary. Name each one with a verb and a noun. Drag a Use Case shape into Online shop and name it Browse products.
- Association. Connect the actor to the use case with a plain line. Click Customer, hold Ctrl and click Browse products, then click the Line shape in the General shapes.
- Use case. The customer also places an order, so add a second use case inside the boundary called Place order.
- Association. Connect Customer to Place order the same way.
Include
- Include. Placing an order always includes paying online. Add a third use case, Pay online, inside the boundary under Place order. An include is a dashed arrow from the main use case to the one it always uses. Connect Place order to Pay online with the Dependency line from the UML shapes, and label it «include».
- System actor. Actors can be other systems too. Add a second actor, Payment provider, which takes the money. It stands outside the boundary, on the right. Connect Pay online to Payment provider with a plain line.
- The finished diagram. Click an empty part of the page to see the finished diagram: actors outside the boundary, use cases inside it, and one include.
Recap
- The rules. The rules: actors are roles outside the boundary, use cases are verb-and-noun ovals inside it, and an include arrow points to the use case that is always used.
Common mistakes
- Naming actors after people. An actor is a role, like Customer, not a person's name. One person can play several roles, and many people can share one role.
- Putting actors inside the boundary. The boundary is the system, and actors use it from the outside. Keep every actor outside the container, including other systems like Payment provider.
- The include arrow pointing the wrong way. It goes from the main use case to the one it always uses, so from Place order to Pay online. Use the dashed Dependency line and label it «include».
- Using include for a step that only sometimes happens. Include means the step happens every time the main use case runs. For an optional step, UML uses «extend» instead.
When a business analyst uses this
In a scoping workshop, a business analyst draws the use case diagram live with stakeholders to agree who uses the new system and what it must let them do. The boundary shows the agreed scope, and each use case becomes a heading in the requirements log.
Questions people ask
What is a use case diagram?
It's a UML diagram that shows who uses a system (the actors) and what they can do with it (the use cases). Actors stand outside the system boundary, and use cases sit inside it as ovals.
How do you make a use case diagram in draw.io?
Turn on the UML shapes with More Shapes, then draw a Container as the system boundary. Add Actor shapes outside it and Use Case shapes inside it, and connect them with plain lines.
Why do we use use case diagrams?
They give everyone one simple picture of who uses the system and what it must let them do, so the scope can be agreed early. That's why a use case diagram is one of the first diagrams a business analyst draws.