7.0 KiB
7.0 KiB
场景模板库：按输出类型组织
与 design-styles.md 的「提示词DNA」组合使用。 公式：
[风格提示词DNA] + [场景模板] + [具体内容描述]
1. 公众号封面 / 文章题图
规格：
- 封面图：2.35:1（900×383px 或 1200×510px）
- 正文插图：16:9（1200×675px）或 4:3（1200×900px）
关键设计要素：
- 视觉冲击力优先（用户在信息流中快速扫过）
- 文字极少或无文字（公众号标题会覆盖在上面）
- 色彩饱和度适中（微信阅读环境偏白）
- 避免过度细节（缩略图也要可辨识）
推荐风格：01 Pentagram / 11 Build / 12 Sagmeister / 18 Kenya Hara / 07 Field.io
场景提示词模板：
[风格DNA插入此处]
- Article cover image for WeChat subscription
- Landscape format, 2.35:1 aspect ratio
- Bold visual impact, minimal or no text
- Moderate color saturation for white reading environment
- Must remain recognizable as thumbnail
- Clean composition with clear focal point
2. 正文配图 / 概念插画
规格：
- 16:9（1200×675px）最通用
- 1:1（800×800px）适合强调
- 4:3（1200×900px）适合信息密集
关键设计要素：
- 服务于文章论点，不是装饰
- 与上下文形成视觉节奏
- 简洁表达一个核心概念
- AI生成优先，HTML截图仅在精确数据表格时用
推荐风格：根据文章调性选择，常用 01/04/10/17/18
场景提示词模板：
[风格DNA插入此处]
- Article illustration, concept visualization
- [16:9 / 1:1 / 4:3] aspect ratio
- Single clear concept: [描述核心概念]
- Serve the argument, not decoration
- [Light/Dark] background to match article tone
3. 信息图 / 数据可视化
规格：
- 竖版长图：1080×1920px（手机阅读）
- 横版：1920×1080px（文章内嵌）
- 方形：1080×1080px（社交媒体）
关键设计要素：
- 信息层级清晰（标题 → 核心数据 → 细节）
- 数据准确，不编造
- 视觉引导线（用户阅读路径）
- 适当使用图标/图表辅助理解
推荐风格：04 Fathom / 10 Müller-Brockmann / 02 Stamen / 17 Takram
场景提示词模板：
[风格DNA插入此处]
- Infographic / data visualization
- [Vertical 1080x1920 / Horizontal 1920x1080 / Square 1080x1080]
- Clear information hierarchy: title → key data → details
- Visual flow guiding reader's eye path
- Icons and charts for comprehension
- Data-accurate, no decorative distortion
4. PPT / Keynote 演示
规格：
- 标准：16:9（1920×1080px）
- 宽屏：16:10（1920×1200px）
关键设计要素：
- 每页一个核心信息（不堆砌）
- 字号层级明确（标题40pt+ / 正文24pt+ / 注释16pt+）
- 大量留白，投影时更清晰
- 图文比例至少 60:40
- 一致的视觉系统（颜色、字体、间距）
推荐风格：01 Pentagram / 10 Müller-Brockmann / 11 Build / 18 Kenya Hara / 04 Fathom
场景提示词模板：
[风格DNA插入此处]
- Presentation slide design, 16:9
- One core message per slide
- Clear type hierarchy (title 40pt+, body 24pt+)
- Generous whitespace for projection clarity
- Consistent visual system throughout
- [Light/Dark] theme
5. PDF 白皮书 / 技术报告
规格：
- A4 纵向（210×297mm / 595×842pt）
- Letter 纵向（216×279mm / 612×792pt）
关键设计要素：
- 长文阅读优化（行宽66字符、行高1.5-1.8）
- 清晰的章节导航系统
- 页眉/页脚/页码的统一设计
- 图表与正文的优雅共存
- 引用/注释系统
- 封面页设计精致
推荐风格：10 Müller-Brockmann / 04 Fathom / 03 Information Architects / 17 Takram / 19 Irma Boom
场景提示词模板：
[风格DNA插入此处]
- PDF document / white paper design
- A4 portrait format (210×297mm)
- Long-form reading optimized (66 char line width, 1.5 line height)
- Clear chapter navigation system
- Elegant header/footer/page number design
- Charts integrated with body text
- Professional cover page
6. 落地页 / 产品官网
规格：
- Desktop: 1440px 宽度设计（响应至320px）
- 首屏高度：100vh
关键设计要素：
- 首屏5秒内传达核心价值
- 清晰的CTA（行动按钮）
- 滚动叙事结构（问题→方案→证明→行动）
- 移动端适配
- 加载速度
推荐风格：05 Locomotive / 01 Pentagram / 11 Build / 08 Resn / 06 Active Theory
场景提示词模板：
[风格DNA插入此处]
- Landing page / product website
- Desktop 1440px width, responsive
- Hero section 100vh, core value in 5 seconds
- Clear CTA button design
- Scroll narrative: problem → solution → proof → action
- Modern web aesthetic
7. App UI / 原型界面
规格：
- iOS: 390×844pt（iPhone 15）
- Android: 360×800dp
- 平板: 1024×1366pt（iPad Pro）
关键设计要素：
- 触摸友好（最小点击区44×44pt）
- 系统设计语言一致性
- 状态栏/导航栏/Tab栏的标准处理
- 信息密度适中（移动端不宜过密）
推荐风格：17 Takram / 11 Build / 03 Information Architects / 01 Pentagram
场景提示词模板：
[风格DNA插入此处]
- Mobile app UI design
- iOS [390×844pt] / Android [360×800dp]
- Touch-friendly (44pt minimum tap targets)
- Consistent design system
- Standard status bar / navigation / tab bar
- Moderate information density
8. 小红书配图
规格：
- 竖版：3:4（1080×1440px）最佳
- 方形：1:1（1080×1080px）
- 首图决定点击率
关键设计要素：
- 视觉吸引力第一（在瀑布流中竞争）
- 可以有少量文字（但不超过画面20%）
- 色彩鲜明但不俗
- 生活感/质感/氛围感
推荐风格：12 Sagmeister / 11 Build / 20 Neo Shen / 09 Experimental Jetset
场景提示词模板：
[风格DNA插入此处]
- Social media image for Xiaohongshu (RED)
- Vertical 3:4 (1080×1440px)
- Eye-catching in waterfall feed
- Minimal text overlay (under 20% of area)
- Vivid but tasteful colors
- Lifestyle/texture/atmosphere feel
组合示例
场景：公众号封面，介绍一款AI编程工具，想要专业但有温度
Step 1：选风格 → 17 Takram（专业+温度） Step 2：取Takram提示词DNA + 公众号封面模板
Takram Japanese speculative design:
- Elegant concept prototypes and diagrams
- Soft tech aesthetic (rounded corners, gentle shadows)
- Charts and diagrams as art pieces
- Modest sophistication
- Neutral natural colors (beige, soft gray, muted green)
- Design as philosophical inquiry
Article cover image for WeChat subscription
- Landscape format, 2.35:1 aspect ratio (1200×510px)
- Bold visual impact, minimal text
- Moderate color saturation for white reading environment
- Must remain recognizable as thumbnail
- Clean composition with clear focal point
Content: An AI coding assistant tool, showing the concept of human-AI collaboration
in software development, warm and professional atmosphere
版本：v1.0 更新日期：2026-02-13