Communitygithub.com

vos-remix

vos.soギャラリーのプログラムを自分のものとしてリミックス — 設定を取得し、ノブやコードをローカルで編集し、`vos check` で検証、バージョン管理された系譜を持つプライベートコピーをプッシュします。params/Looksの原則とGLB 3Dショーケースレシピを継承。ギャラリーアニメーションのリミックスやカスタマイズ、3Dモデルの差し替え、取得したプログラムのバージョン反復を求められた際に使用します。

vos-remix とは?

vos-remixは、vos.soギャラリー上の動画プログラムをリミックスするためのCLIベースのスキルです。全てのギャラリー動画は入力+決定論的関数=動画というプログラム構造を持ち、リミックスはそのJSON設定をローカルで編集し、ユーザーアカウント上のプライベートvosとしてプッシュすることで行います。このプロセスには取得、編集、検証、プッシュ、反復、プルという明確なループが含まれ、各ステップで`vos` CLIが利用されます。リミックスグラントやデュラブルキーによる認証、クレーム可能なプッシュなどの認証方式をサポートし、プライバシーとクォータ管理を重視しています。関数フィールドはJavaScriptの文字列として扱い、パラメータノブとルックの宣言に関するルールが定められています。また、3Dモデル差し替え用のレシピや、サーバーレンダリングの制約(DoubleSideや分散効果の禁止など)もドキュメント化されています。

対応~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/vosjs/skills/tree/main/skills/vos-remix

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

vosプログラムをリミックスする

vos.so/gallery のすべての動画はプログラムです。 入力 + 決定論的関数 → 動画。リミックスとは、そのプログラムの JSON設定を編集し、その結果をユーザーのアカウント上に プライベート な vos としてプッシュし、系譜を残すことです。ローカルで編集し、プラットフォームが検証、 コンパイル、プレビューをレンダリングします。

セットアップ

npm i -D @vosjs/cli   # fetch/check/push/pull ループ

このループにブラウザは不要です(プレビューのレンダリングはプラットフォーム上で行われます)。 CLIが利用できない場合、すべての操作はプレーンなHTTPでも機能します: references/remix-contract.md に各エンドポイントがドキュメント化されています。

認証情報(決して出力しないでください)

2つの形式があり、両方とも Authorization: Bearer として使用します。

  1. リミックスグラント (vos_rg_…) — ユーザーのプロンプトに含まれている場合に使用します。 24時間の有効期間、1つのソースvosに紐付き、最大5回のプッシュが可能です。
  2. デュラブルキー (vos_sk_…) — 問い合わせる前に以下の順序で解決します: VOS_API_KEY 環境変数、次に ~/.config/vos/credentials の最初の行。 人間は https://vos.so/app/api でキーを作成します。
  3. 認証情報がない場合 — クレーム可能なプッシュ(プログラムのみ):
    vos push my-remix.json --claimable --title "My remix"
    # → claim: https://vos.so/claim/…   expires: <今から72時間>
    
    # CLIがない場合、または古いCLIの場合?同じことをプレーンHTTPで:
    curl -s -X POST https://vos.so/api/claim \
      -H 'content-type: application/json' \
      -d '{"title": "My remix", "config": <VosConfigJson>}'
    # → { "claimUrl": "https://vos.so/claim/…", "expiresAt": "…" }
    
    claimUrl をユーザーに渡し、それ以外の場所には渡さないでください — これが唯一の参照であり、 唯一の認証情報です。リンクは72時間有効です。クレームされなかった作業はその後削除されます(データ損失ではなく意図的なクリーンアップです — 期限切れの場合は再プッシュしてください)。クレームによりvosはユーザーのライブラリに移動し、ホストされたプレビューが開始されます。クレーム後の反復はユーザーのキーを使用します(以下のループ)。 制限:設定ファイル200KB以下、ネットワークあたり1日5回のプッシュまで。

CLIはグラントとキーを自動的に解決します(export VOS_API_KEY=…)。どの 形式でも公開はできません。プッシュされたvosは、人間がvos.soで公開するまでプライベートのままです。

