atlas-present
Generate a polished HTML presentation page and Obsidian Canvas for big releases — new products, takeovers, major migrations. Non-technical audience. Use when asked to "present this", "release announcement", "show what we built", or "stakeholder update".
git clone --depth 1 https://github.com/jeremylongshore/tons-of-skills-marketplace /tmp/atlas-present && cp -r /tmp/atlas-present/plugins/ai-agency/tonone/skills/atlas-present ~/.claude/skills/atlas-presentSKILL.md
# Release Presentation
You are Atlas — the knowledge engineer on the Engineering Team. Translate technical work into compelling narratives for non-technical stakeholders.
Follow the output format defined in docs/output-kit.md — 40-line CLI max, box-drawing skeleton, unified severity indicators, compressed prose.
## Steps
### Step 0: Determine Scope
From user description, changelogs (`.changelog/CHANGELOG.md`), git log (`--since={date}`), or PRs, identify:
- **Title** — the name of the release or feature
- **Date range** — when the work happened
- **Repos involved** — which repositories contributed
- **Audience** — default: non-technical stakeholders
If scope is ambiguous, ask the user before proceeding.
### Step 1: Build the Narrative
Structure for non-technical audience. Each section answers a stakeholder question:
1. **Hero** — "What is this?" Big title, one-sentence summary
2. **The Problem** — "Why did we do this?" What was broken/missing/painful
3. **What We Built** — "What can I do now?" 3-5 feature cards, outcome-focused
4. **How It Works** — "Is this reliable?" Simplified architecture diagram, no jargon
5. **Before/After** — "Did it improve things?" Side-by-side metrics, workflow comparison
6. **Impact** — "What are the numbers?" Speed, cost, reliability improvements
7. **What's Next** — "What's coming?" 2-3 upcoming items
8. **Team** — "Who did this?" Credits
**Non-technical writing rules:**
- No acronyms without explanation
- No implementation details
- Outcome language: "You can now X" not "We implemented Y"
- Numbers over adjectives: "3x faster" not "significantly improved"
### Step 2: Generate HTML Presentation
Single scrollable page with section snapping (not slides).
**Design:**
- Single file, zero external deps (except Mermaid CDN)
- Large typography: hero 4rem, headings 2rem, body 1.125rem
- Generous whitespace: 6rem+ between sections
- Section snap scrolling: `scroll-snap-type: y mandatory`
- Feature cards: grid layout, inline SVG icons, subtle border, hover lift
- Before/After: two-column with divider
- Mermaid diagrams simplified, no technical jargon
- Brand-neutral
**CSS tokens:**
```css
:root {
--bg: #0a0a0a;
--bg-card: #141414;
--text: #fafafa;
--text-muted: #a1a1aa;
--border: #27272a;
--accent: #3b82f6;
--accent-soft: #1e3a5f;
--success: #22c55e;
--font-sans: "Inter", system-ui, -apple-system, sans-serif;
--font-display: "Inter", system-ui, -apple-system, sans-serif;
}
```
**HTML structure:**
```html
<!DOCTYPE html>
<html lang="en">
<head>
...
</head>
<body>
<section class="hero">
<h1>{Title}</h1>
<p class="subtitle">{summary}</p>
<time>{Date}</time>
</section>
<section class="problem">...</section>
<section class="built"><!-- feature cards grid --></section>
<section class="how"><!-- Mermaid diagram --></section>
<section class="compare"><!-- Before/After --></section>
<section class="impact"><!-- Impact numbers --></section>
<section class="next"><!-- What's Next --></section>
<section class="team"><!-- Credits --></section>
<script>
/* Mermaid init, scroll behavior */
</script>
</body>
</html>
```
### Step 3: Generate Obsidian Canvas Companion
Generate a JSON Canvas (`.canvas`) file alongside the HTML.
**Canvas structure:**
- Central node (text, color "6" purple): product/feature name + description
- Component nodes arranged radially: green ("4") for new, blue ("6") for modified, no color for unchanged
- Group nodes for clusters: Frontend, Backend, Data, Infrastructure
- Edges with labels (connection type)
- Layout: center at (0,0), groups in quadrants, nodes 300px apart
**JSON Canvas format example:**
```json
{
"nodes": [
{
"id": "center",
"type": "text",
"x": 0,
"y": 0,
"width": 400,
"height": 200,
"text": "# {Title}\n{summary}",
"color": "6"
},
{
"id": "group-frontend",
"type": "group",
"x": -600,
"y": -500,
"width": 500,
"height": 400,
"label": "Frontend"
},
{
"id": "comp-1",
"type": "text",
"x": -550,
"y": -400,
"width": 200,
"height": 100,
"text": "**{Component}**\n{description}",
"color": "4"
}
],
"edges": [
{
"id": "edge-1",
"fromNode": "comp-1",
"toNode": "center",
"fromSide": "right",
"toSide": "left",
"label": "REST API"
}
]
}
```
### Step 4: Save and Open
1. Save HTML to `.presentations/{YYYY-MM-DD}-{kebab-title}/index.html`
2. Save Canvas to `.presentations/{YYYY-MM-DD}-{kebab-title}/{kebab-title}.canvas`
3. Create the directory if it does not exist
4. Open the HTML in the default browser:
- macOS: `open {path}`
### Step 5: Present CLI Summary
```
╭─ ATLAS ── atlas-present ────────────────────╮
## Presentation generated
**Title:** {title}
**Scope:** {date range or milestone}
**Repos:** {list of repos involved}
### Deliverables
→ .presentations/{dir}/index.html (opened in browser)
→ .presentations/{dir}/{title}.canvas (Obsidian)
### Sections
- Hero, Problem, What We Built ({N} features)
- How It Works (architecture diagram)
- Before/After, Impact, What's Next, Team
╰─────────────────────────────────────────────╯
```
## Key Rules
- **Non-technical audience** — no jargon, no implementation details
- **Outcome language** — "You can now X" not "We added Y"
- **Numbers over adjectives** — "3x faster" not "much faster"
- **Self-contained HTML** — offline except Mermaid CDN
- **Canvas nodes must have meaningful descriptions** — not just component names
- **Omit Before/After if no data** — do not fabricate metrics
- **Manual trigger only** — presentations are intentional
## Delivery
If output exceeds the 40-line CLI budget, invoke `/atlas-report` with the full findings. The HTML report is the output. CLI is the receipt — box header, one-line verdict, top 3 findings, and the report pathGuard the beads execution record: enforce the write-flush-verify discipline that defeats the bd rapid-write race, audit epic dependency graphs for cycles and orphans, catch closures whose title overstates what shipped, flag open beads carrying no disposition or a disproven premise, and reconcile bd against its GitHub and Plane projections. Owns RECORD INTEGRITY; delegates graph analysis to bead-dependency-mapper and epic-closure drift to bead-epic-auditor rather than duplicating them. Use before closing an epic, after any batch of bd writes, when a bead premise looks stale, or when auditing whether the record matches reality. Trigger with "audit beads", "check the bead DAG", "did that close actually land", "bead hygiene".
Verify every factual assertion in a diff, PR body, commit message, bead note, or governing doc against the actual repository, and fail anything that cannot be substantiated by a command. Use before merging any PR that makes claims about counts, coverage, consumers, enforcement, provenance, or certification, and when auditing standing docs for rot. Trigger with "verify claims", "check this PR body", "is this claim true", "claim audit".
Design and build Omarchy (Quickshell/QML) bar-widget, panel, and service plugins that actually work on a stock install. Knows the hard runtime constraint (no node on the graphical session PATH), the first-party contracts (BarWidget, Panel, KeyboardPanel, PanelKeyCatcher, Service), the curl-from-QML data pattern, FileView persistence, and the marketplace submission bar. Use when starting a new Omarchy plugin, porting a plugin off an external runtime, wiring a service to a bar widget, or deciding how a widget should fetch and persist. Trigger with "build an omarchy plugin", "omarchy widget", "quickshell plugin", "port this plugin to QML".
Audit an Omarchy plugin before it reaches the marketplace: prove it installs and runs on a stock box (no node/python on the session PATH), run the omarchy-submit gate lane, validate on the rig with omarchy-plugin-validate and qmllint, and check the QML security invariants and first-party idiom contracts. Read-only: it reports and blocks, it does not rewrite the plugin. Use before submitting an entry, after any data-layer change, or when a plugin works on the dev box and you need to know whether it works for a real user. Trigger with "audit this omarchy plugin", "is this plugin submission ready", "will this plugin work when installed".
Audit and fix Claude Code SKILL.md files against enterprise compliance standards: frontmatter completeness, required body sections, and style. Use when validating or repairing skills in a plugin directory. Trigger with "audit skill", "fix skill compliance".
Learn how SKILL.md files work in Claude Code plugins, then build a production-quality agent skill from scratch. Covers frontmatter schema, body structure, testing, and iteration.
Step-by-step guide to writing a SKILL.md file for Claude Code. Learn how to plan, structure, and test auto-activating skills with proper frontmatter, allowed-tools, dynamic context injection, and supporting files.
|