brag

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

/brag

/brag

You built it. Now let's brag about it.
/brag
turns the current project website or app into a short, polished, shareable launch video using Hyperframes. It is narrow, opinionated, and fun.
你已经开发完成了它,现在来好好炫耀一番吧。
/brag
功能会借助Hyperframes将当前项目网站或应用转换为一段简短、精致、可分享的启动视频。它的定位精准、风格鲜明且充满趣味。

What this skill does

该功能的作用

  1. Reads the current project code to understand the app.
  2. Plans a short brag concept specific to this project.
  3. Scripts and storyboards the video.
  4. Hands a focused composition brief to Hyperframes.
  5. Validates, renders, and writes share copy.
  1. 读取当前项目代码以理解应用内容。
  2. 为该项目定制专属的简短视频创意方案。
  3. 编写视频脚本并制作分镜故事板。
  4. 向Hyperframes提交一份聚焦的创作brief。
  5. 验证视频内容、渲染输出并撰写分享文案。

Parsing the invocation

调用方式解析

The user may invoke with natural language or flags:
/brag
/brag --tone chaotic
/brag --tone polished --format vertical
/brag this. Make it feel like a ridiculous startup launch.
Parse these options:
OptionValuesDefault
--tone
preset or freeform descriptioninferred
--format
landscape
,
vertical
,
square
landscape
--duration
secondsauto (15-25s)
--no-music
flagmusic on
--no-sfx
flagsfx on
--title
stringinferred from project
Tone can be a preset (
default
,
polished
,
yc-parody
,
chaotic
,
deadpan
,
cinematic
,
app-store
) or a creative direction such as "fake Series A launch from 2016", "museum exhibit", or "overproduced mobile game ad".
When the user gives freeform tone direction, map it to the nearest preset for pacing and structure, but preserve the user's direction in the plan and composition brief.

用户可以通过自然语言或参数标志来调用该功能:
/brag
/brag --tone chaotic
/brag --tone polished --format vertical
/brag this. Make it feel like a ridiculous startup launch.
解析这些选项:
选项可选值默认值
--tone
预设风格或自定义描述自动推断
--format
landscape
,
vertical
,
square
landscape
--duration
秒数自动(15-25秒)
--no-music
标志位开启音乐
--no-sfx
标志位开启音效
--title
字符串从项目中自动推断
风格可以是预设选项(
default
,
polished
,
yc-parody
,
chaotic
,
deadpan
,
cinematic
,
app-store
),也可以是创意导向的描述,比如"2016年的虚假A轮融资发布会"、"博物馆展品风格"或"制作过度的手游广告风格"。
当用户提供自定义风格描述时,将其映射到最接近的预设选项以确定节奏和结构,但在方案和创作brief中保留用户的原始导向。

Output directory

输出目录

By default, output goes to
brag-output/
. To avoid overwriting previous runs, use a timestamped directory:
brag-output-2026-05-04-143022/
Use a timestamp when:
  • The user explicitly asks for a new run without overriding previous results
  • A
    brag-output/
    directory already exists in the project
Generate the timestamp at the start of the run (
YYYY-MM-DD-HHmmss
) and use it consistently for all output paths in that run: plan, brief, composition, render, and share copy.

默认情况下,输出内容会保存到
brag-output/
目录中。为避免覆盖之前的运行结果,可使用带时间戳的目录:
brag-output-2026-05-04-143022/
在以下情况时使用时间戳目录:
  • 用户明确要求新的运行结果且不覆盖之前的内容
  • 项目中已存在
    brag-output/
    目录
在运行开始时生成时间戳(格式为
YYYY-MM-DD-HHmmss
),并在本次运行的所有输出路径中统一使用该时间戳:包括方案、brief、创作文件、渲染结果和分享文案。

Step 1: Inspect the project

步骤1:检查项目

Read: references/step-1-inspect.md
Scan the project directory and extract the information needed to plan the brag video.
Gate: You can answer all 9 questions in the brag planning rubric.

阅读: references/step-1-inspect.md
扫描项目目录并提取规划视频所需的信息。
验证要求: 你能够回答视频规划准则中的全部9个问题。

