Skip to main content
SDMastery

How to Draw System Design Diagrams in Interviews

A practical guide to drawing clear system design diagrams in interviews. Covers component notation, arrows, labels, and iterating under pressure.

Why Diagrams Matter More Than You Think

Interviewers cannot see your mental model — they can only see what you put on the whiteboard or shared screen. A clear diagram is not just visual polish. It forces you to make your architecture concrete, reveals gaps you had not noticed, and gives the interviewer something specific to ask about. Engineers who draw vague blobs connected by unlabeled arrows consistently score lower than those who use precise notation, even when their underlying thinking is equivalent.

The Four Components Every Diagram Needs

Every system design diagram communicates the same four things:

  1. Actors — who or what initiates requests (users, mobile clients, partner services)
  2. Services — the processing units (API gateway, application servers, worker processes)
  3. Storage — where data persists (databases, caches, object storage, queues)
  4. Connections — how data flows between them (synchronous calls, async events, replication)

If your diagram is missing any of these four, you have an incomplete picture.

Notation Conventions That Interviewers Recognize

You do not need UML. Use simple, readable shapes:

  • Rectangle → service or application server
  • Cylinder → database or persistent storage
  • Queue shape (rectangle with rounded left) → message queue
  • Cloud/pentagon → CDN or external service
  • User icon or stick figure → client/user

Label every box with a name AND its technology if relevant: "API Gateway (Kong)" or "Cache (Redis)". An unlabeled box forces the interviewer to ask what it is, which wastes your time.

Arrow Conventions

Arrows are the most under-used tool in system design diagrams. Use them precisely:

  • Solid arrow → synchronous request/response (HTTP, gRPC)
  • Dashed arrow → asynchronous message or event
  • Double arrow → bidirectional communication (WebSocket)
  • Arrow label → always label what the arrow carries: "POST /order", "read replica sync", "user events"

A diagram with five unlabeled arrows is almost useless. Five labeled arrows tell a story.

The Three-Phase Approach to Drawing Live

Drawing under interview pressure causes engineers to freeze or over-plan. Use this three-phase approach instead:

Phase 1: Rough sketch (2 minutes) Draw the major boxes first — client, API layer, database. Do not worry about detail. This gives you and the interviewer a shared vocabulary for the next 20 minutes.

Phase 2: Fill in the data flows (5 minutes) Add arrows for the critical paths you discussed. Start with the happy path (successful request end-to-end). Then add the write path if it differs from the read path.

Phase 3: Add infrastructure details (ongoing) Add load balancers, caches, queues, and replicas as the conversation evolves. Do not add these upfront — add them when you explain why they are needed.

Common Diagramming Mistakes

Mistake 1: Drawing a perfect diagram before talking Some engineers spend 5 minutes silently drawing. Interviewers cannot evaluate your thinking during silence. Draw rough, narrate constantly.

Mistake 2: One giant monolith box Drawing "Backend Service" as a single box hides all the interesting design decisions. Break it into logical services, even if simplified.

Mistake 3: No scale indicators Write approximate scale next to components: "10K req/s at peak", "50M users", "1TB/day writes". This shows you are designing for real requirements, not a toy.

Mistake 4: Database without access pattern Every database box should hint at why you chose it: "PostgreSQL — relational user data with ACID requirements" or "Cassandra — write-heavy time-series, eventual consistency acceptable".

Mistake 5: Ignoring the read path vs write path Many systems have asymmetric read and write paths. Show both if they differ — a read path that hits a cache before the database tells a completely different story than one that always hits primary storage.

What to Put on the Diagram vs What to Say Out Loud

Not everything belongs on the diagram. Use this split:

On the diagram: components, connections, data stores, scale numbers, technology labels Out loud (not drawn): why you chose each component, tradeoffs, failure modes, future evolution

A good interview is a conversation with the diagram as the shared artifact. You should be talking about the diagram, not drawing silently.

Iterating Your Diagram

The best engineers update their diagram as the conversation evolves. When the interviewer says "what happens if the database goes down?" — update the diagram to show the replica failover. When they ask about scale — add the load balancer and sharding indicators. A diagram that evolves shows active thinking. A static diagram drawn at minute 5 and never touched again shows rigid thinking.

Interview Tips for Diagrams

  1. Start with the client and work inward — always establish who is calling what before drawing the internals.
  2. Ask before drawing — "Should I show the read path or write path first?" signals structured thinking.
  3. State your assumptions out loud — "I am assuming requests are stateless, so I can scale horizontally."
  4. Number your components — "Step 1: client hits API gateway. Step 2: gateway checks auth cache..." makes the diagram walkable.
  5. Leave space — draw with room to add. A cramped diagram that cannot evolve is a problem.