规划、制作与复用跨渠道视觉内容时用…

当你要为文章、社交媒体、信息图、邮件或落地页规划图片、确定平台尺寸并复用视觉资产时使用。

适用场景

解决思路

1. 首次调用时，先用 1–2 句话说明该技能覆盖什么以及为何重要，然后给出主要输出；后续调用或用户要求跳过时，直接给出主要输出。
2. 开始前检查 `.claude/project-context.md` 或 `.cursor/project-context.md` 是否存在；若存在，读取 Section 12 (Visual Identity) 以保持品牌一致。
3. 识别上下文类型：Article、social post、infographic、email、landing page。
4. 识别渠道：哪些平台会使用这个视觉。
5. 识别复用需求：这个视觉是否会被适配到其他格式。
6. 为 Article / Blog 规划 Hero image、in-article images、screenshots；网站图片的 alt、WebP、LCP 参考 image-optimization。
7. 为 Social post 规划单图、carousel 或 link preview；按平台特定规格执行。
8. 为 Infographic 使用主格式和数据可视化；复用为 social（裁剪）和 blog（完整）。
9. 为 Case study 规划客户照片、结果 chart、logo；复用为 LinkedIn carousel、blog。
10. 为 Product update 规划 screenshot、feature graphic；用于 changelog、email、social。
11. 为 Email 规划 header image、inline graphics；保持轻量，因为很多客户端屏蔽图片。
12. 为 Landing page 规划 Hero、trust badges、screenshots；参考 hero-generator、image-optimization。
13. 网站图片优先处理 alt text、WebP、LCP、responsive、lazy loading；参考 image-optimization。
14. 社交帖子图片优先处理平台尺寸、aspect ratio、文件大小；参考对应平台技能。
15. OG / Twitter Cards 链接预览图使用 1200×630；Twitter 卡片使用 1200×675；参考 open-graph、twitter-cards。
16. 电子邮件图片使用 inline-friendly 格式；避免重图；为图片被屏蔽的情况提供 alt；参考 email-marketing。
17. X（Twitter）帖子图导出为 1200×675 (16:9) 或 800×800；个人资料图 400×400；参考 twitter-x-posts。
18. LinkedIn 帖子图导出为 1200×627 或 1200×1200；carousel 最多 20 张；个人资料图 400×400；参考 linkedin-posts；移动端优先竖版。
19. Pinterest 图导出为 1000×1500 (2:3)；个人资料图 165×165；alt text 可带来约 25% 更多曝光；参考 pinterest-posts。
20. Instagram 帖子图导出为 1080×1350 (4:5) 或 1080×1080；Stories / Reels 使用 1080×1920 (9:16)；个人资料图 320×320；信息流中 4:5 优于方形。
21. Facebook 帖子图导出为 1200×630 或 1080×1080；Stories 使用 1080×1920；个人资料图 320×320。
22. YouTube 缩略图导出为 1280×720；个人资料图 800×800。
23. 通用做法：1080px 宽度适用于大多数平台；移动优先信息流中竖版（4:5、9:16）优于方形。
24. 通用做法：把关键元素（logo、文字）放在安全中心，因为平台可能裁剪。
25. 复用原则：一个核心视觉 → 多种裁剪/格式 → 多个渠道。
26. Infographic 复用：全图用于 blog；裁剪部分用于 Instagram、LinkedIn carousel；方形用于 X；渠道包括 Blog、LinkedIn、Instagram、X。
27. Case study graphic 复用：Hero 用于 blog；单页 slide 用于 LinkedIn；story 用于 Instagram；渠道包括 Blog、LinkedIn、Instagram。
28. Product screenshot 复用：Hero 用于 landing；帖子用于 X、LinkedIn；email header 用于电子邮件；渠道包括 Website、social、email。
29. Quote graphic 复用：方形用于 X、LinkedIn；4:5 用于 Instagram；渠道包括 X、LinkedIn、Instagram。
30. 复用工作流：按所需最大尺寸设计；导出平台特定裁剪；使用一致颜色、字体、logo 位置；参考 brand-visual-generator。
31. 在内容日历中规划图片：不要事后才加视觉；视觉驱动参与。
32. 按主题批量制作：针对一个主题集群或 campaign 一起创建视觉，以保证一致性。
33. 在日历中加入复用列：注明哪个核心内容变成哪种视觉格式用于哪个渠道。
34. 建立 asset library：按 campaign/theme 组织；打标签以便复用。
35. Infographic 尺寸：宽度 800–1200px；高度按内容变化。
36. Infographic 导出：Web 用 PNG；下载用 PDF。
37. Infographic 复用：切成 3–5 张 slides 用于 LinkedIn carousel；单个 stat 用于 X / Instagram。
38. Social post images 的文字叠加：保持最少；很多平台不鼓励文字过多的图片。
39. Social post images 的品牌：logo 放角落；与 brand-visual-generator 保持一致。
40. Social post images 的 alt text：为 LinkedIn、Pinterest、X 添加（可访问性 + Pinterest SEO）；alt 最佳实践参考 image-optimization。
41. Article / Blog 的 Hero：通常是 LCP candidate；按 image-optimization 优化。
42. Article / Blog 的 In-article：支持叙事；按 image-optimization 添加 alt text、captions。
43. Article / Blog 的 Screenshots：有帮助时添加标注；保持文件大小低。
44. 输出 visual plan：什么内容配什么图片。
45. 按上下文输出 specs：平台尺寸、格式。
46. 输出 repurposing map：一个视觉 → 多个输出。
47. 输出对平台技能和 image-optimization 的引用。

适用边界 · 注意事项

• 仅做 Pinterest 发布时，优先使用 pinterest-posts 获取专用 Pin 尺寸和 alt text 策略。
• 仅做网站图片技术优化（alt、WebP、LCP、responsive、lazy loading）时，优先使用 image-optimization。
• 仅做视频内容、视频缩略图或视频 SEO 时，优先使用 video-marketing、video-optimization。