ループ

  1. 取得 ソースプログラムを取得します(公開プログラムは認証不要):

    vos fetch https://vos.so/vos/<id>        # またはIDのみ
    # → <slug>/config.json (params保持) + <slug>/vos.json (追跡用)
    
  2. 編集 config.json をローカルで編集します。関数フィールド(setup、 createContent、createTimeline、onFrame)はJavaScript 文字列 です — TypeScript構文や ${} テンプレート補間は使用できません。 1〜2の軸を決定的に変更します(パレット、モーション文法、密度) — 決して 10%の微調整の重複は避けてください。プログラムが params を宣言している場合は、関数文字列の手術よりも それらのノブを再調整または拡張することを優先してください。

  3. ノブとルックを宣言 — リミックスのコントロールサーフェス。目的に基づいた名前のパラメータ2〜4個と、プリセット2〜3個。 これはルールのある技術です:references/params-knobs.md。

  4. ローカルでチェック プッシュする前に:

    vos check <slug>/config.json     # 移行 → スキーマ → 構文 → コンパイル → リント
    vos still <slug>/config.json probe.webp --time 2   # 実行 — コンパイルはチェック済み
                                     # ただしモジュールは決して実行しません。実行時
                                     # エラー(関数自身の宣言に対するTDZ)はチェックだけでは
                                     # 目に見えません。コード編集のたびに、プッシュ前に必ず静止画を
                                     # レンダリングしてください。
    

    すべてのエラーを修正し、決定論に関する警告を真剣に受け止めてください(実行ごとに異なるレンダリング結果になる設定は、 定義上、壊れています)。

  5. プッシュ 系譜を持つプライベートvosとして(CLIは設定ファイルの隣にある vos.json を読み取り、 remixOfId のクレジットを設定します):

    vos push <slug>/config.json --title "Aurora Ribbons — dusk"
    # → Created private vos <id>
    #   watch:  https://vos.so/vos/<id>
    #   studio: https://vos.so/studio?vos=<id>
    
  6. 反復 — 以降の編集は同じvosのバージョンになります:

    vos push <slug>/config.json --vos <id> --note "cooler palette, slower drift"
    

    ディレクトリは vos.json を通じて自身のvosを追跡するため、ベースバージョンは 自動的に引き継がれます。前回のプッシュ以降に人間がスタジオで編集した場合、プッシュは その変更ログとともに拒否されます。--note は引き継ぎメッセージです — 人間が最初に読むものです。--label はバージョン名です。

  7. 編集のたびにプル — 人間が微調整した可能性があります:

    vos pull <slug>          # ベースからの変更を確認し、同期
    

    各バージョンを属性付きで出力します(v3 (studio · warmer): knob hue 0.2→0.35 とそのノート)、config.json を先頭に同期し(以前のコピーは config.backup.json として保持)、 ベースを再設定します。人間が編集したノードは保護されています:それらに触れるプッシュは、 --override <id> を渡さない限り拒否されます — これはユーザーの指示が明示的にそのノードを ターゲットにしている場合にのみ行ってください。ユーザーによるノブの操作は嗜好データです: 次に何をするかを決める前に変更ログを読んでください。

  8. 両方のリンクを返す — ウォッチページ(プレビュー、ノブ、コード)とスタジオ (https://vos.so/studio?vos=<id>)を返します。ユーザーはスタジオでノブを微調整できます。 公開はユーザーがvos.soで行う操作です。

プッシュを誠実に保つルール

  • プライベートが契約です。 visibility: "public" を試みないでください — プライベートに固定され、 キーによる公開は設計上拒否されます。
  • クォータを意識する:デュラブルキーは24時間に50vosまで作成可能。グラントは5回までプッシュ可能。 多数のvosを作成する代わりに、1つのvosでバージョンを反復してください。
  • サーバーレンダリングの制約(プレビューフリートはソフトウェアGLを使用): 透過マテリアルに THREE.DoubleSide は使用不可、dispersion は使用不可、 取得するアセットはすべてフリートが到達可能な絶対 https URLである必要があります。
  • すべてのノブは機能しなければなりません。 コードが決して読み取らないパラメータは、 パラメータがないより悪いです — references/params-knobs.md の誠実性セクションを参照してください。
  • 3Dモデル差し替え(ショーケースプログラムへのGLB):references/3d-recipe.md。
  • 完全なエンドポイントリファレンス、クォータ、エラーテーブル: references/remix-contract.md。

Individual skills in this repo

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

launch-kit

Ship the media with the release — one take of the real product becomes YouTube demo, Chrome Web Store screenshots/tiles, Product Hunt gallery, social cuts, and OG cards; verified kit.json manifest.

vos-authoring

Author a vos animation program (VosConfigJson) from scratch or debug one — declarative configs compiling into deterministic Three.js + GSAP-dialect animations on the MIT vos engine (@vosjs/core), validated locally with compileVosConfig. Covers the schema, dialect rules, 2D overlay elements, shaders, and params/presets knobs. Use when asked to write a vos animation program, create a VosConfigJson, make a programmatic motion graphic or logo animation, or fix a config that fails to compile or lint.

vos-create

Create vos programs in the user

vosjs/product-video

Record and produce the demo video of a website, app, or feature with the vos CLI — the agent scripts the click path (actions.json), the recording auto-plans zooms, and every editing decision is data in doc.json, so fixes are edits and re-renders, never re-recordings. Renders are deterministic; export is free up to 4K with no watermark. Use when asked to make a product video, demo video, screen recording of a URL or feature, or a marketing clip, including a product behind a login (the session ladder: mint one from the project's own test auth before asking anyone), or when a feature was verified in agent-browser and that walk should become a take. A whole release's asset set (store listing, Product Hunt gallery, social cuts) is the launch-kit skill, which records through this one.

vosjs/vos-cut

Cut a screen recording (a vosso take) into the product video it was recorded for, from its evidence, with the vos CLI — read the take's digest (the moments the cursor track says mattered, each with a footage frame and a crop), narrate beats, edit doc.json by exception over the planners, verify with stills, and push an attributed version the human fine-tunes at vos.so; every edit is a data patch, so a re-cut never re-records. Use when asked to edit or cut a recording, make a product video or what's-new clip from a take, cut it like the last one, or cut a series of recordings in one style.

vosjs/vos-footage

Hand a Remotion, HyperFrames, or any video composition a clean captured clip of the real product — recorded and auto-zoomed with the vos CLI, delivered as full-bleed footage with no chrome, and always backed by an editable take on the maker's shelf, which the handoff says. Use when a composition needs real product footage, app or site b-roll, "capture our app for the video", or a screen-recorded segment to drop into another tool's timeline.

vosjs/vos-migrate

Turn an existing Loom, Screen Studio, Cap, or plain mp4/webm screen demo into an editable vosso take — re-encode the file, synthesize the take's metadata, plan, and push, so the old demo becomes a living document you re-cut instead of a file you re-record. Use when asked to "convert this Loom", "migrate our old demos", "re-edit this mp4", "make our Screen Studio recording editable", or to bring any already-recorded demo into vosso.

関連スキル