Communitygithub.com

新視覺風格

在 Reel Studio 工作區中為創作者影片建立新的視覺風格(styles/<id>/style.json):透過文字訪談取得名稱、氛圍、顏色及其含義、字體、動態、圖片來源、參考連結與圖片,然後撰寫風格使其顯示在「風格」頁面中,供新影片使用。當創作者要求新風格或按下「Nuevo estilo」按鈕時使用。

新視覺風格 是什麼?

此技能專為 Reel Studio 設計,能夠引導使用者一步步建立全新的影片視覺風格。它首先透過文字問答收集風格的關鍵元素,包括名稱、氛圍、參考資料、3 到 6 個有含義的顏色、最多三個 Google 字體、動態效果、圖片處理方式以及應避免的元素。接著,技能會根據收集到的資訊自動生成完整的 `style.json` 檔案,並將其放置在 `styles/<id>/` 目錄下。生成的風格會立即顯示在「風格」頁面中,供後續影片使用。此技能無需互動對話,僅透過文字指令進行,並確保新風格與工作區中現有風格的格式完全一致,避免重複。此外,還包含 JSON 驗證步驟以確保檔案格式正確。

相容平台✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/CrissAlvarezH/ai-reel-gen-app/tree/HEAD/.claude/skills/new-style

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

預覽

來自技能 README

…

說明文件

新風格

