Diagram template

UML class diagram template

Model the structure of your code: classes with their fields and methods, the interfaces they implement and how they relate.

Use this template for free All templates
  • An interface and two implementations
  • Fields and methods in each class
  • Realisation arrows
  • Class shapes ready to copy
A UML class diagram in Starlex with a Repository interface implemented by PgRepository and MemoryRepository

What is a UML class diagram?

The class diagram is the most used of the UML (Unified Modeling Language) diagrams. Each class is a box in three parts: the name, the attributes and the operations. Lines between classes show relationships such as inheritance, implementation, association and composition. Class diagrams help in design reviews and when explaining a codebase.

What is in the template

  • Repository: an interface with find and save operations.
  • PgRepository: an implementation backed by a PostgreSQL connection pool.
  • MemoryRepository: an in-memory implementation, handy for tests.
  • Realisation arrows (dashed with a hollow head): both classes implement the interface.

Reading the notation

  • Visibility: + for public, - for private, # for protected.
  • Inheritance: a solid line with a hollow triangle pointing at the parent.
  • Implementation: a dashed line with a hollow triangle pointing at the interface.
  • Association: a plain line, often with multiplicities such as 1 and *.
  • Composition: a filled diamond at the owner's end.

Tips

  • Show only the classes needed to explain the idea. A diagram of every class is unreadable.
  • Leave out getters and setters unless they matter.
  • Keep the diagram next to the design issue or doc, where the discussion happens.

Use this template in Starlex

Open a project, go to Notes, then Diagrams, choose New diagram and pick UML class diagram. To add it to a diagram you already have, use Insert, then From template.

  • More than a hundred shapes, with connectors that stay attached when you move things.
  • Pages and layers for large diagrams, and automatic tree, grid and circle layouts.
  • Import draw.io files and Mermaid flowcharts, and export to PNG, SVG or draw.io.
  • Embed the diagram in an issue or a note, where it always shows the latest version.

Frequently asked questions

What do the three parts of a class box mean?

The top holds the class name, the middle its attributes or fields, and the bottom its operations or methods.

What does a dashed arrow with a hollow triangle mean?

Realisation: the class implements the interface the arrow points to.

Does Starlex support other UML diagrams?

Yes. The diagram editor includes UML shapes, and there is a sequence diagram template too.