← ClaudeAtlas

okhp3-replit-canvas-boardlisted

Plan and build a structured multi-frame Replit canvas presentation board — hero rows, labeled zones, iframe lifecycle (building→live), coordinate layouts, and focusCanvasShapes for audience navigation. Use when organising the canvas for a designathon, showcase, or any multi-frame review. Also activate for "arrange the frames", "set up the board", "label the zones", "focus the viewport", or any canvas layout that needs deliberate spatial planning rather than ad-hoc placement.
OKHP3/skillz · ★ 3 · Web & Frontend · score 72
Install: claude install-skill OKHP3/skillz
# okhp3-replit-canvas-board **OverKill Hill P³** · [overkillhill.com](https://overkillhill.com) · [github.com/OKHP3](https://github.com/OKHP3) A portable Replit Agent Skill for planning and organising the workspace canvas as a **structured presentation board** — not just placing shapes, but producing a layout that a judge, reviewer, or collaborator can scan in under 30 seconds. This skill sits *above* the raw canvas skill API. It teaches layout strategy; the canvas skill (`read .local/skills/canvas/SKILL.md`) teaches the callbacks. --- ## Scope | In scope | Out of scope | |---|---| | Zone planning, hero rows, gutter math | Canvas callback schemas — read the canvas skill | | iframe building→live lifecycle for audience UX | Component authoring — read the mockup-sandbox skill | | Section label shape conventions | Extracting existing components — read mockup-extract | | focusCanvasShapes as a presentation close | Graduating mockups to production — read mockup-graduate | --- ## Coordinate system - Origin `(0, 0)` is **top-left**. - Positive `x` goes right, positive `y` goes down. - Artifact frames are pre-placed by Replit and **cannot be resized or deleted** — they can be moved. - Design/mockup iframe sizes are set by you and can be anything. --- ## The two board modes **Building mode** — iframes scattered wherever the last task dropped them. The canvas is a work surface, not a presentation. This is fine while building. **Presentation mode** — iframes in deliberate zo