Bento 产品发布 (Bento Product Launch)
更像当代 AI 和 startup 产品落地页的 Bento 拼块版本，用模块化卡片和快节奏扫描帮助用户迅速抓住能力边界。
AI 产品startup 官网模块化 landing page
真实网站参考 / Real References
先看这些真实网站 / Open these real sites first
长这样 / Looks Like
- hero 后接拼块
- 快节奏扫读
- 产品卡片密
- 说明模块化
适合做 / Good For
- AI 产品
- startup 官网
- 模块化 landing page
不适合做 / Not For
- 安静生活方式站
- 机构 program 首页
- 纯图像期刊
Skill 包含什么 / What The Skill Controls
截图、排版和规则来自同一套风格包 / The screenshots, layout, and rules come from the same skill packet
配色系统 / Color System
- 深浅都可以
- 重点靠卡片层级和少量强调色
- 不要做成廉价渐变大全
排版系统 / Typography
- 标题要直接说明能力
- 模块标题短而准
- 数据点和功能标签要单独成层
版式规则 / Layout Rules
- hero 之后立刻进入 bento 卡片
- 支持快速扫读
- 产品说明像一套模块而不是长篇 feature list
图片处理 / Image Treatment
- UI 截图、代码片段和演示块都能进卡片
- 每张图都要解释能力
- 不要混入无关生活方式摄影
交互节奏 / Motion
- 卡片 hover 和入场反馈可以更明显
- 但要短促
- 避免过长场景式转场
AI Prompt / AI Prompt
复制后直接粘贴给 Cursor / Claude / Paste directly into Cursor / Claude
请参考Bento 产品发布（Bento Product Launch）风格建站：
视觉特征：hero 后接拼块 / 快节奏扫读 / 产品卡片密 / 说明模块化
适合场景：AI 产品 / startup 官网 / 模块化 landing page
不适合：安静生活方式站 / 机构 program 首页 / 纯图像期刊
推荐页面组织：工作台型 / Workbench / Tool Shell / 目录索引型 / Catalog Explorer
历史来源：包豪斯 / Bauhaus / 瑞士风格 / Swiss Style / 极简主义 / Minimalism
参考网站：Bolt: https://bolt.new/ / Vercel: https://vercel.com/ / Linear: https://linear.app/
配色系统：深浅都可以 / 重点靠卡片层级和少量强调色 / 不要做成廉价渐变大全
排版系统：标题要直接说明能力 / 模块标题短而准 / 数据点和功能标签要单独成层
版式规则：hero 之后立刻进入 bento 卡片 / 支持快速扫读 / 产品说明像一套模块而不是长篇 feature list
图片处理：UI 截图、代码片段和演示块都能进卡片 / 每张图都要解释能力 / 不要混入无关生活方式摄影
风格要求：Use a bento product launch family: one strong product statement up top, modular feature blocks underneath, dense but controlled scan paths, a near-black or bright-neutral palette, and cards that explain real capability instead of generic marketing filler.
历史来源 / Historical Roots
这部分放在最后看，用来补背景，而不是先决定风格。 / Use this section to add background after the direction is already clear.
1919-1933
包豪斯 (Bauhaus)
功能、工业和几何秩序优先。它把形式服从用途这件事系统化。
1950s-1970s
瑞士风格 (Swiss Style)
网格、对齐、无衬线、秩序感。它是今天大量知识型、设计型、档案型网页的基础语法之一。
1960s-1970s
极简主义 (Minimalism)
把形式削减到最少元素，让结构、比例与重复本身发声。