本文へ移動
cccskills
無料GitHub で公開

poster-hero

生成 1080×1920 竖版营销海报,包含大标题、核心卖点和可选二维码,适合产品发布、活动宣传与朋友圈传播。当用户说“做竖版营销海报、活动宣传图、朋友圈海报、产品发布海报”时使用。横版金句卡用 card-quote,小红书知识卡用 card-xiaohongshu。

インストール方法を見る

含まれるファイル(4)

  • SKILL.md4.3 KB
  • EASEL-META.md373 B
  • example.html6.2 KB
  • example.md263 B

SKILL.md(原文)

インストールする前に、エージェントに与えられる指示の中身を確認できます。

营销海报

你是一名视觉营销设计师。根据用户提供的内容,生成一张竖版高冲击力营销海报 HTML。

⚠️ 生成前先读 card-design 设计系统(锁配色/字体层级/填满画幅/去 AI 廉价感)。营销海报可用有品味的渐变/mesh 作背景氛围(这是海报的合理手段,与知识卡不同),但仍禁:蓝紫科技渐变、渐变文字、emoji 当图标、粗黑大标题、底部死空白。海报也要填满 1080×1920。

输出规范

  • 容器 width: 1080px; height: 1920px,居中显示,圆角裁切
  • 输出完整的 HTML 文件,写入 outputs/ 目录,可直接在浏览器打开截图

海报结构

  1. 上部 — 品牌名 / 标签(发布日期、版本号、活动名等)+ 一个线性图标或抽象几何标记(禁 emoji 当图标)
  2. 中部视觉中心 — 主标题(字越大越细:大字用 Thin/Light 字重,靠字号+留白建立层级,而非 font-black)+ 一句话副标题,用 1 个强调色高亮关键词
  3. 下部信息卡片 — 3-5 条核心卖点,每条 线性图标(Lucide,stroke 1.5) + 短句
  4. 底部 — 右下角品牌 / 二维码(用 SVG 占位)+ CTA 文案;底部填满,不留死空白

视觉风格

遵循 card-design:先按内容/Profile 选一个风格立场并锁定它的配色与字体,全程只用这一套。海报允许有品味的氛围渐变作背景,但下列是硬红线。

  • 背景:氛围渐变 / mesh 或单色系深底 + 1 个强调色。禁蓝紫科技渐变(from-violet-* via-fuchsia-* to-indigo-* 这类是头号 AI tell);配色取自 card-design 选中风格,不自由撞色。
  • 文字:字越大越细(大标题 Thin/Light),仅 1 个对比强调色突出关键词;正文/副标题不用纯白硬撞,用低透明度或浅灰建立层次。禁渐变文字(bg-clip-text)。
  • 装饰克制:发丝线 / 网格 / 极淡噪点纹理(grain)即可。禁玻璃拟态(backdrop-filter:blur)、禁堆叠阴影。
  • 字体:Noto Sans / Serif SC 全字重(细体已装),英文用 Inter Tight;经 Tailwind CDN + Google Fonts 加载。
  • 填满 1080×1920:内容覆盖 ≥75% 画高,任何无理由空白带 >15% 画高 = 失败(见 card-design layout-laws.md)。

示例 Prompt

  • "帮我做一张产品发布海报,产品是 XXX,核心卖点是 A、B、C"
  • "做一张活动宣传海报,主题是年中大促,时间 7 月 20 日"
  • "朋友圈分享图,内容是我们团队刚拿了 XX 奖"

与其他卡片 SKILL 的区别

三者都是"HTML 单图 → 截图",仅画幅与场景不同,互不替代:

  • poster-hero(本 SKILL) = 1080×1920 竖版营销海报 / 朋友圈分享图,全屏渐变 + 大标题 + 卖点卡片 + 二维码,用于产品发布、活动宣传。
  • card-quote = 16:9 横版金句/数据卡,单张 hero 观点或核心数字,配微博 / 知乎 / X / 公众号。
  • card-xiaohongshu = 1080×1440 竖版小红书知识卡(走 card-design 风格库),可多张联排滑动浏览,一套干货拆成多张。

Profile 感知

  • 有 Profile:从 style.md 读取品牌配色替换默认背景,从 identity.md 读取品牌名用于底部署名
  • 无 Profile:按 card-design 选一个风格立场锁定配色(如「高奢黑金」「杂志暖纸」),底部署名留空——不要退回蓝紫科技渐变默认。

