Skill Wiki
Gallery Full Landings
20 curated full-page landing screenshots from Land-book Pro, tagged by pattern type and persona lean.…
$ prime install @community/example-gallery-full-landingsProjection
Always in _index.xml · the agent never has to ask for this.
FullLandingGallery [example] v1.0.0
20 curated full-page landing screenshots from Land-book Pro, tagged by pattern type and persona lean. Full-page screenshots capture what section-level galleries cannot: page rhythm, section sequencing, visual consistency, and scroll narrative. A hero section and a pricing section may each look good in isolation — but a full-page view reveals whether transitions are smooth, whether visual density varies appropriately across the scroll, and whether the brand aesthetic holds from top to bottom.
Loaded when retrieval picks the atom as adjacent / supporting.
FullLandingGallery [example] v1.0.0
20 curated full-page landing screenshots from Land-book Pro, tagged by pattern type and persona lean. Full-page screenshots capture what section-level galleries cannot: page rhythm, section sequencing, visual consistency, and scroll narrative. A hero section and a pricing section may each look good in isolation — but a full-page view reveals whether transitions are smooth, whether visual density varies appropriately across the scroll, and whether the brand aesthetic holds from top to bottom.
Observations
- Dark-palette products maintain tonal consistency throughout — deviation is rare. Across all dark-theme full pages (aira, harmonicai, intelligent-management-platform, paperclip, stocks-bonds-crypto), the dark background is continuous across all sections with only subtle tonal variation. There are no 'light section islands' inside an otherwise dark page. This is a strong convention: breaking tonal consistency mid-page reads as unfinished rather than varied.
- Editorial and luxury brands use photography as the primary section separator. Aspelin-reitan, bedouins-daughter, goldsand, lucci-lambrusco — in all four, full-bleed photography acts as both content and visual breathing room between copy-heavy sections. The photography is the layout. Copy is overlaid or adjacent, never competing.
- The canonical B2B SaaS scroll sequence is: hero → features → social proof → pricing → CTA. Aira, gogetta, harmonicai, and bright-os all follow this structure. This sequence is so established that departing from it — especially moving pricing above social proof — is a conversion risk unless there is deliberate intent (e.g., transparent pricing as a differentiator).
- Illustrated / mascot brands maintain character across all sections. Gogetta uses its illustrated mascot in the hero, features, and footer. This creates brand coherence that photographic or icon-based brands rarely achieve with the same vividness. It comes at a cost: the illustration system must be extensive enough to populate multiple section types.
- Studio / portfolio pages invert the SaaS hierarchy — work comes before process. Stodio, vogelhaus, and to a degree anima lead with work output (portfolio cases, design demos) before explaining services. The rationale: show craft, then explain context. This is opposite to product SaaS pages where the value proposition must precede the proof.
Items
- File: aira--ai-sales-agent-for-sales-teams.webp
- Pattern: dark SaaS full-page + hero → features → social proof → CTA rhythm
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: AI sales product; consistent dark palette throughout; tight section transitions
- File: alveos-one.webp
- Pattern: minimal product page + generous whitespace + single-product focus
- Persona Lean:
- tokyo-minimal
- swiss-modernist
- Notes: Near-monochrome; extreme restraint; single product with long scroll
- File: anima.webp
- Pattern: design-tool landing + animated preview + designer-facing audience
- Persona Lean:
- editorial
- swiss-modernist
- Notes: Design-tool audience; careful grid; interactive UI demos embedded
- File: aspelin-reitan.webp
- Pattern: real-estate editorial + full-bleed property photography + Norwegian brand
- Persona Lean:
- editorial
- warm-institutional
- Notes: Scandinavian real estate; editorial photo treatment; long-scroll storytelling
- File: bedouins-daughter.webp
- Pattern: artisan brand + editorial photography + e-commerce product story
- Persona Lean:
- editorial
- warm-institutional
- Notes: Handmade/craft brand; warm palette; photography-first with minimal copy
- File: bright-os--your-super-app-for-health.webp
- Pattern: consumer health app + vibrant palette + feature → social proof flow
- Persona Lean:
- warm-institutional
- editorial
- Notes: Health super-app; bright optimistic colors; mobile-first feel throughout
- File: claire-astor.webp
- Pattern: personal brand / portfolio + editorial photography + luxury positioning
- Persona Lean:
- editorial
- tokyo-minimal
- Notes: Individual professional branding; luxury aesthetic; typography-forward
- File: dash-burger.webp
- Pattern: food brand + full-bleed food photography + bold condensed type
- Persona Lean:
- brutalist-expressive
- editorial
- Notes: Fast-food brand energy; oversized type; saturated food photography
- File: fluid-glass.webp
- Pattern: experimental product page + 3D material render + single product
- Persona Lean:
- brutalist-expressive
- editorial
- Notes: 3D fluid material brand; immersive scrolling; no conventional section grid
- File: gogetta.webp
- Pattern: B2B community platform + illustrated sections + mascot throughout
- Persona Lean:
- warm-institutional
- Notes: Mascot used consistently across all sections; cohesive illustrated brand system
- File: goldsand.webp
- Pattern: luxury product + warm earthy palette + editorial photography + minimal copy
- Persona Lean:
- editorial
- tokyo-minimal
- Notes: Premium product; gold/sand palette; photography tells brand story
- File: harmonicai.webp
- Pattern: AI data product + dark SaaS + dashboard preview → features → enterprise CTA
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Enterprise AI; structured section flow; data visualization as brand anchor
- File: intelligent-management-platform-for-rd.webp
- Pattern: enterprise SaaS + diagram-heavy features + R&D buyer framing
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Complex B2B product; diagram and flow chart visuals throughout sections
- File: lucci-lambrusco.webp
- Pattern: wine brand + editorial packaging photography + Italian aesthetic
- Persona Lean:
- editorial
- warm-institutional
- Notes: Wine/beverage brand; elegant type pairing; product packaging as hero visual
- File: orakl-oncology.webp
- Pattern: healthcare/biotech + clinical credibility + editorial whitespace
- Persona Lean:
- editorial
- swiss-modernist
- Notes: Oncology product; clinical trust signals; conservative but premium design
- File: paperclip--open-source-orchestration-for-zero-human-co.webp
- Pattern: developer tool landing + dark theme + code-native visuals + OSS positioning
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Open-source orchestration; code and diagram visuals; developer community tone
- File: protocol-theory---protocol-theory--evidence-based-con.webp
- Pattern: consumer science brand + evidence-based copy + clean editorial layout
- Persona Lean:
- editorial
- warm-institutional
- Notes: Science-backed consumer product; citations and research framing; warm but credible
- File: stocks-bonds-crypto--options-investing-app.webp
- Pattern: fintech app full-page + dark premium + mobile app screenshots
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Investing app; dark fintech aesthetic; mobile UI screenshots as product proof
- File: stodio.webp
- Pattern: creative studio portfolio + experimental layout + work showcase
- Persona Lean:
- brutalist-expressive
- editorial
- Notes: Design studio; non-standard grid; portfolio work dominates over copy
- File: vogelhaus-app-design--development-studio.webp
- Pattern: app studio full-page + case study grid + service positioning
- Persona Lean:
- swiss-modernist
- editorial
- Notes: App design studio; clean case study layout; process and work shown
Base Path
resources/landbook/landing
Persona Mapping
- Dense Pragmatist:
- aira--ai-sales-agent-for-sales-teams
- harmonicai
- intelligent-management-platform-for-rd
- paperclip--open-source-orchestration-for-zero-human-co
- stocks-bonds-crypto--options-investing-app
- Swiss Modernist:
- alveos-one
- anima
- orakl-oncology
- vogelhaus-app-design--development-studio
- Editorial:
- aspelin-reitan
- claire-astor
- goldsand
- lucci-lambrusco
- bedouins-daughter
- Warm Institutional:
- gogetta
- bright-os--your-super-app-for-health
- protocol-theory---protocol-theory--evidence-based-con
- bedouins-daughter
- Brutalist Expressive:
- dash-burger
- fluid-glass
- stodio
- Tokyo Minimal:
- alveos-one
- claire-astor
- goldsand
Agent Workflow
1. Use full-page samples to define section order, not section content. When planning a landing page architecture, select 2 full-page samples that match the target persona and inspect the section sequence. The section-level galleries (hero, features, pricing, CTA, testimonials) then fill in the detail.
2. Check tonal consistency mode. Determine early whether the design should be dark-continuous, light-continuous, or mixed-light-with-dark-accents. The full-page gallery demonstrates that successful pages commit to one mode.
3. Select 1 full-page + 2-3 section samples as an agent's reference set. The full-page anchor establishes rhythm; section samples add pattern detail. This set of 3-4 images is the practical limit for vision-model consumption.
4. Cross-reference section galleries for each section in the full-page. If a full-page sample's hero section is interesting, look for it (or similar items) in the hero gallery. The section galleries provide closer inspection.
5. Studio portfolios are not SaaS templates. Stodio, vogelhaus, and anima are high-quality but serve a different purchase decision. Do not apply their section hierarchy to a B2B SaaS product without deliberate adaptation.
Loaded when retrieval picks the atom as a focal / direct hit.
FullLandingGallery [example] v1.0.0
20 curated full-page landing screenshots from Land-book Pro, tagged by pattern type and persona lean. Full-page screenshots capture what section-level galleries cannot: page rhythm, section sequencing, visual consistency, and scroll narrative. A hero section and a pricing section may each look good in isolation — but a full-page view reveals whether transitions are smooth, whether visual density varies appropriately across the scroll, and whether the brand aesthetic holds from top to bottom.
Observations
- Dark-palette products maintain tonal consistency throughout — deviation is rare. Across all dark-theme full pages (aira, harmonicai, intelligent-management-platform, paperclip, stocks-bonds-crypto), the dark background is continuous across all sections with only subtle tonal variation. There are no 'light section islands' inside an otherwise dark page. This is a strong convention: breaking tonal consistency mid-page reads as unfinished rather than varied.
- Editorial and luxury brands use photography as the primary section separator. Aspelin-reitan, bedouins-daughter, goldsand, lucci-lambrusco — in all four, full-bleed photography acts as both content and visual breathing room between copy-heavy sections. The photography is the layout. Copy is overlaid or adjacent, never competing.
- The canonical B2B SaaS scroll sequence is: hero → features → social proof → pricing → CTA. Aira, gogetta, harmonicai, and bright-os all follow this structure. This sequence is so established that departing from it — especially moving pricing above social proof — is a conversion risk unless there is deliberate intent (e.g., transparent pricing as a differentiator).
- Illustrated / mascot brands maintain character across all sections. Gogetta uses its illustrated mascot in the hero, features, and footer. This creates brand coherence that photographic or icon-based brands rarely achieve with the same vividness. It comes at a cost: the illustration system must be extensive enough to populate multiple section types.
- Studio / portfolio pages invert the SaaS hierarchy — work comes before process. Stodio, vogelhaus, and to a degree anima lead with work output (portfolio cases, design demos) before explaining services. The rationale: show craft, then explain context. This is opposite to product SaaS pages where the value proposition must precede the proof.
Items
- File: aira--ai-sales-agent-for-sales-teams.webp
- Pattern: dark SaaS full-page + hero → features → social proof → CTA rhythm
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: AI sales product; consistent dark palette throughout; tight section transitions
- File: alveos-one.webp
- Pattern: minimal product page + generous whitespace + single-product focus
- Persona Lean:
- tokyo-minimal
- swiss-modernist
- Notes: Near-monochrome; extreme restraint; single product with long scroll
- File: anima.webp
- Pattern: design-tool landing + animated preview + designer-facing audience
- Persona Lean:
- editorial
- swiss-modernist
- Notes: Design-tool audience; careful grid; interactive UI demos embedded
- File: aspelin-reitan.webp
- Pattern: real-estate editorial + full-bleed property photography + Norwegian brand
- Persona Lean:
- editorial
- warm-institutional
- Notes: Scandinavian real estate; editorial photo treatment; long-scroll storytelling
- File: bedouins-daughter.webp
- Pattern: artisan brand + editorial photography + e-commerce product story
- Persona Lean:
- editorial
- warm-institutional
- Notes: Handmade/craft brand; warm palette; photography-first with minimal copy
- File: bright-os--your-super-app-for-health.webp
- Pattern: consumer health app + vibrant palette + feature → social proof flow
- Persona Lean:
- warm-institutional
- editorial
- Notes: Health super-app; bright optimistic colors; mobile-first feel throughout
- File: claire-astor.webp
- Pattern: personal brand / portfolio + editorial photography + luxury positioning
- Persona Lean:
- editorial
- tokyo-minimal
- Notes: Individual professional branding; luxury aesthetic; typography-forward
- File: dash-burger.webp
- Pattern: food brand + full-bleed food photography + bold condensed type
- Persona Lean:
- brutalist-expressive
- editorial
- Notes: Fast-food brand energy; oversized type; saturated food photography
- File: fluid-glass.webp
- Pattern: experimental product page + 3D material render + single product
- Persona Lean:
- brutalist-expressive
- editorial
- Notes: 3D fluid material brand; immersive scrolling; no conventional section grid
- File: gogetta.webp
- Pattern: B2B community platform + illustrated sections + mascot throughout
- Persona Lean:
- warm-institutional
- Notes: Mascot used consistently across all sections; cohesive illustrated brand system
- File: goldsand.webp
- Pattern: luxury product + warm earthy palette + editorial photography + minimal copy
- Persona Lean:
- editorial
- tokyo-minimal
- Notes: Premium product; gold/sand palette; photography tells brand story
- File: harmonicai.webp
- Pattern: AI data product + dark SaaS + dashboard preview → features → enterprise CTA
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Enterprise AI; structured section flow; data visualization as brand anchor
- File: intelligent-management-platform-for-rd.webp
- Pattern: enterprise SaaS + diagram-heavy features + R&D buyer framing
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Complex B2B product; diagram and flow chart visuals throughout sections
- File: lucci-lambrusco.webp
- Pattern: wine brand + editorial packaging photography + Italian aesthetic
- Persona Lean:
- editorial
- warm-institutional
- Notes: Wine/beverage brand; elegant type pairing; product packaging as hero visual
- File: orakl-oncology.webp
- Pattern: healthcare/biotech + clinical credibility + editorial whitespace
- Persona Lean:
- editorial
- swiss-modernist
- Notes: Oncology product; clinical trust signals; conservative but premium design
- File: paperclip--open-source-orchestration-for-zero-human-co.webp
- Pattern: developer tool landing + dark theme + code-native visuals + OSS positioning
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Open-source orchestration; code and diagram visuals; developer community tone
- File: protocol-theory---protocol-theory--evidence-based-con.webp
- Pattern: consumer science brand + evidence-based copy + clean editorial layout
- Persona Lean:
- editorial
- warm-institutional
- Notes: Science-backed consumer product; citations and research framing; warm but credible
- File: stocks-bonds-crypto--options-investing-app.webp
- Pattern: fintech app full-page + dark premium + mobile app screenshots
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Investing app; dark fintech aesthetic; mobile UI screenshots as product proof
- File: stodio.webp
- Pattern: creative studio portfolio + experimental layout + work showcase
- Persona Lean:
- brutalist-expressive
- editorial
- Notes: Design studio; non-standard grid; portfolio work dominates over copy
- File: vogelhaus-app-design--development-studio.webp
- Pattern: app studio full-page + case study grid + service positioning
- Persona Lean:
- swiss-modernist
- editorial
- Notes: App design studio; clean case study layout; process and work shown
Base Path
resources/landbook/landing
Persona Mapping
- Dense Pragmatist:
- aira--ai-sales-agent-for-sales-teams
- harmonicai
- intelligent-management-platform-for-rd
- paperclip--open-source-orchestration-for-zero-human-co
- stocks-bonds-crypto--options-investing-app
- Swiss Modernist:
- alveos-one
- anima
- orakl-oncology
- vogelhaus-app-design--development-studio
- Editorial:
- aspelin-reitan
- claire-astor
- goldsand
- lucci-lambrusco
- bedouins-daughter
- Warm Institutional:
- gogetta
- bright-os--your-super-app-for-health
- protocol-theory---protocol-theory--evidence-based-con
- bedouins-daughter
- Brutalist Expressive:
- dash-burger
- fluid-glass
- stodio
- Tokyo Minimal:
- alveos-one
- claire-astor
- goldsand
Agent Workflow
1. Use full-page samples to define section order, not section content. When planning a landing page architecture, select 2 full-page samples that match the target persona and inspect the section sequence. The section-level galleries (hero, features, pricing, CTA, testimonials) then fill in the detail.
2. Check tonal consistency mode. Determine early whether the design should be dark-continuous, light-continuous, or mixed-light-with-dark-accents. The full-page gallery demonstrates that successful pages commit to one mode.
3. Select 1 full-page + 2-3 section samples as an agent's reference set. The full-page anchor establishes rhythm; section samples add pattern detail. This set of 3-4 images is the practical limit for vision-model consumption.
4. Cross-reference section galleries for each section in the full-page. If a full-page sample's hero section is interesting, look for it (or similar items) in the hero gallery. The section galleries provide closer inspection.
5. Studio portfolios are not SaaS templates. Stodio, vogelhaus, and anima are high-quality but serve a different purchase decision. Do not apply their section hierarchy to a B2B SaaS product without deliberate adaptation.
Observations
- Dark-palette products maintain tonal consistency throughout — deviation is rare. Across all dark-theme full pages (aira, harmonicai, intelligent-management-platform, paperclip, stocks-bonds-crypto), the dark background is continuous across all sections with only subtle tonal variation. There are no 'light section islands' inside an otherwise dark page. This is a strong convention: breaking tonal consistency mid-page reads as unfinished rather than varied.
- Editorial and luxury brands use photography as the primary section separator. Aspelin-reitan, bedouins-daughter, goldsand, lucci-lambrusco — in all four, full-bleed photography acts as both content and visual breathing room between copy-heavy sections. The photography is the layout. Copy is overlaid or adjacent, never competing.
- The canonical B2B SaaS scroll sequence is: hero → features → social proof → pricing → CTA. Aira, gogetta, harmonicai, and bright-os all follow this structure. This sequence is so established that departing from it — especially moving pricing above social proof — is a conversion risk unless there is deliberate intent (e.g., transparent pricing as a differentiator).
- Illustrated / mascot brands maintain character across all sections. Gogetta uses its illustrated mascot in the hero, features, and footer. This creates brand coherence that photographic or icon-based brands rarely achieve with the same vividness. It comes at a cost: the illustration system must be extensive enough to populate multiple section types.
- Studio / portfolio pages invert the SaaS hierarchy — work comes before process. Stodio, vogelhaus, and to a degree anima lead with work output (portfolio cases, design demos) before explaining services. The rationale: show craft, then explain context. This is opposite to product SaaS pages where the value proposition must precede the proof.
Items
- File: aira--ai-sales-agent-for-sales-teams.webp
- Pattern: dark SaaS full-page + hero → features → social proof → CTA rhythm
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: AI sales product; consistent dark palette throughout; tight section transitions
- File: alveos-one.webp
- Pattern: minimal product page + generous whitespace + single-product focus
- Persona Lean:
- tokyo-minimal
- swiss-modernist
- Notes: Near-monochrome; extreme restraint; single product with long scroll
- File: anima.webp
- Pattern: design-tool landing + animated preview + designer-facing audience
- Persona Lean:
- editorial
- swiss-modernist
- Notes: Design-tool audience; careful grid; interactive UI demos embedded
- File: aspelin-reitan.webp
- Pattern: real-estate editorial + full-bleed property photography + Norwegian brand
- Persona Lean:
- editorial
- warm-institutional
- Notes: Scandinavian real estate; editorial photo treatment; long-scroll storytelling
- File: bedouins-daughter.webp
- Pattern: artisan brand + editorial photography + e-commerce product story
- Persona Lean:
- editorial
- warm-institutional
- Notes: Handmade/craft brand; warm palette; photography-first with minimal copy
- File: bright-os--your-super-app-for-health.webp
- Pattern: consumer health app + vibrant palette + feature → social proof flow
- Persona Lean:
- warm-institutional
- editorial
- Notes: Health super-app; bright optimistic colors; mobile-first feel throughout
- File: claire-astor.webp
- Pattern: personal brand / portfolio + editorial photography + luxury positioning
- Persona Lean:
- editorial
- tokyo-minimal
- Notes: Individual professional branding; luxury aesthetic; typography-forward
- File: dash-burger.webp
- Pattern: food brand + full-bleed food photography + bold condensed type
- Persona Lean:
- brutalist-expressive
- editorial
- Notes: Fast-food brand energy; oversized type; saturated food photography
- File: fluid-glass.webp
- Pattern: experimental product page + 3D material render + single product
- Persona Lean:
- brutalist-expressive
- editorial
- Notes: 3D fluid material brand; immersive scrolling; no conventional section grid
- File: gogetta.webp
- Pattern: B2B community platform + illustrated sections + mascot throughout
- Persona Lean:
- warm-institutional
- Notes: Mascot used consistently across all sections; cohesive illustrated brand system
- File: goldsand.webp
- Pattern: luxury product + warm earthy palette + editorial photography + minimal copy
- Persona Lean:
- editorial
- tokyo-minimal
- Notes: Premium product; gold/sand palette; photography tells brand story
- File: harmonicai.webp
- Pattern: AI data product + dark SaaS + dashboard preview → features → enterprise CTA
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Enterprise AI; structured section flow; data visualization as brand anchor
- File: intelligent-management-platform-for-rd.webp
- Pattern: enterprise SaaS + diagram-heavy features + R&D buyer framing
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Complex B2B product; diagram and flow chart visuals throughout sections
- File: lucci-lambrusco.webp
- Pattern: wine brand + editorial packaging photography + Italian aesthetic
- Persona Lean:
- editorial
- warm-institutional
- Notes: Wine/beverage brand; elegant type pairing; product packaging as hero visual
- File: orakl-oncology.webp
- Pattern: healthcare/biotech + clinical credibility + editorial whitespace
- Persona Lean:
- editorial
- swiss-modernist
- Notes: Oncology product; clinical trust signals; conservative but premium design
- File: paperclip--open-source-orchestration-for-zero-human-co.webp
- Pattern: developer tool landing + dark theme + code-native visuals + OSS positioning
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Open-source orchestration; code and diagram visuals; developer community tone
- File: protocol-theory---protocol-theory--evidence-based-con.webp
- Pattern: consumer science brand + evidence-based copy + clean editorial layout
- Persona Lean:
- editorial
- warm-institutional
- Notes: Science-backed consumer product; citations and research framing; warm but credible
- File: stocks-bonds-crypto--options-investing-app.webp
- Pattern: fintech app full-page + dark premium + mobile app screenshots
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Investing app; dark fintech aesthetic; mobile UI screenshots as product proof
- File: stodio.webp
- Pattern: creative studio portfolio + experimental layout + work showcase
- Persona Lean:
- brutalist-expressive
- editorial
- Notes: Design studio; non-standard grid; portfolio work dominates over copy
- File: vogelhaus-app-design--development-studio.webp
- Pattern: app studio full-page + case study grid + service positioning
- Persona Lean:
- swiss-modernist
- editorial
- Notes: App design studio; clean case study layout; process and work shown
Base Path
resources/landbook/landing
Persona Mapping
- Dense Pragmatist:
- aira--ai-sales-agent-for-sales-teams
- harmonicai
- intelligent-management-platform-for-rd
- paperclip--open-source-orchestration-for-zero-human-co
- stocks-bonds-crypto--options-investing-app
- Swiss Modernist:
- alveos-one
- anima
- orakl-oncology
- vogelhaus-app-design--development-studio
- Editorial:
- aspelin-reitan
- claire-astor
- goldsand
- lucci-lambrusco
- bedouins-daughter
- Warm Institutional:
- gogetta
- bright-os--your-super-app-for-health
- protocol-theory---protocol-theory--evidence-based-con
- bedouins-daughter
- Brutalist Expressive:
- dash-burger
- fluid-glass
- stodio
- Tokyo Minimal:
- alveos-one
- claire-astor
- goldsand
Agent Workflow
1. Use full-page samples to define section order, not section content. When planning a landing page architecture, select 2 full-page samples that match the target persona and inspect the section sequence. The section-level galleries (hero, features, pricing, CTA, testimonials) then fill in the detail.
2. Check tonal consistency mode. Determine early whether the design should be dark-continuous, light-continuous, or mixed-light-with-dark-accents. The full-page gallery demonstrates that successful pages commit to one mode.
3. Select 1 full-page + 2-3 section samples as an agent's reference set. The full-page anchor establishes rhythm; section samples add pattern detail. This set of 3-4 images is the practical limit for vision-model consumption.
4. Cross-reference section galleries for each section in the full-page. If a full-page sample's hero section is interesting, look for it (or similar items) in the hero gallery. The section galleries provide closer inspection.
5. Studio portfolios are not SaaS templates. Stodio, vogelhaus, and anima are high-quality but serve a different purchase decision. Do not apply their section hierarchy to a B2B SaaS product without deliberate adaptation.
Source
prime-system/examples/frontend-design/primes/compiled/@community/example-gallery-full-landings/atom.yaml