ホントに雨ばっかりでゲンナリこもりです。
今日はClaude版のスキルの更新のお知らせになります。Agensiへの個別出品を進めているのですが、移植の際にテスト・検証していて見つかった細かな不具合などの修正です。ほとんどが大きな機能変更ではなく、ある操作をおこなったときに稀に発生するかも?という部分の調整です。
一点「code-to-figma」だけは、最新のエージェントのモデルの進化とFigma側の進化にあわせたアップデート、 figma-node-check の依存関係を外して内部に参照ファイルを埋め込む形になりました。これまでよりも精緻に書き出しなどがおこなえるようになったかと思います。
- figma-tokenize:Text Styleを「Heading / Body / Nav / Button / Label」など役割で命名するように改善。大文字表示(uppercase)と下線がスタイル化で失われる不具合も修正
- figma-componentize:コンポーネント化でヘッダーなどの高さが半分に潰れることがある不具合を修正
- figma-enhance:Component Propertyの配線後に、下線・大文字表示が消えていないかを再確認するように改善
- figma-optimize:未導入のスキルが含まれる場合の扱いを追加
- code-to-figma:Level 2〜4で、ローカル画像を実際にFigmaへアップロードして塗りとして設定するように改善。Level 4では、対象範囲の全体をソース順に生成する方針を明記
- figma-tidy-up / figma-componentize / figma-enhance / code-to-figma:実機テストで見つかった落とし穴(半透明色の不透明化、カード幅のはみ出し、バリアントのpaddingの消失、WebP画像の空白表示など)への対処を追加
- cognitive-ui-design:自動起動のきっかけとなるトリガー句を見直し
スキル一覧、使い方など、以下の公開中のREADME.mdでご確認ください。
For English readers:
This is an announcement regarding an update to the Claude version's skills. We are currently working on listing individual items on Agensi, and this update addresses minor bugs and issues discovered during testing and verification while porting the skills. Most of these changes do not involve major functional changes; rather, they are adjustments to address issues that might rarely occur when performing certain actions.
Existing buyers can re-download the latest package right away
以下、アップデートの詳細です。
更新スキル
figma-tokenize
実機で通しテストをして見つかった不具合を修正しました。
- Text Styleの名前が実行エージェントでバラバラになるようなので、フォント名やサイズではなく役割(Heading / Body / Nav / Button / Label とその中の Hero・H1・Lead・Regular など)で付けるようにしました。デザイナーが見てわかりやすく、コードに渡したときも意図が伝わります
- 大文字表示(text-transform: uppercase 相当)と下線をText Styleに引き継ぐようにしました。以前は、Text Styleにまとめた際に英字の小さなラベルが縮んだり、下線が消えたりすることがありました
- 適用の前後でスクリーンショットとノードサイズを比較し、見た目が変わっていないことを確認する手順を追加しました
figma-componentize
- コンポーネント化したあと、ヘッダーなどの高さが半分ほどに潰れることがある不具合を修正しました。元のサイズ設定(固定/ハグ)を記録して復元します
- バリアントのデフォルトのラベルを、特定の1つの文言ではなく中立的な文言(例:Button)に揃えるようにしました
figma-enhance
- Component Propertyを配線したあと、下線や大文字表示が消えていないかを再確認する手順を追加しました
figma-optimize
- 実行対象のスキルが未導入の場合の扱いを追加しました
code-to-figma
- Level 2〜4で、画像エリアをすべてプレースホルダー(空の枠)のままにせず、ソースにあるローカル画像を実際にFigmaへアップロードして塗りとして設定するようにしました。外部サイトでホストされている画像のURLは取得できないため、従来どおりプレースホルダーのままになります(該当があれば確認のうえ、最終報告にも記載します)
- Level 4で、「孤立した部品だけ」を作って終わってしまわないよう、対象範囲(ページ・フレーム・セクション)の全体をソースの順に生成する方針を明記しました
figma-tidy-up / figma-componentize / figma-enhance / code-to-figma(共通:既知の落とし穴集)
4つのスキルが共有している references/known-pitfalls.md(use_figma の結果がおかしいときに参照される資料)に、実機テストで見つかった落とし穴を追加しました(全24ルール)。
- 半透明の色が不透明になる(ルール22):薄い1pxの区切り線など、透明度のある色を変数にバインドすると不透明になることがありました。透明度の付け方を直し、同じ変数を使う全ノードを確認する手順にしました
-
カードの幅がはみ出す(ルール23):CSS Gridの列幅(
grid-cols-N)から取ったカード幅は、親の幅に対する割合です。ピクセル値をそのまま写すと、行からはみ出すことがありました - バリアントのpaddingが消える(ルール24):バリアントをまとめたとき、1つのバリアントのpaddingが黙って0になることがありました。まとめた後に全バリアントを確認する手順にしました
- WebP画像が空白で表示される(ルール7の補足):アップロード自体は成功しても、WebPの画像は空白で描画されることがありました。PNG/JPEGに変換してからアップロードします
- 実ブラウザとの突き合わせを必須化:Level 2〜4では、ブラウザ上の実際のスタイル(computed style)とFigma側の値を突き合わせます。スクリーンショットでは見分けにくい、透明度などの小さな違いを拾うためです
cognitive-ui-design
- 自動起動のきっかけとなるトリガー句を見直し、日本語のフレーズを外して、英語のフレーズ(“avoid AI slop”、“this looks generic”、“critique this layout” など)を追加しました。
/cognitive-ui-designで直接呼び出す使い方は変わりません - 単体起動もできますが、こちらは主に他のスキルのオプションとして呼ばれることが多いと考えられるのでこのような処置をしております。内容的には主にAIが読み出すものですので全編英語です
Agensi 個別スキル公開20個達成記念

-
KMRVID Claude Skills(Claude版スキル48個): 定価¥19,800 → ¥9,900(税込、¥9,900引き)
-
KMRVID Figma Skills(Figma版スキル30個): 定価¥15,400 → ¥5,500(税込、¥9,900引き)