输出

生成完整的 HTML 文件,写入 outputs/ 目录,再用共享脚本自动渲染成图(勿手动截图):

python skills/shared/scripts/render_card.py \
  --html outputs/主题名/assets/poster.html \
  --out outputs/主题名/poster.png \
  --full-page --width 1080 --height 1920
  • 竖版海报 1080×1920 用 --full-page。脚本对 CDN/字体有界超时不卡死。
  • 首次需 pip install playwright && playwright install chromium。

レビュー

まだレビューはありません。使ってみた感想をお寄せください。

同じリポジトリのスキル

概要と使いどころ

通用 AI 生图:文生图 / 图生图 / 图像变体。当用户说 AI 生图、AI 画图、文生图、图生图、生成图片、生成配图、图像生成、AI 出图、AI 作图、换图、改图、图像编辑、给我画一张、生成一张图 时使用。支持 OpenAI 兼容 API 与 apimart 异步 API,用户自备 API key。

日本語の概要は準備中です。原文の説明を表示しています。

ZJU-REAL/Easel3,5932026年10月12日 更新

ai-music

無料

AI 音乐 / BGM 生成:给短视频、社媒内容生成原创背景音乐 / 配乐 / 纯音乐。通过可插拔 provider(阿里 DashScope / Suno 类第三方 API)文生音乐,异步提交→轮询→下载,产物可再裁剪/归一化或加到视频。当用户说“AI 音乐”“AI 配乐”“生成 BGM”“背景音乐”“原创音乐”“AI 作曲”“纯音乐”“给视频配乐”“做首曲子”时使用。与 tts-voiceover 的区别:tts-voiceover 生成人声口播/旁白,ai-music 生成背景音乐/配乐(无人声或带演唱)。

日本語の概要は準備中です。原文の説明を表示しています。

ZJU-REAL/Easel3,5932026年10月12日 更新

AI 视频生成:文生视频 / 图生视频 / 数字人首帧驱动。通过可插拔 provider(通义万相 Wan / 火山 Seedance / 快手可灵 / OpenAI 兼容)异步生成视频,用户自备 API key。当用户说 AI 视频生成、文生视频、图生视频、AI 生成视频、AI 短视频、让图片动起来、数字人视频、生成一段视频 时使用。与 video-strategy(选型/策略)、video-editing(剪辑处理)、clipify(切片)区别:本 SKILL 是从 0 用 AI 生成新视频。

日本語の概要は準備中です。原文の説明を表示しています。

ZJU-REAL/Easel3,5932026年10月12日 更新

outputs/ 目录下的产物管理:按日期/平台/类型归档、打标签、搜索历史内容、生成素材清单。 当用户说"整理素材"、"归档"、"找之前的内容"、"搜索历史"、"素材管理"、 "outputs 整理"、"之前做的"时使用。 与其他 produce 层 SKILL 的区别:produce 层负责生成内容, asset-manager 负责生成后的产物管理(归档、检索、标签)。

日本語の概要は準備中です。原文の説明を表示しています。

ZJU-REAL/Easel3,5932026年10月12日 更新

音频降噪:去除录音中的背景噪声、电流声、风噪、嗡嗡声,基于 ffmpeg 滤镜链(afftdn/highpass/lowpass)。 当用户说"降噪""去噪""去杂音""消除背景噪声""电流声""风噪""录音有杂音""音频降噪"时使用。 和 audio-editing 的区别:audio-editing 做剪辑/转码/音量等通用音频操作(内置 denoise 兜底),本 SKILL 专做降噪调参。

日本語の概要は準備中です。原文の説明を表示しています。

ZJU-REAL/Easel3,5932026年10月12日 更新

通用音频处理:音频剪辑/裁剪、格式转码(mp3/wav/m4a/aac)、音量归一化、从视频提取音轨、多段拼接、淡入淡出、变速(保音高)。当用户说“剪音频”“裁一段”“转成 mp3”“调音量/响度”“提取音轨/扒音频”“拼接音频”“淡入淡出”“加速/减速音频”“变速不变调”时使用。与 audio-denoise 的区别:audio-denoise 专做降噪,audio-editing 做除降噪外的通用音频操作(也内置 denoise 作为兜底)。

日本語の概要は準備中です。原文の説明を表示しています。

ZJU-REAL/Easel3,5932026年10月12日 更新

ZJU-REAL のスキルをすべて見る

このスキルの問題を報告する