Pages: Status Page
Guides status page design for communicating service health, uptime, and incidents. Typically at status.* subdomain. Reduces support during outages, builds trust.
When invoking: On first use, if helpful, open with 1–2 sentences on what this skill covers and why it matters, then provide the main output. On subsequent use or when the user asks to skip, go directly to the main output.
Initial Assessment
Check for project context first: If .claude/project-context.md or .cursor/project-context.md exists, read it for product and service components.
Identify:
- Service components: API, dashboard, billing, etc.
- Monitoring: What tools feed status (PagerDuty, Datadog, etc.)
- Audience: Customers, developers, internal
- Hosting: Self-hosted vs. third-party (Statuspage, Better Uptime, etc.)
Status Page Structure
| Section |
Purpose |
| Overall status |
Operational, Degraded, Outage, Maintenance |
| Components |
Per service: status, uptime % |
| Incidents |
Active and past; timeline, updates |
| Subscribe |
Email, SMS, RSS for notifications |
| Uptime history |
90-day or custom range (optional) |
Best Practices
Communication
- Clear status: Operational, Degraded, Partial Outage, Major Outage
- Incident updates: Timely, honest, actionable
- Post-mortem: Link to post-incident review when public
- Maintenance: Schedule ahead, notify subscribers
Design
- Scannable: Status at a glance; green/yellow/red
- Mobile: Critical for on-the-go checks
- Accessible: Color + text; don't rely on color alone
- No login required: Public status, no auth
Technical
- Independent hosting: Status page should stay up when main product is down
- Subdomain: status.yourdomain.com
- Integrations: Slack, PagerDuty, etc. for incident creation
- Historical data: Uptime %, incident count
Output Format
- Structure (components, incident format)
- Status definitions and colors
- Incident template (title, updates, resolution)
- Subscribe options
- Hosting recommendation (self vs. third-party)
Related Skills
- docs-page-generator: Link status from docs footer
- api-page-generator: Link status for developer trust
- footer-generator: Status link in footer
- 404-page-generator: Status page as utility; similar UX principles
1---2name: status-page-generator3description: When the user wants to create, optimize, or structure a status page. Also use when the user mentions "status page," "status.yourdomain.com," "uptime," "service health," "incident page," or "system status." For incident comms, use public-relations.4---5
6# Pages: Status Page
7
8Guides status page design for communicating service health, uptime, and incidents. Typically at `status.*` subdomain. Reduces support during outages, builds trust.
9
10**When invoking**: On **first use**, if helpful, open with 1–2 sentences on what this skill covers and why it matters, then provide the main output. On **subsequent use** or when the user asks to skip, go directly to the main output.
11
12## Initial Assessment
13
14**Check for project context first:** If `.claude/project-context.md` or `.cursor/project-context.md` exists, read it for product and service components.
15
16Identify:
171. **Service components**: API, dashboard, billing, etc.
182. **Monitoring**: What tools feed status (PagerDuty, Datadog, etc.)
193. **Audience**: Customers, developers, internal
204. **Hosting**: Self-hosted vs. third-party (Statuspage, Better Uptime, etc.)
21
22## Status Page Structure
23
24| Section | Purpose |
25|---------|---------|
26| **Overall status** | Operational, Degraded, Outage, Maintenance |
27| **Components** | Per service: status, uptime % |
28| **Incidents** | Active and past; timeline, updates |
29| **Subscribe** | Email, SMS, RSS for notifications |
30| **Uptime history** | 90-day or custom range (optional) |
31
32## Best Practices
33
34### Communication
35
36- **Clear status**: Operational, Degraded, Partial Outage, Major Outage
37- **Incident updates**: Timely, honest, actionable
38- **Post-mortem**: Link to post-incident review when public
39- **Maintenance**: Schedule ahead, notify subscribers
40
41### Design
42
43- **Scannable**: Status at a glance; green/yellow/red
44- **Mobile**: Critical for on-the-go checks
45- **Accessible**: Color + text; don't rely on color alone
46- **No login required**: Public status, no auth
47
48### Technical
49
50- **Independent hosting**: Status page should stay up when main product is down
51- **Subdomain**: status.yourdomain.com
52- **Integrations**: Slack, PagerDuty, etc. for incident creation
53- **Historical data**: Uptime %, incident count
54
55## Output Format
56
57- **Structure** (components, incident format)
58- **Status** definitions and colors
59- **Incident** template (title, updates, resolution)
60- **Subscribe** options
61- **Hosting** recommendation (self vs. third-party)
62
63## Related Skills
64
65- **docs-page-generator**: Link status from docs footer
66- **api-page-generator**: Link status for developer trust
67- **footer-generator**: Status link in footer
68- **404-page-generator**: Status page as utility; similar UX principles
kostja94