/brag (Brag Ultra)
作ったんだから、自慢しよう——Apple品質の超絶技巧で。
呼び出しディスパッチ（最初に必ず実行）
プロジェクトを検査する前に、完全な /brag 呼び出しをパースします。呼び出しに --voice が含まれている場合は voice.enabled = true を設定します。--format または --kit が指定されている場合は、それに応じてレンダリングパイプラインを構成します。
/brag は、現在のプロジェクト（ウェブアプリ、モバイルアプリ、デスクトップGUI、CLI/TUIツール、ライブラリ）を、超高輝度のローンチビデオとソーシャルローンチキットに変換します。
Brag Ultraの機能
- プロジェクトの検査と実際のUI/CLIのキャプチャ: プロジェクトコード、アーキテクチャ、および実行中のインスタンスをスキャンします。実際のモバイルエミュレータ（
adb）、ウェブページ（Puppeteer）、デスクトップウィンドウ、またはターミナルセッション（asciinema/ CSSターミナルフレーム）をキャプチャします。 - マルチフォーマット対応のレスポンシブプランニング: 16:9 ランドスケープ（X、YouTube）、9:16 ポートレート（TikTok、Reels、Shorts）、1:1 スクエア（LinkedIn、Instagram）向けのアダプティブレイアウトを計画します。
- Apple品質のストーリーボードとスクリプト作成: 臨界減衰スプリング、キネティックシェーダー、SVGストロークトレース、そして本物のプロジェクトデータを備えた、インパクトのあるナラティブを制作します。
- インテリジェントオーディオマスタリングとダッキング: ボイスナレーション（Kokoro TTS）下でBGMを自動的に-12dBダッキングし、スムーズな0.3秒アタック/0.5秒リリースカーブで、インパクトレベルの調整されたSFXをミックスします。
- 完全なローンチキットの提供: マルチフォーマットのMP4をレンダリングし、フレーム0から埋め込まれたポスターJPGを抽出し、クリアな2パスアニメーションGIFプレビューを生成し、構造化されたソーシャルコピーと
launch-metadata.jsonを出力します。
呼び出しの解析
ユーザーは自然言語またはフラグで呼び出すことができます：
/brag
/brag --tone polished --format vertical
/brag --format all --kit --voice
/brag --tone chaotic --format square
/brag this CLI tool. Make it feel like an Apple developer keynote.
サポートされているフラグとオプション
| オプション | 値 | デフォルト | 説明 |
|---|---|---|---|
--tone | プリセットまたは自由形式の説明 | apple-keynote / 推測 | 美的スタイルとペーシングスタイル |
--format | landscape (16:9), vertical (9:16), square (1:1), all | landscape | ビデオのアスペクト比とCSSリフローターゲット |
--duration | 秒 (例: 15s, 20s) | 自動 (15–25秒) | 合計時間 |
--voice | フラグ | ナレーションオフ | Kokoroボイスオーバーをオプトインし、-12dB自動ダッキング |
--kit | フラグ | 標準レンダリング | 完全なローンチキット（MP4、GIF、ポスターJPG、メタデータJSON）を生成 |
--terminal | フラグ | 自動検出 | CLI/TUIターミナル再生とクロームを有効化 |
--no-music | フラグ | 音楽オン | BGMを無効化 |
--no-sfx | フラグ | SFXオン | 効果音を無効化 |
--title | 文字列 | 推測 | カスタムプロダクトタイトル |
--format all または --kit が指定された場合、アニメーションGIFとメタデータバンドルとともに、3つのアスペクト比（16:9、9:16、1:1）すべてを生成します。
Brag Ultraの核となる柱
1. マルチフォーマット対応レスポンシブリフロー
不格好な黒帯や単純なレターボックスはありません。構図はインテリジェントにリフローします：
- 16:9 ランドスケープ (
1920x1080): サイドバイサイドの分割レイアウト、デュアルデバイスフレーム、ワイドスクリーンターミナルビュー。 - 9:16 ポートレート (
1080x1920): 中央揃えの縦積み、フルハイトモバイルデバイスフレーム、大きなフォントクランプ、厳格なセーフゾーン（プラットフォームオーバーレイ用の上下パディング）。 - 1:1 スクエア (
1080x1080): タイトな焦点クロップ、中央のヒーローカード、高コントラストタイポグラフィ。
2. インテリジェントオーディオマスタリングとボイスオーバーダッキング
- BGMは、ボイスナレーションやダイアログが再生されるたびに、自動的に -12dB ダッキングされます。
- ダッキングカーブ：発話前 0.3秒スムーズアタック、発話後 0.5秒リリース。
- マスターリミッターとボリュームノーマライゼーション：SFXはデジタルクリッピングなしで0.60～0.85の間でパンチを効かせます。
3. ターミナル / CLI / TUI スクリーンキャプチャ
- ターミナルツール（
pluvia、hyperindex、omnihud、token-trimmerなど）専用サポート。 - 現実的な人間のタイピングケイデンス（40～90msのジッター）、ANSIシンタックスカラー、同期されたキープレスオーディオ（
keyboard/keypress-*.wav）でライブコマンドを再生します。 - Appleの信号機ウィンドウクロームとチタニウムボーダーを備えた高解像度SVG / Canvasターミナルフレーム。
4. キネティックシェーダーとモーションポリッシュ
- フィルムグレインテクスチャ: 微妙なSVG
feTurbulence/ canvasノイズ（3～5%不透明度）がカラーバンディングを排除し、シネマティックな温かみを追加。 - 色収差: 高速カットやスラムインパクトでのマイクロRGBスプリット。
- スプリング物理演算: GSAP臨界減衰カーブ（
ease: "expo.out"、ease: "power4.out"、またはmass: 1, stiffness: 120, damping: 14）。 - SVGストロークトレース: ロゴ、アーキテクチャノード、UIアウトライン用のアニメーションパス描画（
stroke-dashoffset）。
5. 完全なローンチキット生成
ターンキーリリースディレクトリを生成します：
brag.mp4/brag-16x9.mp4、brag-9x16.mp4、brag-1x1.mp4brag.gif（2パスパレット最適化30fpsアニメーションプレビュー、GitHub READMEとDiscord埋め込み用、10MB未満）brag.jpg（高解像度ポスターフレーム、MP4のフレーム0に直接焼き込み）share-copy.txt（簡潔な単一投稿キャプション）share-copy-variants.md（X/Twitter、LinkedIn、Reddit、Product Hunt向けカスタマイズキャプション）launch-metadata.json（OpenGraph、Twitterカードタグ、キーワード、タイムスタンプ）
出力ディレクトリ
デフォルトの出力先は brag-output/（既存の場合はタイムスタンプ付き brag-output-YYYY-MM-DD-HHmmss/）：
brag-output/
brag.mp4 # プライマリレンダリングビデオ
brag-16x9.mp4 # 16:9 ランドスケープレンダリング（マルチフォーマットの場合）
brag-9x16.mp4 # 9:16 ポートレートレンダリング（マルチフォーマットの場合）
brag-1x1.mp4 # 1:1 スクエアレンダリング（マルチフォーマットの場合）
brag.jpg # 高解像度ポスターフレーム（フレーム0に焼き込み）
brag.gif # 高解像度アニメーションGIFプレビュー
brag-plan.md # ストーリーボードとクリエイティブプラン
composition-brief.md # Hyperframes概要
share-copy.txt # プライマリ投稿キャプション
share-copy-variants.md # マルチプラットフォーム投稿コピー
launch-metadata.json # OpenGraphとソーシャルメタデータ
composition/ # Hyperframesソースプロジェクト
ワークフローステップ
- ステップ 1: 検査とライブUI/ターミナルのキャプチャ:
references/step-1-inspect.mdとreferences/capture-workflow.mdを読む - ステップ 2: 計画とストーリーボード:
references/step-2-plan.mdとreferences/apple-design-guide.mdを読む - ステップ 3: Hyperframesで構成:
references/step-3-compose.mdとreferences/audio.mdを読む - ステップ 4: 検証、レンダリング、ローンチキットの提供:
references/step-4-deliver.mdを読む
トーンプリセット
完全な定義は references/tones.md を参照：
| トーン | エネルギー | 一言 |
|---|---|---|
apple-keynote | 静かな自信、触覚的な物理演算、高尚な抑制 | Appleフラッグシップ製品発表の美学 |
default | 遊び心、クリーン、投稿可能 | 良い雰囲気のコンシューマー＆クリエイティブショーケース |
polished | シリアス、エレガント、高度なクラフトマンシップ | プレミアム開発者ツールまたはエンタープライズ製品 |
yc-parody | 無表情なスタートアップのエネルギー | 大胆または奇抜なコンセプトのシリアスな表現 |
chaotic | 速い、うるさい、手に負えない | 高速ハイプ動画 |
deadpan | 落ち着いた、ドライ、控えめ | 抑制がオチとなるミニマリストタイミング |
cinematic | ドラマチック、大作規模 | 大きな動き、オーケストラ/シンセの高まり、トレーラーペーシング |
app-store | スムーズ、フィーチャーカードのクリーンさ | 触覚的なマイクロインタラクションを備えたシャープなUIウォークスルー |