Vibe Coding 提示词

Launch · Beginner

高转化 SaaS 落地页提示词

把产品想法转化为结构清晰、证据可信并具有明确转化路径的落地页。

Vibe Codingv0LovableBolt

可复制的提示词模板

技术模板保留英文,便于直接用于兼容的编程 Agent;页面说明、选型建议和检查步骤均已中文本地化。

Build a polished, responsive SaaS landing page for [PRODUCT NAME], a product that helps [TARGET USER] achieve [PRIMARY OUTCOME].

Before coding, translate the brief into a clear page hierarchy. Then implement the page as a complete, working experience.

Page structure:
1. A compact navigation with logo, Product, Use cases, Pricing, and one primary CTA.
2. A hero that states the concrete outcome in one sentence, supports it with a short explanation, and includes primary and secondary actions.
3. A product preview that looks like a believable interface—not a decorative empty frame.
4. Three outcome-led benefits with specific supporting details.
5. A simple “how it works” sequence with three steps.
6. Social proof using realistic placeholder companies and quantified results clearly marked as sample data.
7. A pricing preview with [NUMBER OF PLANS] plans and an obvious recommended option.
8. A concise FAQ and final CTA.

Visual direction:
- Brand personality: [BRAND PERSONALITY]
- Primary color: [PRIMARY COLOR]
- Use strong typography, generous whitespace, and restrained motion.
- Avoid excessive gradients, glass cards, floating blobs, and repetitive rounded boxes.
- Make every section visually distinct while keeping one coherent design system.

Quality requirements:
- Mobile-first and accessible: semantic landmarks, visible focus states, sufficient contrast, descriptive labels.
- Include hover, loading, empty, and error states where relevant.
- Use meaningful product copy instead of lorem ipsum.
- Keep the main CTA consistent across the page.
- Verify the layout at mobile, tablet, and desktop widths before finishing.

使用前先完成定制

替换所有变量,删除不需要的功能,并加入真实内容、技术限制和明确的验收条件。

  • PRODUCT NAME — Briefly
  • TARGET USER — small product teams
  • PRIMARY OUTCOME — turn customer calls into prioritized product insights
  • BRAND PERSONALITY — calm, precise, quietly confident
  • PRIMARY COLOR — deep indigo
  • NUMBER OF PLANS — 3

系统检查生成结果

检查移动端、键盘操作、加载、空数据与错误状态,并使用真实数据完成核心流程。

选择 AI 编程工具

来源与维护信息

相关资源