Communitygithub.com

運動提示撰寫器

為您的品牌撰寫完整的 Claude Motion 提示(8 部分),用於一則短循環動畫。只需提供您的品牌(網站截圖、商標、十六進位色碼等)和您想展示的時刻。

運動提示撰寫器 是什麼?

此技能專為 Claude Motion 設計,旨在幫助使用者快速生成結構化、品牌化的動畫提示。它要求使用者提供品牌素材(如網站截圖、商標、十六進位色碼,或使用預設的 Apple 風格)以及一個想展示的「時刻」。技能會引導使用者補齊必要資訊:畫面變化內容、螢幕上的確切文字與數字、畫面尺寸,以及品牌資訊。接著,它會依據一套固定的 8 部分結構(品質標準、格式、單一規則、外觀、動態、禁忌、檢查清單與場景)撰寫完整的提示。技能會確保品牌色碼的真實性,避免猜測,並在場景變化時僅更新第 8 部分,方便重複使用。最終輸出包含品牌聲明、完整提示程式碼區塊,以及可替換的備用場景列表,並建議使用者儲存固定部分為 `motion-brief.md` 以簡化後續流程。

相容平台✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/charlie947/motion-graphics-skills/tree/main/skills/motion-prompt-writer

在你喜歡的 AI 中提問

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

說明文件

您撰寫 Claude Motion 提示,共分 8 部分。您絕不自己製作影片。

第 1 至第 7 部分是簡報。同一個品牌的每部影片,這部分都保持不變。 第 8 部分是場景。這是唯一會改變的部分。

<8_部分>

  1. 標準:一行描述品質等級,加上「如果它在 [標準] 中無法存活,就不算完成」。
  2. 格式:寬 x 高(像素)、精確秒數(預設 6 秒)、無縫循環(最後一幀與第一幀匹配)、音樂開或關。
  3. 唯一規則:一個主角物件佔據畫面的 60 至 70%,並展示一個令人滿足的變化,然後重置。
  4. 外觀:背景、深度(陰影、玻璃、高光)、真實元件、1 或 2 個強調色(十六進位色碼)、字體、主角文字或數字至少 120px、標籤從不小於 34px、螢幕上最多 5 個字詞。
  5. 動態:帶有小緩衝的彈簧物理效果,無線性動畫,保持變化後狀態至少 1.2 秒,總有一件事保持生動但只有一個焦點。
  6. 禁忌:灰色佔位條、庫存圖示、表情符號、剪貼畫、淺色品牌下的深色或雜亂背景、漂浮在空白區域的小物件、其他品牌的真實商標。
  7. 完成前:每秒渲染一張靜止幀,以設計總監的標準判斷每一張,然後在 200px 寬度下再次判斷,修正任何顯得普通、廉價、太小或空白的部分。
  8. 場景:用兩三句話描述一個時刻。 並加上簡短的獨創性說明:每個元素都是原創的,絕不複製真實產品的 UI、圖示或商標,並直接開始建置,無需詢問確認。 </8_部分>

<apple_風格預設> 當我沒有品牌時使用此設定。標示為「Apple 風格預設,請替換為您的品牌」。

  • 標準:Apple 主題演講品質。觸感、實體、精確、昂貴。
  • 外觀:淺色背景 #F5F5F7、分層柔和陰影、帶有明亮 1px 邊緣的磨砂玻璃面板、macOS 和 iOS 級別的圓角方塊和小工具。節制使用系統顏色:藍色 #0A84FF、綠色 #30D158、橙色 #FF9F0A、紅色 #FF453A、紫色 #BF5AF2(每個作品使用一到兩種)。字體:Inter 或 system-ui,緊湊字距,粗體。 </apple_風格預設>

<輸出格式> 僅三個部分。 第 1 部分:一行說明您使用了哪個品牌(我的品牌,或 Apple 風格預設)。 第 2 部分:完整提示放在一個程式碼區塊中。以「為我製作一個動畫圖形。嚴格遵循此動畫簡報:」開頭,然後是「# 動畫簡報:<名稱>」標題,接著是「## 」標題下的上述 8 部分,最後是「## 獨創性」。 第 3 部分:兩三個可替換到第 8 部分的額外場景,每行一個,使用相同品牌。 告訴我將第 1 至第 7 部分儲存為 motion-brief.md,附加到任何 Motion 對話中,下次僅更改「場景」部分。 </輸出格式>

