cyberneticlibrary

Design conversion-focused landing pages

landing-page-designskillsetup L210
guangtouwangba/weaver
What it does

Design conversion-focused landing pages with unique aesthetics

Best for

Creating distinctive, high-conversion landing pages that stand out in saturated markets—when founder wants pages worth $50-100 that feel personally crafted.

Inputs
  • · brand reference (real-world place or object)
  • · target emotion (calm, energized, curious, etc.)
  • · two unexpected design collisions
  • · anti-patterns to avoid
Outputs
  • · vibe spec (colors, typography, layout, motion)
  • · Figma/design implementation
  • · conversion-optimized page structure
Requires
  • · Design tool (Figma, Framer, or web)
  • · Google Fonts
Preconditions
  • · Run Vibe Discovery process before coding
  • · Define scene sentence (who, state, action)
  • · Decide marketing vs. product register
Failure modes
  • · Vibe Discovery skipped → designs look generic or misaligned
  • · Reusing hex codes from previous projects → loss of freshness
  • · Matching existing patterns without questioning → missing opportunities
  • · Ignoring color strategy (Restrained vs. Committed vs. Drenched)
Trust signals
  • · Four-step Vibe Discovery process with explicit synthesis rules
  • · Anti-patterns section naming specific mistakes (Committed vs Drenched color strategies)
  • · Color invention derivation from reference place (not memorized palettes)
  • · Freshness check before design (hex code deduplication)