name: ecommerce-livestream-overlay-generator description: > 電商直播貼片生成器 / 電商直播視覺包裝工具。 適用於淘寶直播、抖音直播帶貨、拼多多直播、快手直播等電商直播場景。 輸入品牌、產品、促銷資訊或產品照片，自動生成完整電商直播視覺包裝： 背景、標題欄、主播形象、價格卡、產品貨架、福利條、促銷貼片。 支援綠幕摳圖、自動合成預覽、打包交付。 E-commerce livestream overlay generator for Taobao, Douyin, PDD, Kuaishou streaming. Generate background, title banner, host persona, pricing card, product shelf, benefits bar. Supports green screen removal, auto-composite preview, and packaged delivery. homepage: https://github.com/gaoyuji12138/e-commerce-livestream-overlay-skill user-invocable: true metadata: '{"openclaw":{"emoji":"🎨","primaryEnv":"VOLCENGINE_ARK_API_KEY","requires":{"env":["VOLCENGINE_ARK_API_KEY"],"bins":["python3","pip3"]}}}'

直播間裝修貼片生成 Skill

一、前置條件

依賴

• Python 3 + Pillow + opencv-python-headless + numpy
• 火山方舟 API Key

API Key 獲取

1. 前往 火山引擎控制台 註冊並登入
2. 在「模型推理」頁面開通豆包視覺模型
3. 在控制台憑證頁面建立 API Key

每個使用者需要自己的 API Key：使用時從環境變數 VOLCENGINE_ARK_API_KEY 讀取。

安裝依賴

pip3 install Pillow==12.2.0 opencv-python-headless==4.13.0 numpy==2.3.2

二、資料隱私與透明度

資料流向

AI 內建視覺能力：當用戶僅提供產品照片未附文字說明時，由 AI Agent 內建視覺能力識別圖中商品資訊（本地執行），無需額外 API 呼叫。

本 Skill 不會做的事： - ❌ 在本地或遠端儲存、記錄或快取使用者輸入資料（文本 Prompt、產品照片） - ❌ 將資料轉發到火山引擎以外的任何第三方 - ❌ 進行任何購買、支付或金融操作 - ❌ 進行任何加密貨幣或區塊鏈操作

⚠️ 使用者產品照片和文本 Prompt 會發送至火山引擎 API。上傳敏感或專有產品圖片前，請閱讀火山引擎隱私政策。API 返回的生成圖片會儲存到本地輸出目錄。

三、需求確認（正式生成前必須執行）

⚠️ 收到使用者生成請求後，不要立即開始生成圖片。先確認以下資訊，確保一次性出圖到位。

2.1 必須確認的資訊

2.2 確認流程

1. 使用者已提供完整資訊 → 列出理解的需求摘要，請使用者確認後直接開始
2. 使用者資訊不完整 → 只追問缺失的必要資訊，其他自動推導
3. 使用者只發了商品圖片沒文字 → 識別圖中商品，推測品牌和品類，列出理解的需求摘要請使用者確認
4. 使用者說"按案例來"/"照著做" → 直接用下方案例的需求生成

2.4 需求描述案例（首次觸發時主動展示）

收到使用者的生成請求後，主動展示以下案例，讓使用者可以照著描述或直接要求按案例生成。

示例需求描述：

做一套戴森吹風機直播間貼片，主品是戴森Supersonic HD16吹風機和Airwrap多功能美髮棒，買吹風機送兩支造型風嘴，滿3000減300，直播間限定禮盒包裝

首次回覆模板：

你可以直接告訴我你的品牌和促銷資訊，比如：

> 做一套戴森吹風機直播間貼片，主品是戴森Supersonic HD16吹風機和Airwrap多功能美髮棒，買吹風機送兩支造型風嘴，滿3000減300，直播間限定禮盒包裝

也可以直接說「按戴森案例來」，我就直接用這個需求生成。

你的需求是什麼？

最低限度只需提供：品牌 + 主推商品 + 促銷活動（三個核心資訊） 文案、風格色調、人物造型、權益均由 AI 自動推導生成，使用者可選擇性修改。

四、文案自動生成規則

3.1 主標題

• 必須含品牌名並具有氛圍感
• 停用"官方""旗艦"等字樣
• 不能直接寫商品名，要有宣感測和下單慾望

3.2 副標題

• 核心利益點（福利/功效/場景）或正在進行的活動
• 簡潔有力

3.3 促銷豎卡

• 根據促銷活動拆分為 2-3 層
• 每層包含：金額/權益 + 使用條件

3.4 權益文案

• 通常 3 個：贈品相關 + 正品保障 + 物流/售後

  7w4.net小蔥技能站收錄全網優質技能，值得收藏。