Step 2: Plan and storyboard

步骤2:规划与制作分镜

Read: references/step-2-plan.md
Write
<output-dir>/brag-plan.md
(where
<output-dir>
is
brag-output/
or the timestamped variant chosen above). Answer the planning rubric. Commit to a creative angle. Write the beat-by-beat storyboard including scenes, text, timing, transitions, and SFX cues.
When music is selected, include a compact
Music cue guidance
section: read the bundled track's cue preset from
assets/music/cues/
if present, otherwise note cues will be detected at composition time (any track now supports beat sync — see
references/audio.md
). Cue metadata is optional timing guidance only: story, readability, pacing, and product clarity stay primary.
Gate:
<output-dir>/brag-plan.md
exists with a full storyboard. Scene durations sum to 15–25 seconds.

阅读: references/step-2-plan.md
编写
<output-dir>/brag-plan.md
(其中
<output-dir>
brag-output/
或上述选择的带时间戳的目录)。回答规划准则中的问题,确定创意方向,编写逐帧分镜故事板,包括场景、文字、时长、转场和音效提示。
当选择音乐时,需包含一个简洁的
音乐提示指南
部分:如果
assets/music/cues/
目录中存在配套的音乐提示预设,则读取该预设;否则注明将在创作阶段检测提示(目前所有曲目均支持节拍同步——详见
references/audio.md
)。提示元数据仅为可选的时长参考:故事性、可读性、节奏和产品清晰度始终是首要考虑因素。
验证要求:
<output-dir>/brag-plan.md
已存在且包含完整的分镜故事板。场景总时长为15-25秒。

Step 3: Hand off to Hyperframes

步骤3:交付给Hyperframes

Read: The Hyperframes domain skills —
hyperframes-core
,
hyperframes-animation
,
hyperframes-creative
,
hyperframes-keyframes
,
hyperframes-cli
. /brag is its own workflow: do not enter the
hyperframes
entry-point intent interview or route into its generic promo / launch-video workflow. Read: references/step-3-compose.md Read: references/audio.md
Write the composition brief and use Hyperframes to create the video implementation in
<output-dir>/composition/
.
/brag
owns the product angle, source material, storyboard, tone, format, audio selection, music cue guidance, and delivery expectations. Hyperframes owns the concrete composition structure, exact animation timing, animation mechanics, runtime choices, linting rules, and render workflow.
Gate:
npx hyperframes check
passes with zero errors inside
<output-dir>/composition/
(the single browser gate before render — see hyperframes-cli for what it audits).

阅读: Hyperframes领域技能文档——
hyperframes-core
,
hyperframes-animation
,
hyperframes-creative
,
hyperframes-keyframes
,
hyperframes-cli
/brag
是独立的工作流:请勿进入
hyperframes
的入口意向访谈或转向其通用的宣传/启动视频工作流。 阅读: references/step-3-compose.md 阅读: references/audio.md
编写创作brief,并使用Hyperframes在
<output-dir>/composition/
目录中创建视频实现文件。
/brag
负责产品定位、素材来源、分镜故事板、风格、格式、音频选择、音乐提示指南和交付预期。Hyperframes负责具体的创作结构、精确的动画时长、动画机制、运行时选择、代码检查规则和渲染工作流。
验证要求:
<output-dir>/composition/
目录中运行
npx hyperframes check
检查结果为零错误(这是渲染前的唯一浏览器端检查——详见hyperframes-cli的审计内容)。

Step 4: Validate, render, and deliver

步骤4:验证、渲染与交付

Read: references/step-4-deliver.md
Validate, preview, render to
<output-dir>/brag.mp4
, pick the best poster frame into
<output-dir>/brag.jpg
, bake that poster as the video's frame 0 so it's the idle thumbnail everywhere, and write
<output-dir>/share-copy.txt
.
Gate:
<output-dir>/brag.mp4
exists. A best-frame poster
<output-dir>/brag.jpg
is picked (not an arbitrary frame) and baked as frame 0 of
brag.mp4
. Share copy is written.

