[01] LOOP
DesignmanualHardened

Landing Page Iteration

Screenshot the live site, annotate weak sections, redesign in code, commit, preview, and iterate until conversion-ready.

by Trooper

Kickoff prompt
Start the "Landing Page Iteration" loop.

Goal: landing page passes design review with preview deployed
Max iterations: 10
Between iterations run: Verify preview URL loads and annotated issues are resolved
Exit when: all annotated sections are addressed and preview is live

Step 1: Screenshot the site, annotate weak sections, redesign in code, commit, and verify preview.

## Before you start

Connect plugins:
- GitHub (required) — Read branches, PRs, reviews, checks, workflow runs, and source diffs.
- Browser / Web access (required) — Open pages, inspect live state, collect evidence, and verify changes.
- Google Analytics (required) — Read traffic, conversion, product, or campaign performance signals.
- Notion (required) — Read and update approved briefs, docs, calendars, and reports.
- Figma (required) — Inspect designs, dimensions, assets, and handoff notes.

Attach skills:
- Loop runner (required) — Self-pace iterations, run the check between passes, and stop only on the exit condition.
- Code change + local verification (optional) — Edit code safely, run commands, and keep changes scoped.
- Browser QA (optional) — Exercise product flows, capture visual evidence, and verify fixes in-browser.
- Content operations (optional) — Turn signals into reviewable briefs while preserving source attribution.
- Visual design QA (optional) — Compare implementation against visual expectations and capture regressions.

Self-pace this loop. After each iteration, run the check command, read the output, and only continue if the exit condition is not met. Stop when the exit condition passes or max iterations is reached. Give a short status update each pass.

Paste the kickoff prompt into Cursor, Claude Code, or Codex. Deeplinks do not install hook files.

Steps

1. Screenshot site

Capture the current landing page at desktop and mobile breakpoints.

2. Annotate and redesign

Mark weak hero, CTA, and social proof sections; implement improvements in code.

3. Commit and preview

Push branch, open preview deploy, and compare against prior screenshot.

Flow diagram

Guardrails

Rules the agent must follow so it cannot cheat the exit condition.

  • Do not deploy to production without explicit approval
  • Keep copy changes aligned with brand voice
  • Screenshot before and after each iteration for comparison

More Design loops