wbd-state-machines-and-flowcharts

Teaches learners to draw state machines and flowcharts and distinguish entity lifecycles from process logic.

2|Updated Jun 1, 2026
One-click install
npx skills add https://github.com/jay-steenbergen/MSSAMentorAgent --skill wbd-state-machines-and-flowcharts-jay-steenbergen
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: wbd-state-machines-and-flowcharts
Source: https://github.com/jay-steenbergen/MSSAMentorAgent/tree/main/.github/skills/tracks/whiteboarding/wbd-state-machines-and-flowcharts
Command: npx skills add https://github.com/jay-steenbergen/MSSAMentorAgent --skill wbd-state-machines-and-flowcharts-jay-steenbergen

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Engineers frequently confuse state machines with flowcharts because both use boxes and arrows, producing ambiguous diagrams that miscommunicate system behavior. This Skill drills the distinction so learners can model entity lifecycles and decision logic correctly on a whiteboard. ## Core Features & Use Cases - State machine drills: Draw order lifecycles and support ticket workflows with states, event-labeled transitions, guard conditions, terminal states, and the "every state must have an exit" rule. - Flowchart drills: Build a deployment runbook with steps, labeled decision diamonds, and single-start bounded processes. - Classification practice: Five mixed scenarios train learners to pick the right diagram type using the entity-vs-process acid test. - Use Case: A learner preparing for a system design interview uses this project to whiteboard an order lifecycle state machine and a triage runbook flowchart, then explains when each diagram type applies. ## Quick Start Ask the Mentor to start the whiteboarding project on state machines and flowcharts and walk through drawing an order lifecycle diagram.

Frequently Asked Questions about wbd-state-machines-and-flowcharts

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I draw a state machine diagram?

Draw states as rounded rectangles labeled with noun-form conditions like PENDING, connect them with arrows labeled by the event that causes the transition, and mark initial and terminal states. Verify every non-terminal state has at least one exit transition.

What is the difference between a state machine and a flowchart?

A state machine models an entity's lifecycle, answering what conditions a thing can be in and how it moves between them. A flowchart models a process's logic, answering what to do step by step with decisions. If you say "the entity moves from state X to Y" use a state machine; if you say "first do X, then if Y do Z" use a flowchart.

How do I label transitions in a state machine?

Label transitions with the event that causes the change, such as payment_received or timer_expired, optionally adding guard conditions like [order_total > $50]. Never label transitions with destination state names, and avoid vague states like PROCESSING.

Why does every state in a state machine need an exit?

A non-terminal state with no outgoing transitions means instances can get permanently stuck, which maps to a real production bug like a stranded order. Walking each state and asking what events can occur exposes these dead-letter gaps before implementation.

When should I not use full UML state machine notation?

Skip hierarchical states, parallel regions, and history pseudo-states for everyday team whiteboarding; the core 80 percent covers order lifecycles, ticket workflows, and retry logic. Formal notations like Petri nets matter mainly in academic or safety-critical contexts.