• ⚠️ 避免使用"正品""保障"等觸發稽核的詞，替換為"品質""保證"

五、元件清單與尺寸

⚠️ 尺寸已根據 doubao-seedream-4-5-251128 的最低畫素限制調整

六、Prompt 寫法標準

核心原則

• 所有元件使用統一風格字首確保色調一致
• 必須包含反向約束條件
• 背景圖使用"純色均勻綠色背景"（不是#00FF00）

5.1 背景圖 Prompt

約束：無文字、無人物、無產品。

模板：

融合[風格描述]的C4D商業空間場景。[主色調]為主色調，[輔助色]輔助，[點綴色]點綴，[中性色]平衡。空間結構[結構描述]，[氛圍]氛圍。燈光[燈光描述]，突顯質感與層次。材質[材質]，展現[風格]魅力。佈局上[元素1]、[元素2]、[元素3]等抽象展示元素散落，營造[整體感受]空間體驗。

5.2 標題橫卡 Prompt

模板：

純色均勻綠色背景#00FF00。畫面正中是一個[顏色]漸變的異形橫條卡片，卡片有[邊框質感]，四邊是不規則的藝術形狀。卡片內部左側[文字區域底色]，大字「[主標題]」用[字型描述]，下方「[副標題]」用[字型描述]。卡片右側是[產品插畫描述]。整個卡片顏色濃郁厚重，絕對沒有白色底色區域，不要任何綠色青色藍綠色。卡片是一個完整的實體貼紙，邊界清晰。

5.3 人物 Prompt

⚠️ 核心規則（v2 更新）： 1. 人物模型用 doubao-seedream-5-0-260128（其他元件仍用 doubao-seedream-4-5-251128） 2. 完全不化妝的素顏（不是"清透裸妝"） 3. 不手持商品，雙手自然下垂微曲（v2 取消了手持商品） 4. 網紅幼態臉短中庭，眼部輪廓深邃有水潤感，唇部有果凍感水潤飽滿 5. 服裝必須提前設計好，prompt 中完整描述上衣+下裝（不含鞋子）+ 配飾 6. 髮色儘量黑色，髮質柔順有光澤，髮型精緻可加配飾，符合品牌調性 7. 背景用"純色均勻綠色"（不是#00FF00）

模板：

純色均勻綠色背景（無漸變無紋理）。豎版人像，頭頂到大腿中段，人物居中佔滿畫面。25歲年輕女主播，完全素顏，冷白皮，網紅幼態臉短中庭，{眼型描述}，眼部深邃有水潤感，{眼周描述}，唇部{唇型描述}有果凍感水潤{唇色描述}，{氣質描述}。面部無任何妝容。身穿{上衣描述}，下身{下裝描述}，{配飾描述}。{髮型髮色描述}，{髮型配飾描述}。正面柔和燈光，雙手自然下垂微曲。

人物造型設計示例（v2 版）：

蘭蔻菁純：

網紅幼態臉短中庭，眼型圓眼微微下垂顯無辜感，眼部輪廓深邃有水潤感，眼周皮膚細膩透亮，唇部飽滿嘟嘟唇有果凍感水潤透亮，五官精緻甜美親和。身穿白色細針織短款開衫，內搭米白色蕾絲吊帶，下身穿高腰淺粉色百褶緞面半裙，胸前戴一條玫瑰金細鎖骨鏈，左手腕戴一隻玫瑰金細手鐲，右手戴一枚簡約珍珠戒指。黑色長直髮柔順有光澤披落至鎖骨下方，頭頂偏右側夾一個珍珠小發夾，幾縷碎髮自然垂落在臉頰兩側修飾臉型。

5.4 促銷豎卡 Prompt

⚠️ 尺寸從 896×1344 改為 1920×1920（正方形）

模板：

純色均勻綠色背景#00FF00。畫面正中是一個緊湊的豎向異形標籤貼紙，整體為[深色系]實心底色，沒有任何白色區域、沒有任何淺色區域、沒有任何漸變到白色的部分，不要任何綠色青色藍綠色。貼紙形狀為圓角矩形加頂部弧形裝飾。頂部有[裝飾元素]。大字「[大標題]」用[字型描述]；下方分三層：「[內容1]」「[內容2]」「[內容3]」。整個貼紙顏色濃郁深實，邊界清晰銳利，是一個實心異形貼紙。貼紙佔據畫面約40%面積，緊湊不鬆散。

5.5 桌面商品貼 Prompt（⚠️ 與原始 skill 完全不同）

⚠️ 關鍵區別： 1. 白色啞光大理石展示桌面（不是純綠底+白平面） 2. 分層聚核+左右映象+前後遞進佈局邏輯 3. 商品總數至少40個以上單品（不是"豐富一些"） 4. 中層核心區分左中右三塊，中心區視覺焦點