風格是影片的外觀與動態表現。它位於工作區的 styles/<id>/ 目錄下(所有專案共享),並由其 style.json 描述;Reel Studio 的「風格」頁面會顯示它(色板、字體、外觀、動態、應避免什麼、範例、參考資料),而且可以為新影片套用此風格。請先閱讀現有風格(styles/*/style.json 以及完整的範例 styles/collage-semitono/),以便新風格以相同方式撰寫,且不會重複他已擁有的風格。

用他的語言交談,就像他說話的方式。他無法回應互動對話:請以文字提問。

保持簡潔。 每則訊息只處理一個步驟,幾行簡短文字:一行內包含你的提問和建議,這樣他只需回「sí」或一個字。不要有開場白、不要回顧他已有的風格、不要解釋流程或接下來要做什麼、不要提供冗長的選項清單(最多兩三個,每個只需幾個字)。不要重複他講過的話;直接繼續。

1. 訪談

一次只問一個步驟,依照以下順序;跳過他已經說過的部分。你需要收集的內容:

  1. 名稱 以及一句話描述核心概念:它應該給人什麼感覺,適用於哪種影片。
  2. 參考資料:連結(影片、帳號、看板、網站)和圖片。他可以在對話中貼上或拖放圖片:這些圖片會以專案中 .reel-studio/images/ 的路徑形式出現在他的訊息中;將你使用的圖片複製到 styles/<id>/refs/(該資料夾僅供對話使用)。圖片連結:請下載到該目錄(curl -L)。如果一次有多個檔案:請建立 styles/<id>/refs/ 資料夾並打開它,讓他拖放進去(macOS 使用 open <dir>,Windows 使用 explorer <dir>),然後等他說已經放好了。如果他指定了一個來自「靈感」的 Reels,其影格位於 inspiration/<account>/<code>/(hook.jpg、sheet_NN.jpg)。查看他提供的每一張圖片(讀取它),並用一行說明你從中獲取了什麼。你找到或建議的圖片:請下載到 styles/<id>/refs/ 並在對話中顯示(![…](/workspace-files/styles/<id>/refs/x.jpg)),絕不要只描述它們。
  3. 顏色:3 到 6 種,每種顏色都要說明它在影片中的含義(背景、墨色、標示重點的強調色……)。如果他沒有提供顏色,請根據參考資料提出一個色板,包含十六進位色碼。
  4. 字體:一個用於標題,一個用於內文或標籤,最多三個,皆來自 Google Fonts。如果他沒有想法,請提出建議。
  5. 動態:事物如何出現和移動(逐筆畫繪製、用手丟入、滑入、剪輯切換……)、節奏,以及場景如何轉換。
  6. 圖片:真實照片(處理方式:剪影、半色調、雙色調……)、以程式碼繪製的插圖、圖示,或無圖片。
  7. 應避免什麼:會破壞外觀的元素。

然後以一個精簡的摘要向他展示完整風格(每項一行:名稱、附帶含義的色板、字體、外觀、動態、圖片、應避免的項目),並在撰寫之前徵求他的同意。

2. 撰寫

  • id:名稱轉為小寫並以連字符連接,不含重音符號(例如 cuaderno-apuntes);不能是已存在的名稱。
  • styles/<id>/style.json,使用他的語言(其中的所有文字都會顯示在工作室中):
{
  "name": "Cuaderno de apuntes",
  "summary": "一兩句話:它的外觀及用途。",
  "skill": null,
  "template": null,
  "cutouts": false,
  "palette": [{"name": "Hoja", "hex": "#FAF8F2", "meaning": "背景"}],
  "fonts": [{"family": "Caveat 700", "css": "Caveat, cursive", "weight": 700, "google": "Caveat:wght@700", "use": "標題", "sample": "¿Y si se cae?"}],
  "look": ["每個影格如何構成,一點一項。"],
  "motion": ["事物如何移動。"],
  "sources": ["圖片來源及處理方式。"],
  "avoid": ["什麼會破壞外觀,以及原因。"],
  "examples": [],
  "references": ["styles/<id>/refs/ref-1.jpg"]
}
  • palette 的順序很重要:先背景,再文字顏色,接著線條(網格、邊框),然後是強調色。工作室會根據色板繪製海報和字體範例,因此如果文字顏色不是第二個,可能會導致它們難以閱讀。
  • fonts[].google 是 Google Fonts URL 中的字體系列名稱(例如 Patrick+Hand、Inter:wght@800):工作室會載入它以顯示範例。sample 是使用該字體的簡短文字,來自於該風格適用的影片類型。
  • cutouts:只有當使用 tools/cutout.py 製作照片剪影時才設為 true。
  • references 和 examples 是相對於工作區的路徑。examples 是使用此風格製作的影片中已批准的影格:在產生第一個範例之前保持為空。如果沒有範例,工作室會根據色板和字體繪製海報。
  • 永遠不要設定 "default": true(只有他能更改預設風格)。
  • 驗證 JSON(python3 -m json.tool styles/<id>/style.json)。「風格」頁面會自行顯示它。

skill 和 template 保持為 null:以此風格製作的影片會基於預設風格的範本,並將其外觀更改為其 style.json(工作室會顯示「無範本」)。當他對第一個以此風格製作的影片感到滿意時,可以提議撰寫 styles/<id>/SKILL.md(如何建構:元件、圖片處理方式、聲音)以及從該影片中提取的專屬範本,並將最佳影格加入 examples。

3. 完成

用兩行文字說明:它已經在「風格」頁面中(#/estilos/<id>),並提議在新影片中試用它。

Individual skills in this repo

This repo contains 4 individual skills — each has its own dedicated page.

CrissAlvarezH/animated-video

Make animated videos in code with Remotion (React, SVG, three.js): explainers, character stories, motion graphics, kinetic typography, paper collage and animated infographics, in 2D or 3D, from a script or voiceover, in any aspect ratio. Use when asked to animate a script, make an animated video or Reel, or motion graphics. Not for editing camera footage (video-edit) or AI-generated clips (higgsfield-*).

CrissAlvarezH/persona-hablando

The "Persona hablando + animaciones" format of a Reel Studio video — the creator talks to camera in his own recording; you transcribe it, agree the cuts with him (pauses, flubs, retakes), cut it, and lay the video's style animations over or between his shots. Use for any video whose format.txt says persona-hablando.

CrissAlvarezH/reel-studio

How a narrated explainer video is made in a Reel Studio workspace, in any visual style — script, pictures, voice, images, build, board, sound, mute test, render — following the creator's settings from the studio (profile, format, voice, image sources). Use for any new or revised video in a project's videos/ (projects/<id>/videos/). The video's style adds its own skill (styles/<id>/SKILL.md) for the look and the Remotion kit; LESSONS.md has what past videos taught.

CrissAlvarezH/video-script

Write short-form video scripts that hold viewers, using the creator's own video analytics. Use when choosing the hook of a chosen idea, writing or tightening a script before filming (talking-head or narrated explainer), or turning a posted video's insights into lessons. Coming up with ideas is content-ideas'.

相關技能