Claude Code で作る
Fluxlay 壁紙を最速で作る方法は、Claude Code に任せることです。公式プラグインが、足場づくり・SDK / マニフェスト / CSP の知識・公開時のガードレールまでまとめて提供します。
💡 手動で進めたい方は はじめようからどうぞ。同じプロジェクト構成をステップバイステップで作ります。
前提条件
- Claude Code
- Fluxlay デスクトップアプリがインストール済み
- Node.js v20 以降（パッケージマネージャーは npm / pnpm / yarn / bun のいずれでも可）
プラグインのインストール
Claude Code 上で実行します。
これで以降のすべての Claude Code セッションで利用可能になります。
壁紙を作る
作りたいものを伝えるだけです。
Claude は次の流れで進めます。
- プラン —
kind（web/video/image）、slug、使う SDK hook（例:useSystemMonitor）、必要なpermissions:/network:宣言、関連する CSP 上の注意点を提案 - 確認 — 調整 or 承認を待つ
- 足場作成 — 最小テンプレートをコピー、プレースホルダ置換、依存関係のインストール、git 初期化
- 実装 — プランで決めた SDK hook を使って
src/main.tsxを書き始める
動画や画像の壁紙なら、その旨を伝えるだけで OK。Claude が適切なテンプレートを選び、kind: と source: を設定し、メディアファイルを置く場所を案内します。
開発・ビルド・公開も会話で
プロジェクトができたら、あとは自然な日本語で話しかけます。
- 「dev サーバー立ち上げて」 →
devスクリプトを実行（HMR プレビューにはデスクトップアプリの起動が必要） - 「ビルドして本番 CSP で動くか確認して」 →
buildスクリプトを実行 - 「公開して」 →
publishを起動しようとしますが、同梱の PreToolUse hook が先に走り、ビルドの鮮度、マニフェスト妥当性、fluxlay whoamiのログイン状態を事前検証します。問題があれば自動でブロック、問題がなければサマリ付きの確認プロンプトが表示されます。
fluxlay.yaml の編集も PostToolUse hook が自動で検証します（slug 形式、SemVer、kind enum、source 拡張子）。エラーは Claude に返されるので、同じターン内で修正されます。
プラグインに含まれるもの
プラグインの更新
Claude Code のマーケットプレイスは手動更新です。
定期的に実行して最新版を取得してください。
ソースとフィードバック
プラグインはオープンソースです: github.com/fluxlay/claude-plugin。Issue・改善提案・コントリビュートを歓迎します。
次のステップ
- インタラクティブ壁紙 — マウス・キーボード・システム情報の SDK hook を使う
- 壁紙を公開する — 公開フローを手動で一通り
- マニフェストリファレンス — 全フィールド・全型