模板：

純色均勻綠色背景。畫面下方白色啞光大理石展示桌面（佔畫面底部40%），產品按分層聚核+左右映象+前後遞進佈局，≥40單品密集排列。【中層核心區】左中右三塊，中心視覺焦點：{產品佈局描述}。所有產品豎立正面朝向觀眾，階梯狀層次。除商品和白色金屬陳列架外無其他內容，禁止出現人體任何部位。光線均勻自然，純靜物陳列。

⚠️ prod_layout 裡不能出現"最前方留手持位"——手持商品是人物圖的事，桌面商品貼是純產品陳列

5.7 使用者商品圖（可選）

當用戶提供真實商品照片時：

a) 去背景：根據商品圖的背景型別選擇策略

import cv2, numpy as np
def remove_white_bg(img_path, output_path):
    """HSV 閾值去除白色/淺色背景，輸出 RGBA PNG"""
    img = cv2.imread(img_path)
    hsv = cv2.cvtColor(img, cv2.COLOR_BGR2HSV)
    mask = cv2.bitwise_or(
        cv2.inRange(hsv, np.array([0,0,200]), np.array([180,30,255])),
        cv2.inRange(hsv, np.array([0,0,160]), np.array([180,50,240])))
    k = cv2.getStructuringElement(cv2.MORPH_ELLIPSE, (7,7))
    mask = cv2.GaussianBlur(cv2.morphologyEx(cv2.morphologyEx(mask, cv2.MORPH_CLOSE, k, 5), cv2.MORPH_OPEN, k, 3), (5,5), 0)
    mask = (mask > 200).astype(np.uint8) * 255
    b, g, r = cv2.split(img)
    cv2.imwrite(output_path, cv2.merge([b, g, r, 255 - mask]))

b) 桌面商品貼 Prompt 調整：中心區留白，供使用者商品圖疊加

在原有的桌面商品貼 prompt 中，將中心區描述改為：
"中心區域留出足夠的空白空間用於放置主推商品（大約佔中心30%面積保持乾淨），
周邊按分層聚核加左右映象加前後遞進邏輯擺放配套產品"

c) 合成時疊加：使用者商品圖縮放後放在產品區域中心偏上

d) 新增交付物：

5.6 權益下貼 Prompt

模板：

左右對稱構圖，平視視角。核心元素呈現在上半部分：三個簡單權益圖示，下方對應文字「[權益1] / [權益2] / [權益3]」。背景[背景描述]。風格：平面，光影簡約。色彩：[主色]，簡潔大方。

七、生圖 API

請求引數

{
  "model": "doubao-seedream-4-5-251128",
  "stream": false,
  "watermark": false,
  "sequential_image_generation": "disabled",
  "prompt": "<中文prompt>",
  "size": "<寬>x<高>"
}

請求示例

八、綠幕摳圖

對元件 2（標題橫卡）、3（人物）、4（促銷豎卡）、5（桌面商品貼）執行綠幕去除。

import cv2, numpy as np
def remove_green(img_path, output_path):
    """HSV 閾值去除綠幕背景，輸出 RGBA PNG"""
    img = cv2.imread(img_path)
    hsv = cv2.cvtColor(img, cv2.COLOR_BGR2HSV)
    mask = cv2.bitwise_or(
        cv2.inRange(hsv, np.array([35,80,80]), np.array([85,255,255])),
        cv2.inRange(hsv, np.array([30,40,120]), np.array([90,255,255])))
    k = cv2.getStructuringElement(cv2.MORPH_ELLIPSE, (5,5))
    mask = cv2.GaussianBlur(cv2.morphologyEx(cv2.morphologyEx(mask, cv2.MORPH_CLOSE, k, 3), cv2.MORPH_OPEN, k, 2), (3,3), 0)
    mask = (mask > 127).astype(np.uint8) * 255
    b, g, r = cv2.split(img)
    cv2.imwrite(output_path, cv2.merge([b, g, r, 255 - mask]))

九、合成預覽

⚠️ 佈局引數與原始 skill 完全不同

佈局引數

layout = {
    "title":   {"scale": 0.95, "pos": "center-top", "y_pct": 0.07},
    "person":  {"scale": 0.70, "pos": "left", "x_pct": 0.15, "y_pct": 0.14},
    "promo":   {"scale": 0.40, "pos": "right", "x_pct": 0.55, "y_pct": 0.22},
    "product": {"zoom": 1.2,  "pos": "bottom-full", "above": "benefit"},
    "benefit": {"scale": 1.0,  "pos": "bottom-full"},
}

