This repository was archived by the owner on Jul 10, 2026. It is now read-only.
feat: populate-landing + claude-design skills for venture landing pages#7
Merged
Conversation
Extends /bootstrap pipeline to generate backend + app + landing from a single brief.md. Landing template (.claude/templates/landing/) — anonymized Next.js 16 + React 19 + Tailwind v4 app derived from web-landing-app: - All Privara-specific text, assets and brand references removed - Centralized content schema in src/content/site.ts (nullable by design) - Each section and page renders only when brief-populated - Generative decor (CSS gradients + Phosphor icons) replaces all JPG/PNG - New pitch sections: MetricsBanner, ProblemSection, ProtocolFlow, BusinessModel, FiveYearArc, CompetitiveAdvantage - Dynamic /p/[slug] route for up to 2 venture-specific custom pages - Generic letter-mark logo + favicon driven by branding.faviconInitial Skill + pipeline: - .claude/skills/build/scaffold-landing/SKILL.md with brief→site.ts mapping + design rules - .claude/agents/_builder.md pipeline extended with /scaffold-landing step - .claude/commands/bootstrap.md Phase 2 now includes landing scaffold - brief.template.md extended with Branding, Landing Sections, Pages, Custom Pages sections Validation: - test-briefs/agrilend.md, freightvault.md, blindference.md — three end-to-end briefs - Template builds cleanly (pnpm build) and serves on pnpm dev (HTTP 200) - grep verifies no Privara references remain in src/ or public/
- site.ts now uses home.sections: SectionBlock[] ordered array instead of named slots - 13 layout primitives in components/blocks/: prose, stat-strip, bullets, steps, cards, comparison, data-grid, timeline, tagline, cta, faq, contact, legal - <Block> dispatcher routes by kind; any brief can compose any page - Universal /[slug] route replaces per-page tsx files (/business, /mobile, etc.) - Adaptive tables in data-grid and comparison: desktop grid, tablet 2-col, mobile stack - LogoWithText: text-only wordmark, no icon/square - Removed all hardcoded semantic components (MetricsBanner, ProblemSection, ProtocolFlow, BusinessModel, FiveYearArc, CompetitiveAdvantage, Features, HowItWorks, Products, HeroStats, MarketOpportunity, WhatFHEEnables, TheAsk) - Old per-page layouts (LegalLayout, BusinessView, MobileView, ContactView, CustomPageView) consolidated into single [slug]/PageView
- /claude-design skill orchestrates two global plugin skills (frontend-design, tailwind-design-system) to polish landing design after scaffold-landing - Content audit + aesthetic direction + token generation + composition tuning - Records decisions in src/content/design.ts alongside site.ts - All block components now pass block.id to their root <section> element, enabling nav anchor links (#problem, #market, etc.) to work - Added scroll-mt-20 to compensate sticky header - _builder.md pipeline: scaffold-landing → claude-design → brand → cleanup - bootstrap.md Step 1c added
Lock the landing template to a single editorial direction (analytical pitch-deck aesthetic) and layer on content-driven motion primitives: - Remove industrial/minimal direction presets; editorial becomes :root default - Generate 9-step accent scale from branding.accent HEX (50..900 CSS vars) - Add wow-effect primitives: CountUp, TextReveal, ScrollProgress, SectionNumber, RuleLine (respect prefers-reduced-motion) - Hero: per-word text-reveal on H1, drifting accent-orb, shimmer CTA - SectionFrame: auto section-numbering via React context, draw-in rule-line - BulletsBlock / CardsBlock / StepsBlock / TimelineBlock: stagger reveal - StatStripBlock / DataGridBlock: CountUp on numeric values - DataGridBlock / ComparisonBlock: row-hover accent-slide - ProseBlock: drop-cap on long opening paragraph - globals.css: noise drift keyframes, shimmer keyframes, row-hover-accent - claude-design SKILL.md: editorial-only rewrite, no external plugin deps
Context.Provider cannot be used from a server component — server components can't serialize the .Provider field of a client-side context object. Extracted the section mapping + SectionNumberContext.Provider loop into SectionList.tsx (client component), keeping page.tsx as a server component for static optimization.
… skills After hitting an "Element type is invalid" prerender crash on FreightVault (SectionNumberContext.Provider in a server page.tsx), harden the atlas: - scaffold-landing + claude-design SKILL.md: require pnpm tsc + pnpm build + pnpm dev 200 as blocking acceptance gates (prerender errors don't show at typecheck) - Both skills: document common failures (Context.Provider in server, Phosphor icons in server, framer-motion hooks in server) with canonical fix pattern - New templates/landing/CLAUDE.md: project-level conventions cheat-sheet that travels with every scaffolded venture, including the canonical SectionList.tsx pattern for Context providers
Replace the implicit "everything goes on home.sections" default with an explicit 5-step procedure the skill runs before populating site.ts. Route names are now derived from the brief's own clusters — not a canonical list. Steps encoded in SKILL.md: 1. Estimate brief density by mapping artifacts to SectionBlock kinds 2. Decide single-page vs multi-page from density + cluster matrix (not count alone) 3. Find logical clusters by reader-question / persona / narrative-arc signals 4. Derive route names from cluster content (examples given, not fixed template; if the brief itself names the section, use that name kebab-cased) 5. Assemble pages with own hero + sequential CTAs; nav reflects actual pages Anti-patterns called out: empty pages (<3 blocks), canonical names unrelated to brief, nav with 8 items. Every structural decision must be recorded in design.ts.rationale so future audits can reconstruct why. Also extends Acceptance Criteria with: rationale trace, <3-section guard, per-page hero, per-page 200 smoke. Updates templates/landing/CLAUDE.md with a companion note that lives with every scaffolded venture — don't rename routes without updating the rationale.
…1 per venture Replaces the editorial SectionBlock dispatcher with a 1:1 clone of the web-landing-app UI. Page set, component sequence, markup, and animations are fixed across every venture — only token system (accent, fonts, borders), text content, and image URLs vary. - site.ts: typed named slots per page/component (home, mobile, business, pricing, blog, contact, privacy, terms) with lorem defaults. - design.ts: overrides limited to borderRadius / borderWidth / fontSans / fontMono (token-only, no structural knobs). - layout.tsx: metadata and structuredData driven by site.meta; accent tokens injected as inline CSS vars on <html>. - ImagePlaceholder + lorem() helpers for empty slots; Phosphor icons resolved via whitelisted map in lib/icons.ts. - Dynamic column counts in PricingPlans, TrustStats, Products, Footer so empty cells aren't reserved when brief supplies fewer items. - Skills: scaffold-landing and claude-design rewritten around the canonical policy — excess brief content is silently ignored. - Cleanup: old editorial blocks/UI, motion.ts, directions.ts, Privara brand strings, layout.tsx Fathom tag, and tsconfig.tsbuildinfo removed; *.tsbuildinfo added to .gitignore. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Hero title/subtitle/CTAs now read from site.home.hero; BaseHeader aria-label uses site.meta.brandName. Added Developers nav group to site.ts demo data. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…uidelines Instructs agents to rewrite verbose brief copy into concise UI-appropriate text per slot role rather than truncating. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Per-slot guidance to rewrite verbose brief copy into concise UI-appropriate text, with a table covering every slot type in site.ts. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
The landing template is application code, not agent instructions — it belongs in platform-modules alongside backend/app, not in atlas. Atlas holds only the populate-landing skill (content logic) and claude-design skill (token polish). The template files themselves ship through the existing platform-modules rsync in bootstrap Step 1. Changes: - Delete .claude/templates/landing/ (moved to platform-modules PR) - Rename scaffold-landing skill to populate-landing (no more rsync step) - bootstrap.md Step 1: include packages/landing/package.json in rebrand - bootstrap.md Step 1b: replace rsync with /populate-landing call - Update refs in _builder.md, claude-design, brief.template.md Paired with ReineiraOS/builder-modules#7
0xkkkn
changed the title
|
🎉 This PR is included in version 0.3.0 🎉 The release is available on GitHub release Your semantic-release bot 📦🚀 |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Adds two skills to the atlas bootstrap pipeline for scaffolding a venture's marketing landing page:
/populate-landing <venture>— fillspackages/landing/src/content/site.tsfrom the brief. Maps every brief field to the matching UI slot, applies text-fit writing rules, falls back tolorem()placeholders for missing content./claude-design <venture>— token-only polish: validatesbranding.accent, injects accent scale, optionally overridesborderRadius/borderWidth/ fonts indesign.ts. Never touches layout or component code.The landing template itself (Next.js 16 + React 19 + Tailwind 4, 8 canonical routes) now lives in platform-modules — see companion PR ReineiraOS/platform-modules#7. Atlas ships only the agent instructions; the template reaches each venture through the existing
rsync ../platform-modules/step.Pipeline change
packages/landing/for free/populate-landingonly (rsync removed)/claude-designStep 1 rebrand list gained
packages/landing/package.json → @<venture>/landing.What's in the branch
.claude/skills/build/populate-landing/SKILL.md— content-populate skill with full brief → site.ts mapping table, text-fit writing rules, acceptance criteria, common prerender failures..claude/skills/build/claude-design/SKILL.md— editorial token polish with a 9-step accent scale helper..claude/commands/bootstrap.md— Steps 1, 1b, 1c updated..claude/agents/_builder.md— pipeline and venture-field catalog updated.brief.template.md— section 8 "Landing Sections" feeds/populate-landing.test-briefs/{agrilend,blindference,freightvault}.md— three reference briefs.Dependency order
packages/landing/in the monorepo./populate-landingskill assumes the template is already in the venture after base scaffold.Test plan
/bootstrap test-briefs/freightvault.mdfrom a fresh atlas checkoutpackages/landing/with venture-brandedsite.ts(no "Privara" remnants)pnpm -F @<venture>/landing buildsucceeds, all 8 routes return 200 onpnpm devsite.branding.accentrebuilds with color change, no layout shift