FIGMASCOPE · 記事
コンテキストインフラに関するノート。
コードエージェント向け構造化コンテキストバンドルに関する技術記事 — バンドルの内容、ピクセルでは不十分な理由、アーティファクトが実際のコードジェンワークフローにどうマッピングされるか、figmascopeがプラグイン・MCPサーバー・Dev Modeとどう比較されるか。
ワークフロー
-
2026-05-11ステップバイステップ：figmascopeからFigmaデザインをエクスポートし、コンテキストバンドルをCursorに展開し、エージェントに正確な画面を構築させる。推測なし。
-
2026-05-11figmascopeのコンテキストバンドルをClaude Codeに接続し、再現可能なFigma→コード生成を実現。トークン対応・マルチターン安全・diff対応。
-
2026-05-11figmascopeのコンテキストバンドルをAiderで活用し、トークン対応diffでUIを設計・編集・リファクタリング。バンドルエクスポートからdiffレビューまでの完全パイプライン。
-
2026-05-11figmascopeのIRとCONTEXT.mdがJetpack Composeにどうマッピングされるか。完全なトークンマッピングを含む実際のJSON→Composableの例。
-
2026-05-11figmascopeのコンテキストバンドルからReact + Tailwindコンポーネントを生成。トークン対応、決定論的出力。IR→JSXマッピングとTailwindコンフィグを含む。
バンドルの解剖
-
2026-05-11figmascopeがCONTEXT.mdをAIコーディングエージェント向けコンパイラスタイルの仕様書として構造化する方法。制約ルール・スコープ注記・コード生成例を解説。
-
2026-05-114つのタイプ。figmascopeがFigmaレイアウトを型付きIRに正規化する方法。空間関係とコンポーネントIDがAIコードジェン向けに保持されます。
-
2026-05-11AIコード生成においてコンポーネントアイデンティティが重要な理由。figmascopeのinventory.jsonがINSTANCEノードをコンポーネント定義にリンクし、重複コード生成を防ぐ仕組み。
-
2026-05-11Figma VariablesはAIコード生成のためのセマンティックトークンです。figmascopeは存在する場合はそれを使用し、ない場合は頻度からトークンを推論します。
-
2026-05-11FigmaのPATはアカウントがアクセスできるすべてのファイルを読みます。figmascopeはそれをメモリにのみ保持します—バックエンドなし、ストレージなし、アップロードなし。
比較
-
2026-05-11プラグイン検査かポータブルバンドルか？それぞれの適切な用途。
-
2026-05-11サーバー接続かフラットファイルか？アーキテクチャのトレードオフ。
-
2026-05-11生成コードか構造化コンテキストか？トレードオフの解説。
-
2026-05-11ビジュアルCMSかコードコンテキストか？異なる用途。
-
2026-05-11プラグインランタイムかブラウザエクスポートか？その違いが重要な理由。
戦略 & エッセイ
-
2026-05-11AIエージェントにとってデザインハンドオフが決定論的である必要がある理由。figmascopeのコンテキストバンドルは凍結されたスナップショット — 再現可能・差分可能・バージョン管理対応。
-
2026-05-11figmascopeがFigmaのUI文字列をドット記法i18nキーに抽出する方法。衝突処理・キーフィルター・Androidのstrings.xmlや他のフォーマットへのマッピングを解説。
ユースケース
-
landingCursor AIのためにデザインコンテキストをエクスポート。
-
landingAnthropicのCLI向け構造化デザインコンテキスト。
-
landingFigma Variablesからtokens.jsonへ。
-
landingAIエージェント向け構造化コンテキスト、プラグインUIではない。
-
landing構造化コンテキストを使ったモダンなワークフロー。
エージェント向けコンテキストをエクスポート →
Figma URLを貼り付けて、構造化コンテキストバンドルを取得。ブラウザで動作します。