CREATIONAL / DESIGN PATTERNS
Factory Method.
Let a subclass choose which concrete product a creation method returns, while the surrounding workflow uses a common product contract.
An export workflow produces either a PDF or a spreadsheet.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- The common workflow asks its creation hook for a document.
- The PDF subclass supplies a PDF document. A spreadsheet subclass could supply another product.
- The workflow continues through the document contract; it does not need PDF construction details.
What is it?
Let a subclass choose which concrete product a creation method returns, while the surrounding workflow uses a common product contract.
Where it helps
Use when a framework workflow should stay stable while subclasses supply product variants.
The trade-off
A helper with a switch is a simple factory, not automatically the Factory Method pattern. Avoid a subclass hierarchy for a single fixed product.
A game menu needs matching buttons and dialogue panels for its selected theme.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- The menu receives a forest-theme factory at setup.
- Its button request returns a forest button.
- Its panel request returns a matching panel. Swap the factory to choose another complete family.
What is it?
Create a family of related products through one factory contract.
Where it helps
Use for related UI widgets, platform adapters or other products that must form a compatible family.
The trade-off
Adding a new product kind often means updating every factory. One unrelated object rarely needs a whole family factory.
CREATIONAL / DESIGN PATTERNS
Builder.
Assemble a complex object in explicit steps, separating construction from the final representation.
A character creator assembles a game avatar with equipment, colours and abilities.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- Setup tells the builder which appearance, equipment and abilities to add.
- Before finishing, the builder checks that the assembled configuration is valid.
- The completed avatar is returned. Construction details stay outside the gameplay code.
What is it?
Assemble a complex object in explicit steps, separating construction from the final representation.
Where it helps
Use when construction has meaningful stages, optional parts or several representations.
The trade-off
Validate before returning the result. A simple constructor or named options may be clearer for a small object.
A level editor duplicates a carefully configured enemy.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- The editor selects an enemy that already has the desired settings.
- Cloning makes a separate enemy with copied configuration; mutable state needs an explicit copy policy.
- The clone can share an immutable texture while keeping its own position and health.
What is it?
Create a new object by copying an existing configured object.
Where it helps
Use when configured instances are easier to copy than recreate from scratch.
The trade-off
Decide which nested objects are copied deeply and which are deliberately shared. Copying mutable references can surprise you.
CREATIONAL / DESIGN PATTERNS
Singleton.
Restrict a class to one instance within a defined scope and provide an access point to it.
Two tools ask for the same application-wide settings registry.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- Tool A requests the registry through its accessor.
- The accessor creates it once if needed, otherwise returns the existing instance.
- Tool B uses the same accessor and receives the same registry, not a second copy.
What is it?
Restrict a class to one instance within a defined scope and provide an access point to it.
Where it helps
Use sparingly when exactly one instance is a real requirement of the chosen scope.
The trade-off
Global access hides dependencies and complicates tests. A single service supplied through dependency injection is often easier to manage. Process-wide does not mean one across all servers.
A game expects a standard controller API, but an older controller reports different inputs.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- The game asks for input through its usual controller contract.
- The adapter translates that request into the old controller API.
- The translated result returns to the game. The game does not need legacy-specific calls.
What is it?
Translate an existing API into the interface a client expects.
Where it helps
Use at integration boundaries with incompatible interfaces.
The trade-off
Translation must preserve meaning, including units and errors. An adapter cannot invent a capability the old device lacks.
STRUCTURAL / DESIGN PATTERNS
Bridge.
Separate an abstraction from its implementation so both can vary independently.
Basic and advanced drawing tools can use either a screen renderer or a print renderer.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- The advanced tool adds editing features at the abstraction level.
- With a screen renderer supplied, the tool delegates drawing to it.
- Supply a print renderer instead: tool features and rendering implementations vary independently. The two renderer edges are alternatives.
What is it?
Separate an abstraction from its implementation so both can vary independently.
Where it helps
Use when two dimensions of variation would otherwise multiply subclasses.
The trade-off
It adds indirection. If only one dimension changes, simpler composition may already be enough.
STRUCTURAL / DESIGN PATTERNS
Composite.
Treat individual items and groups through a shared interface, allowing recursive structures.
A scene editor groups sprites, then groups those groups.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- Calling Draw on the scene group reaches its first sprite.
- The group also forwards Draw to its nested group using the same component contract.
- That group repeats the process for its own sprite. Recursion handles any supported nesting depth.
What is it?
Treat individual items and groups through a shared interface, allowing recursive structures.
Where it helps
Use for scene graphs, folders and nested UI structures.
The trade-off
Not every operation makes sense on both leaves and groups. Keep the common contract honest.
STRUCTURAL / DESIGN PATTERNS
Decorator.
Wrap an object to add behaviour while preserving the interface clients use.
A message sender gains compression and encryption around its basic send operation.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- The caller sends through the outer wrapper using the unchanged interface.
- Compression runs first and forwards the result to the encryption wrapper.
- Encryption forwards to the base sender. Both wrappers add behaviour without modifying the base class.
What is it?
Wrap an object to add behaviour while preserving the interface clients use.
Where it helps
Use for stackable optional behaviours such as stream processing or request middleware.
The trade-off
Wrapper order matters. Too many small wrappers can make execution hard to trace.
STRUCTURAL / DESIGN PATTERNS
Facade.
Offer a small, convenient entry point to a more complex subsystem.
A game launcher starts audio, graphics and asset loading through one launch operation.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- The launch button calls one convenient operation.
- The facade coordinates the graphics and audio setup calls.
- It also loads the required assets. The detailed subsystem APIs still exist behind the facade.
What is it?
Offer a small, convenient entry point to a more complex subsystem.
Where it helps
Use to give common workflows a straightforward API across several subsystems.
The trade-off
A facade should coordinate a useful boundary, not absorb every business rule into one giant class.
STRUCTURAL / DESIGN PATTERNS
Flyweight.
Share reusable intrinsic state between many objects, while supplying per-use state separately.
A forest renderer draws thousands of trees using shared species data.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- Each tree instance requests the same species from a pool.
- The pool reuses one oak mesh and material instead of copying them for every tree.
- The renderer receives each tree position separately. Shared shape plus per-instance placement produces the forest.
What is it?
Share reusable intrinsic state between many objects, while supplying per-use state separately.
Where it helps
Use when repeated shared state contributes materially to memory use.
The trade-off
Keep shared state immutable or carefully controlled. Positions and other per-instance values must not leak into it.
STRUCTURAL / DESIGN PATTERNS
Proxy.
Place a stand-in behind the same interface to control access to another object.
An image viewer uses a lazy proxy to delay loading a large image until it is opened.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- The viewer requests display through the proxy.
- On first use, the proxy loads the file and constructs the real image; later uses can skip loading.
- The proxy delegates display to the real image using the same interface.
What is it?
Place a stand-in behind the same interface to control access to another object.
Where it helps
Use for lazy loading, access checks or remote access behind a compatible contract.
The trade-off
Extra latency and failures should not be hidden deceptively. Proxy controls access; Decorator typically adds behaviour.
BEHAVIOURAL / DESIGN PATTERNS
Chain of Responsibility.
Pass a request through potential handlers until one handles it or the chain ends.
A support request moves from an FAQ assistant to technical support and then a specialist.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- The request enters at the FAQ handler.
- This handler cannot resolve it, so it forwards the request.
- Technical support also forwards it. The specialist handles it and the chain stops; other requests may stop earlier.
What is it?
Pass a request through potential handlers until one handles it or the chain ends.
Where it helps
Use when the appropriate handler should be selected dynamically along a chain.
The trade-off
Define what happens when nobody handles the request. Ordering matters, and handling should not silently disappear.
BEHAVIOURAL / DESIGN PATTERNS
Command.
Represent an action as an object so it can be passed around, queued or recorded.
An editor toolbar stores a move action in its undo history.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- The toolbar invokes a command rather than embedding the movement implementation.
- The command asks the shape to move and retains the previous position.
- History stores the executed command.
- Undo calls the stored command, which can restore the recorded position.
What is it?
Represent an action as an object so it can be passed around, queued or recorded.
Where it helps
Use for queues, macros, undoable actions or configurable controls.
The trade-off
Undo is not automatic: store sufficient prior state or define an inverse. Some external actions cannot safely be undone.
BEHAVIOURAL / DESIGN PATTERNS
Interpreter.
Represent a small language as expression objects that can evaluate themselves within a context.
A filter evaluates “premium AND active” against a customer record.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- The parsed AND expression evaluates its premium child.
- The terminal reads premium from the context. In this example it is true.
- AND then evaluates the active child.
- The active flag is also true, so the whole expression returns true. A false left side may short-circuit evaluation.
What is it?
Represent a small language as expression objects that can evaluate themselves within a context.
Where it helps
Use for small, stable grammars or simple expression languages.
The trade-off
Large or evolving languages usually need proper parser tooling. Parsing and evaluating are distinct stages.
BEHAVIOURAL / DESIGN PATTERNS
Iterator.
Traverse a collection through a standard protocol without exposing its internal storage.
A playlist player asks for the next track without knowing how the playlist stores tracks.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- The player advances the iterator.
- The iterator updates its own position and reads the collection using its traversal rules.
- It exposes the current track, or signals the end. The player does not inspect storage internals.
What is it?
Traverse a collection through a standard protocol without exposing its internal storage.
Where it helps
Use for collections, streams and custom traversal orders.
The trade-off
Define end-of-sequence and mutation behaviour. An iterator may be lazy or one-use; do not assume it can restart.
BEHAVIOURAL / DESIGN PATTERNS
Mediator.
Route interactions between related objects through a coordinator instead of connecting every object directly to every other.
A booking form coordinates its date picker, availability panel and submit button.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- The date picker informs the mediator instead of knowing every other control.
- The mediator requests an availability update.
- The availability panel reports a valid slot selection.
- The mediator enables submission once the required form conditions are satisfied.
What is it?
Route interactions between related objects through a coordinator instead of connecting every object directly to every other.
Where it helps
Use for complex UI interactions or tightly connected collaboration workflows.
The trade-off
The mediator can become oversized. Keep domain rules in their proper components.
BEHAVIOURAL / DESIGN PATTERNS
Memento.
Capture an object’s state so it can later be restored without exposing that state’s internals to the keeper.
A drawing editor saves a snapshot before a complicated edit.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- Before editing, the editor creates a snapshot of its own state.
- History stores it without reaching into its contents.
- An undo action retrieves the checkpoint.
- The editor restores itself from the snapshot. The caretaker never needed to know the internal representation.
What is it?
Capture an object’s state so it can later be restored without exposing that state’s internals to the keeper.
Where it helps
Use for checkpoints and undo where an object can safely snapshot and restore itself.
The trade-off
Snapshots may be costly. Decide what is copied, how long it is retained and whether external resources can be restored.
A game score update refreshes the scoreboard and achievement tracker.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- The score changes and the model raises a notification.
- The subscribed scoreboard updates its display.
- The achievement tracker also reacts. The subject does not need each subscriber’s concrete implementation.
What is it?
Let subscribers receive notifications when a subject changes.
Where it helps
Use for event-driven updates with multiple interested listeners.
The trade-off
Manage subscriptions and lifetimes. Ordering, re-entrant updates and errors need explicit rules; events are not automatically asynchronous.
BEHAVIOURAL / DESIGN PATTERNS
State.
Delegate state-dependent behaviour to state objects, changing the active state as the object transitions.
A music player responds differently to Play while paused or already playing.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- The player initially delegates to Paused.
- Pressing Play asks the audio engine to start.
- The context switches to Playing.
- Another Play request reaches Playing and does not restart the track. Behaviour follows the current state.
What is it?
Delegate state-dependent behaviour to state objects, changing the active state as the object transitions.
Where it helps
Use when several operations vary across meaningful states and transitions.
The trade-off
A small enum and switch may be clearer for a simple lifecycle. Keep transition ownership explicit.
BEHAVIOURAL / DESIGN PATTERNS
Strategy.
Encapsulate interchangeable algorithms behind a common contract and let a context use the selected one.
A route planner switches between fastest and scenic routing.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- The planner receives the fastest-route strategy and delegates calculation.
- That algorithm returns a route.
- The caller selects the scenic strategy instead; the planner’s delegation code stays the same.
- The new algorithm returns its alternative route through the same contract.
What is it?
Encapsulate interchangeable algorithms behind a common contract and let a context use the selected one.
Where it helps
Use when clients need a choice of algorithms without a growing conditional in the context.
The trade-off
The caller still needs a way to choose the strategy. State changes behaviour with lifecycle; Strategy usually represents a selected approach.
BEHAVIOURAL / DESIGN PATTERNS
Template Method.
Define an algorithm’s fixed sequence in a base class while allowing subclasses to customise selected steps.
A data importer always reads, parses and saves, but CSV and JSON importers parse differently.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- The template method begins with its shared read step.
- It calls the parsing hook implemented by the CSV subclass.
- It then saves using the shared final step. The subclass changes parsing, not the workflow order.
What is it?
Define an algorithm’s fixed sequence in a base class while allowing subclasses to customise selected steps.
Where it helps
Use when a shared workflow has controlled variation through inheritance.
The trade-off
Subclasses are coupled to the base workflow. Strategy may be better when behaviour needs runtime composition.
BEHAVIOURAL / DESIGN PATTERNS
Visitor.
Add operations to a stable object structure by passing a visitor whose methods handle each concrete element type.
An editor exports circles and rectangles without placing export logic inside every shape.
Arrows show the labelled relationships. The highlighted connection shows the current step. Select a node to explore its role.
Follow the flowSelect a node, or step through the example below.
Read every step
- Traversal passes the export visitor to a circle’s Accept method.
- The circle calls VisitCircle, selecting the type-specific export operation.
- Traversal next passes the same visitor to a rectangle.
- The rectangle calls VisitRectangle. Together these calls supply the output without putting export rules into the shapes.
What is it?
Add operations to a stable object structure by passing a visitor whose methods handle each concrete element type.
Where it helps
Use when element types are stable but new operations are added frequently.
The trade-off
Adding a new element type usually requires changing every visitor. Access to element details can weaken encapsulation.