合成程式碼

from PIL import Image
def compose_preview(bg_path, person_nobg, title_nobg, promo_nobg, product_nobg, benefit_path, output_path):
    bg = Image.open(bg_path).convert("RGBA"); cw, ch = bg.size
    def fit(img, w_ratio, center=True):
        w = int(cw * w_ratio); s = w / img.width
        r = img.resize((w, int(img.height * s)), Image.LANCZOS)
        return r, (cw - w) // 2 if center else cw - w
    def fit_full(img):
        s = cw / img.width; return img.resize((cw, int(img.height * s)), Image.LANCZOS)
    def zoom_crop(img, zoom):
        w = int(cw * zoom); s = w / img.width; h = int(img.height * s)
        r = img.resize((w, h), Image.LANCZOS); cx = (w - cw) // 2
        return r.crop((cx, 0, cx + cw, h))
    title = Image.open(title_nobg).convert("RGBA")
    person = Image.open(person_nobg).convert("RGBA")
    promo = Image.open(promo_nobg).convert("RGBA")
    product = Image.open(product_nobg).convert("RGBA")
    benefit = Image.open(benefit_path).convert("RGBA")
    tr, tx = fit(title, 0.95); ty = int(ch * 0.07)
    prr, prx = fit(promo, 0.40, center=False); prx = int(cw * 0.55); pry = int(ch * 0.22)
    per, perx = fit(person, 0.70); perx = int(cw * 0.15); pery = int(ch * 0.14)
    pdr = zoom_crop(product, 1.2); pdy = ch - fit_full(benefit).height - pdr.height
    bfr = fit_full(benefit); bfy = ch - bfr.height
    canvas = bg.copy()
    for img, pos in [(prr,(prx,pry)),(per,(perx,pery)),(pdr,(0,pdy)),(tr,(tx,ty)),(bfr,(0,bfy))]:
        canvas.paste(img, pos, img)
    canvas.convert("RGB").save(output_path, "JPEG", quality=95)

後處理：人物提亮

合成前對人物圖層單獨提亮，避免合成後人物偏暗：

from PIL import ImageEnhance
person_bright = ImageEnhance.Brightness(person).enhance(1.17)

⚠️ 只提亮人物圖層（17%），不動其他圖層。最終交付的人物.png 也使用提亮後的版本。

十、打包交付

交付檔案（固定7個）

若提供了使用者商品圖，該商品圖會合成到桌面商品貼的中心區域，不單獨輸出。

交付方式（二選一，自動判斷）

方式一：對話內直接傳送（當通道支援檔案傳送時） 1. 先發送預覽圖（預覽.jpg）到對話 2. 再發送壓縮包（命名為「{品牌名}直播間_全套貼圖.zip」，內含上述7個檔案）

方式二：桌面資料夾（當通道不支援檔案傳送時） 1. 在使用者桌面建立資料夾，命名為「{品牌名}直播間貼片」 2. 資料夾內只放上述7個檔案，不包含中間檔案、不包含壓縮包 3. 用 open 命令直接開啟預覽圖，讓使用者看到效果 4. 用 open 命令直接開啟資料夾，讓使用者瀏覽檔案

⚠️ 注意：webchat（Control UI）當前不支援檔案傳送，走方式二。飛書、微信等走方式一。

十、完整工作流

1. 收集需求（品牌、促銷活動、可選：使用者商品圖）
2. 分析品牌風格 → 確定色調
3. 為人物設計造型（幼態臉+水潤眼+果凍唇+服裝+髮型髮色+配飾）
4. 自動生成缺失文案
5. 編寫 6 個元件的 prompt（人物用 v2 模板，不用手持商品）
   - 若有使用者商品圖：桌面商品貼 prompt 中心區留白
6. 通用元件呼叫 doubao-seedream-4-5-251128，人物元件呼叫 doubao-seedream-5-0-260128
7. 對元件 2/3/4/5 執行綠幕摳圖
8. 對人物圖層提亮17%（ImageEnhance.Brightness 1.17）
9. [可選] 對使用者商品圖執行去背景（白底/淺色背景用HSV閾值）
10. 合成預覽圖（使用提亮後的人物圖層，使用者商品圖疊加在桌面產品區中央）
11. 打包交付

這是一款實用且功能較完整的電商直播貼片生成工具，操作流程清晰，對使用者需求的把握較為細緻，能夠根據品牌和促銷資訊自動生成完整的直播間視覺套裝。優點是文件規範、示例豐富、交付物明確，生成效果有較好的可控性。不足是目前缺少可直接執行的自動化執行指令碼，使用者實際使用時需要自行組合各環節程式碼，門檻略高。整體質量中上，細節打磨可進一步提升。