阅读: references/step-4-deliver.md
验证内容、预览视频、渲染输出到
<output-dir>/brag.mp4
,挑选最佳帧作为
<output-dir>/brag.jpg
海报,并将该海报设置为视频的第0帧,使其在所有平台上显示为默认缩略图,最后编写
<output-dir>/share-copy.txt
分享文案。
验证要求:
<output-dir>/brag.mp4
已存在。已挑选最佳帧作为
<output-dir>/brag.jpg
海报(而非任意帧)并将其设置为
brag.mp4
的第0帧。分享文案已编写完成。

Tone system

风格系统

Seven tone presets ship with
/brag
. Each changes scripting energy, pacing, typography personality, and transition style. Presets are defaults, not limits.
Full definitions: references/tones.md
ToneEnergyOne-liner
default
Playful, clean, postableThe good-vibes default
polished
Serious, elegantFor projects that are not jokes
yc-parody
Deadpan startup energyFake seriousness applied to absurd projects
chaotic
Fast, loud, aggressiveOver-the-top and unhinged
deadpan
Calm, dry, understatedThe joke is that nothing is a joke
cinematic
Dramatic, trailer-scaleBig motion, bigger claims
app-store
Smooth, feature-card cleanCorporate but not boring
Always allow a freeform creative direction to refine or override the preset.

/brag
内置7种风格预设。每种预设会改变脚本的活力、节奏、排版风格和转场样式。预设是默认选项,而非限制。
完整定义:references/tones.md
风格活力一句话描述
default
活泼、简洁、适合分享充满愉悦感的默认风格
polished
严肃、优雅适用于非娱乐性质的项目
yc-parody
无厘头的创业风格用虚假的严肃感包装荒诞的项目
chaotic
快速、喧闹、激进夸张且不受约束
deadpan
冷静、平淡、低调笑点在于一切都一本正经
cinematic
戏剧性、预告片规模大动态效果,更夸张的宣传语
app-store
流畅、功能卡片式简洁商业化但不乏味
始终允许用户通过自定义创意导向来细化或覆盖预设风格。

Creative laws

创作准则

These apply to every brag video regardless of tone.
Short. 15–25 seconds. Not one second more without a reason.
Readable. Keep the pace high through motion and cuts, never by flashing text. Every line a viewer must read holds long enough to read it (short label ~0.8s settled; a sentence ~0.3s per word). Fast-in, then hold — never fast-in, then gone.
Specific. The video must feel like it was made for this exact project, not any project.
Show the thing. At least one scene must display actual UI, copy, or a key visual from the product. No abstract filler.
No generic SaaS language. "Streamline your workflow" is banned. Use the project's actual copy and claims.
The hook is everything. The first 2 seconds determine whether someone keeps watching. Plan the hook before anything else.
Funny earns its place. Humor should come from the project's absurdity, not from trying to be funny.
Pattern:
Hook (2-3s) → Reveal (2-4s) → 2-3 sharp highlights (5-12s) → Punchline/outro (2-4s)
Adapt this. Not every project needs exactly 3 highlights. The pattern is a starting shape, not a template.
以下准则适用于所有风格的视频。
简短。 时长为15-25秒。无特殊理由不得超出。
易读。 通过动态效果和剪辑保持节奏,而非快速闪烁文字。观众需要阅读的每一行文字都要停留足够长的时间(短标签约0.8秒稳定显示;句子约每个单词0.3秒)。快速切入后保持显示——切勿快速切入后立即消失。
专属。 视频必须看起来是为该项目量身定制的,而非通用模板。
展示产品。 至少有一个场景要展示产品的实际UI、文案或关键视觉元素。不得使用抽象的填充内容。
禁用通用SaaS话术。 禁止使用"简化你的工作流程"这类话术。使用项目的真实文案和宣传点。
钩子至关重要。 前2秒决定观众是否会继续观看。优先规划钩子内容。
幽默要自然。 幽默应来自项目本身的荒诞性,而非刻意制造笑点。
结构模式:
钩子(2-3秒)→ 展示产品(2-4秒)→ 2-3个突出亮点(5-12秒)→ 收尾/点睛(2-4秒)
可灵活调整该模式。并非每个项目都需要恰好3个亮点。该模式是起始框架,而非固定模板。