<範例> <範例>「製作一個顯示我的註冊人數上升的動畫」,沒有數字 -> 詢問真實數字。先不要撰寫提示。</範例> <範例>我的網站截圖,帶有清晰的海軍藍和橙色 -> 在外觀中使用這些十六進位色碼。省略任何非我所有的商標。</範例> <範例>「一個變成勾選標記的按鈕」,沒有品牌 -> 使用 Apple 風格預設撰寫完整提示,並標示清楚。</範例> </範例>

如果缺少時刻或真實文字與數字,僅詢問這些內容並等待。如果我提供了所有資訊,則直接撰寫提示。

Individual skills in this repo

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

animated-chart

Make a looping animated chart for LinkedIn or a newsletter in code with Claude Code. Bars that become a line, a number that counts up, a before and after. Every value stays exactly as given. Use when someone says

apple-launch-film

Rebuild an Apple-style Mac launch film entirely in code with Claude Code. A thin menu bar, the black notch growing into widgets one scene at a time, full-screen gradient wallpapers and one short caption per scene. No screen recording, no After Effects. Use when someone says

brand-intake

The setup step every other skill in this pack reads. A short interview plus 3 to 5 reference frames becomes two files in your project, brand.md (who you are, what you sell, your assets) and MOTION.md (your colours, type, timing and motion rules), plus a rule in CLAUDE.md so Claude reads them before it animates anything. Use at the start of any motion project, or when someone says

launch-video

Make a 30-45 second product launch video in code with Claude Code, the kind SaaS companies post on launch day. One sentence split across scenes, real product screens with slow camera moves, a typed prompt, a proof beat and a clear call to action. Use when someone says

loop-cover

Turn a newsletter or blog cover into a seamless looping GIF at 896 x 640, 180 frames at 20fps. Only the one element you name moves, the loop is rotated so frame 1 shows the finished picture, and the seam is measured, not eyeballed. Use when someone says

milestone-reveal

Make a 12-second looping milestone clip in code with Claude Code. Thousands of tiny points drift like a night sky, pull together into your real number (followers, subscribers, revenue, customers), a line draws underneath and the label settles in. Premium, not a party. Use when someone says

model-showdown

Give the same motion brief to three AI models, keep each first try, render all three the same way and stack them into one comparison video with model names and logos. Makes a 16:9 side-by-side for a newsletter and a 1080 x 1920 stacked reel for Instagram and TikTok. Use when someone says

motion-brief-writer

Turns a rough idea for an animated graphic into a precise build brief for Claude Code, in your own brand. Asks for anything essential first (exact numbers, size, length, brand), keeps real results apart from sample data, and never invents a figure. Use when someone says

motion-effects

Build any of 16 premium motion effects from scratch in your own brand, as one 8-second looping HTML file with window.seek(seconds) so it exports frame-exact to MP4 or GIF. Interfaces (button to player, search to results, card to workspace, tabs to panels), data (chart morph, dashboard zoom, spring stack, magnetic dock), type (masked type, elastic type, text to layout, image reveal) and systems (perspective shift, glass focus, flowing paths, particle logo). Use when someone says

newsletter-promo

Turn a newsletter edition into a 12-20 second promo clip for LinkedIn, Instagram or X that drives people to read and subscribe. Hook question, three proof frames from the edition, then the newsletter name and where to read it. Use when someone says

reel-export

Turn any horizontal or square motion video into a 1080 x 1920 Instagram Reel or TikTok that uploads cleanly. Headline and logos inside the safe zone, H.264, yuv420p, limited colour range, bt709, a silent audio track when there is no sound, and an ffprobe check before upload. Use when someone says

reference-to-motion

Turn references you admire into a scene-by-scene Claude Motion prompt for your own topic and brand. Takes a video for the moves (screenshots, frames or a contact sheet of a reel or ad) and, optionally, a look reference for the style (a website, a brand, a moodboard). Use when someone says

title-sequence-3d

Make a cinematic 3D title sequence (8-15 seconds) in code with Claude Code and Three.js. A camera moves through a lit scene, such as a rainy street at night with brand names as neon signs, then a big question or title lands. Use when someone wants a scroll-stopping opener, a film-style intro,

vox-explainer

Make a short Vox-style documentary explainer (30-60 seconds) entirely in code with Claude Code. Torn paper, halftone texture, bold condensed type, motion on twos. Use when someone says

相關技能