Figure out the flow
Get a handle on your site
Focus on the critical path
Walk in their boots
Sketch your domain
Tease out the logic
Come up with your master plan
Get the aces in their places
Understand where the magic is
Rank by what matters
Slice up the data
Capture the breakdown
Navigate the org
Find patterns in the noise
Decide what's hot
Sequence Diagram Sitemap PERT Diagram Journey Map Class Diagram Flowchart Gantt Chart RACI Matrix Line Chart Quadrant Chart Pie Chart Stacked Bar Chart Org Chart Scatter Plot Tech Radar
sequence Checkout Flow
active-tag Team
tag Team as t
Web red
Backend blue
Vendor green
User
App | t: Web
[Backend] | t: Backend
API
Orders
Inventory
DB
Stripe | t: Vendor
User -click checkout-> App
App -POST /orders-> API
note
- validate cart
- check session
API -createOrder-> Orders
Orders -reserveStock-> Inventory
if stock available
Inventory -OK-> Orders
Orders -POST /charge-> Stripe
Stripe -charge_id-> Orders
Orders -writeOrder-> DB
DB -order_id-> Orders
Orders -201 Created-> API
API -receipt-> App
App -Show receipt-> User
else
Inventory -out of stock-> Orders
Orders -409 Conflict-> API
API -error-> App
App -Sorry, sold out-> User
== Notify ==
Orders ~order.placed~> DB
Orders ~analytics~> API
sitemap Pirate Bay Trading Co.
tag Access
Public green
Crew blue
Captain red
tag Page
Landing purple
Form orange
Content cyan
Home | Access: Public, Page: Landing
-shop-> Shop
-join-> Enlist
-map-> Treasure Map
[Port]
Shop | Access: Public, Page: Content
-buy-> Checkout
Checkout | Access: Crew, Page: Form
-done-> Ship Log
[Crew Quarters]
Enlist | Access: Public, Page: Form
-enlisted-> Ship Log
Ship Log | Access: Crew, Page: Content
-voyage-> Treasure Map
Treasure Map | Access: Captain, Page: Content
pert Pirate Voyage to the Atoll
time-unit w
default-confidence medium
voyage approved 0
-> recruit crew
[outfit ship]
recruit crew 1 2 4 as rc
-> load powder
careen hull 1.5
-> load powder
load powder 0.5 1 2
-> sail to atoll
sail to atoll 5
-> count gold
-> repair hull
count gold 1 2 3
-> divvy shares
repair hull 3
-> divvy shares
divvy shares 1 2 3
journey-map Buying a Treasure Map
persona Calico Jack | color: red
Captain hunting lost Spanish gold
tag Source as s
Tavern yellow
Black Market purple
Scholar blue
Hear of the lost map | 5 Excited, s: Tavern
thought: A drunkard claims his uncle saw the original
description: Rumors of the Cortez map surface in port
Bargain with the dealer | 1 Furious, s: Black Market
pain: Dealer demands 5,000 doubloons up front
pain: Three other captains are bidding
thought: This man would sell his own mother
Verify the parchment | 2 Anxious, s: Scholar
pain: The scholar suspects a clever forgery
opportunity: A second expert could give a tiebreaker
thought: Years of plunder rest on a slip of vellum
Discover hidden ink | 5 Triumphant, s: Scholar
description: Heat reveals a second layer of markings
opportunity: The hidden coords point to a different cove
thought: The forger missed it — but we didn't
class Pirate Ship Hierarchy
interface Vessel cyan
+ sail(): void
+ anchor(): void
abstract Ship implements Vessel purple
# name: string
# crew: number
+ getName(): string
Galleon extends Ship green
- cannons: number
+ fire(): void
Sloop extends Ship orange
- speed: number
+ flee(): void
enum ShipType yellow
Galleon
Sloop
Frigate
Ship
-> ShipType has type
flowchart Order Processing
(Receive Order) -> <Have Inventory?>
-yes-> [Ship] -> [[Process Payment]] -> (End)
-no-> [Send wait email] -> (End)
gantt Product Launch Plan
start 2024-01-15
today-marker 2024-03-01
critical-path
dependencies
tag Team as t
Engineering blue
Design purple
QA orange
era 2024-01-15 -> 2024-02-15 Investor Review
marker 2024-02-26 Board Meeting
10bd Brand Guidelines | t: Design, offset: 8bd
parallel
[Backend] | t: Engineering
30bd Database Layer | 80%
10bd? Auth Module | 100%
parallel
5bd Load Testing | t: QA
5bd Security Audit | t: QA
[Frontend] | t: Design
15bd Component Library
10bd API Integration | t: Engineering
5bd Polish | 30%
[UX Research] | t: Design
10bd User Interviews
5bd Persona Updates
8bd Usability Testing | t: QA
[Integration] | t: QA
10bd E2E Testing
5bd Regression Suite
0d Release Candidateraci Q3 Product Launch
roles
PM | color: red
Eng | color: blue
UX | color: green
Mkt | color: orange
Sales | color: purple
[Discovery] | color: teal
Define the problem
PM: A R
UX: C
Eng: I
Customer interviews
PM: A
UX: R
Mkt: C
[Build] | color: blue
Spec the API
Eng: A R
PM: C
Ship the prototype
Eng: A R
UX: C
PM: I
Design system updates
UX: A R
Eng: C
[Launch] | color: green
Pricing & positioning
Mkt: A R
PM: C
Sales: C
Sales enablement
Sales: A R
Mkt: C
Eng: I
Public launch
Mkt: A R
PM: C
Sales: C
line Weekly Active Users
series Free blue, Pro green, Team orange
x-label Week
y-label Users (thousands)
era Week 1 -> Week 4 Soft Launch
era Week 5 -> Week 8 Public Launch teal
Week 1 8.2 1.1 0.3
Week 2 9.5 1.6 0.5
Week 3 11.8 2.4 0.9
Week 4 13.4 3.3 1.4
Week 5 18.7 5.1 2.6
Week 6 22.1 7.4 3.8
Week 7 24.6 9.2 4.9
Week 8 27.3 11.6 6.4
quadrant Crew Performance Assessment
x-label Low Skill, High Skill
y-label Low Loyalty, High Loyalty
top-right Promote green
top-left Train cyan
bottom-left Marooned red
bottom-right Watch orange
Quartermaster 0.9 0.95
Navigator 0.85 0.8
Gunner 0.7 0.6
Surgeon 0.8 0.75
Boatswain 0.6 0.85
Cook 0.4 0.9
New Recruit 0.2 0.5
Troublemaker 0.65 0.2
Spy 0.8 0.1
pie Browser Market Share (2025)
Chrome 63.5
Safari 19.8
Firefox 6.2
Edge 5.1
Other 5.4 bar-stacked Support Tickets
x-label Month
y-label Tickets
series
High orange
Medium yellow
Low green
Info blue
January 8 24 45 62 31
February 12 19 51 58 28
March 6 22 38 71 35
April 10 28 42 65 40org Small Startup
active-tag Title
tag Title as t
CEO red
VP blue
Manager green
SWE purple
Jane Smith | t:CEO
Alex Chen | t:VP
Jeff Smith | t:Manager
[Platform]
Kevin Anderson | t:SWE
Kim Evans | t:SWE
Bob Blevins | t:Manager
Maria Lopez | t:VP
Sam Wilson | t:VPscatter Product Portfolio FY24
size-label Revenue $M
x-label Market Share %
y-label Growth Rate %
[SaaS] blue
Analytics 28 22 60
CRM Suite 42 14 85
Data Cloud 18 28 45
[Hardware] green
Network Gear 35 6 55
Edge Devices 12 18 25
Servers 48 4 75
[Services] red
Consulting 22 12 40
Support 38 8 50
Training 14 6 30
tech-radar Pirate Tech Radar — Q2 1718
rings
Full Sail
Trial Run
Spyglass
Davy Jones
Tactics | quadrant: top-right
Boarding Parties | ring: Full Sail, trend: stable
Ambush at Dawn | ring: Full Sail, trend: stable
Decoy Flags | ring: Trial Run, trend: up
Smoke Screens | ring: Trial Run, trend: new
Night Raids | ring: Trial Run, trend: up
Kraken Diplomacy | ring: Spyglass, trend: new
Cannon Volleys | ring: Full Sail, trend: stable
Ramming | ring: Davy Jones, trend: down
Vessels | quadrant: top-left
Brigantine | ring: Full Sail, trend: stable
Sloop | ring: Full Sail, trend: up
Schooner | ring: Full Sail, trend: stable
War Galleon | ring: Trial Run, trend: up
Frigate | ring: Spyglass, trend: new
Junk Rig | ring: Spyglass, trend: new
Longboat | ring: Davy Jones, trend: down
Raft | ring: Davy Jones, trend: down
Plunder | quadrant: bottom-left
Merchant Convoys | ring: Full Sail, trend: stable
Spanish Treasure | ring: Full Sail, trend: stable
Port Raids | ring: Trial Run, trend: up
Rival Pirates | ring: Trial Run, trend: new
Royal Treasury | ring: Spyglass, trend: new
Whaling Ships | ring: Spyglass, trend: stable
Fishing Villages | ring: Davy Jones, trend: down
Crew Welfare | quadrant: bottom-right
Grog Rations | ring: Full Sail, trend: stable
Code of Conduct | ring: Full Sail, trend: stable
Parrot Companions | ring: Full Sail, trend: up
Sea Shanties | ring: Trial Run, trend: new
Dental Plan | ring: Spyglass, trend: up
Retirement Fund | ring: Spyglass, trend: new
Plank Walking | ring: Davy Jones, trend: down