Skills
エージェント向けにパッケージ化された専門スキルと手順を 97,501 件掲載。コマンド 1 行でインストールできます。
デザイン・UI
ui.inference.sh が提供する React/Next.js 向けチャット UI のビルディングブロック。コンポーネント:コンテナ、メッセージ、入力、入力インジケーター、アバター。機能:チャットインターフェース、メッセージリスト、入力処理、ストリーミング。用途:カスタムチャット UI の構築、メッセージングインターフェース、AI アシスタント。トリガー:chat ui、chat component、message list、chat input、shadcn chat、react chat、chat interface、messaging ui、conversation ui、chat building blocks
決定論的なデザインシステム監査と、スラッシュコマンドとして使えるデザイン専門家一式を提供します。`npx dwic-audit`はWCAGのコントラスト計算とトークン解析を使い(LLMは不使用)、色、タイポグラフィ、余白、アクセシビリティ、フォーム、ナビゲーション、モーション、コピーなどのカテゴリでプロジェクトをスキャンし、検出事項を修正担当の専門家に振り分けます。専門分野は、視覚的階層、インタラクションデザイン、デザインシステム設計、タイポグラフィ、色、余白、モーション、フォーム、ナビゲーション、ダッシュボード、モバイル、ランディングページ、認証UX、ヘルスケアUX、B2B SaaS、Eコマース、ダークモード、エラー処理、オンボーディング、データ可視化です。Claude Codeプラグインとしてインストールされ、コマンドは実行時依存関係のない純粋なMarkdownです。
モバイルアプリ、Web アプリ、レスポンシブウェブサイト向けのマイクロインタラクションの専門家です。マイクロインタラクション、アニメーション、トランジション、モーションデザイン、ジェスチャーフィードバック、ハプティクス、ローディング状態、スケルトンスクリーン、プルして更新、スワイプ操作、スクロールアニメーション、ボタン状態、フォーム検証フィードバック、トースト通知、モーダル、ドロップダウン、トグル、進捗インジケーター、共有要素トランジション、ばね物理、イージング曲線、モーショントークン、またはユーザー操作に視覚・触覚・聴覚フィードバックを提供するインタラクションの追加、構築、修正、監査、相談をユーザーが求めた場合に使用します。次の語句に反応します:“micro-interaction”“animation”“transition”“motion”“easing”“spring”“gesture”“haptic”“feedback”“loading state”“skeleton”“shimmer”“pull to refresh”“swipe”“drag”“hover effect”“press state”“focus ring”“scroll animation”“parallax”“stagger”“orchestration”“reduced motion”“View Transitions”“layout animation”“shared element”“hero animation”“morphing”“Framer Motion”“GSAP”“Lottie”“Rive”“React Spring”“anime.js”、またはインターフェースを「使いやすく」「生き生きと」「きびきびと」「レスポンシブに」「洗練された」ものにしたいという依頼。
フレームワークのデフォルトではなく、設計されたインタラクションフィードバックを強制する。コミットを伴うすべてのインタラクションは同一フレーム内で確認され、モーションは状態を装飾するが状態そのものにはならない(アニメーションをオフにしても最終状態は同一)。設計時に、各モーメントがトリガー、duration ロール、ハプティクス枠、縮小モーション時のフォールバックを宣言する命名済みカタログを用意する。ハプティクスは HapticTheme のイベントから強度へのマップとして、コミットフレームでちょうど一度だけ発火する(アニメーションフレームごと、合流した入力ごとには決して発火せず、エラーに heavyImpact は使わない)。単一の中央トグルで制御する。すべてのアニメーションは中断可能で、タップすると最終状態に解決される。祝祭演出は有界で一度だけ再生され、ループも入力のブロックもしない。すべての繰り返しアニメーションには明示的な停止条件がある(ルート離脱、バックグラウンド、縮小モーション)。フィードバックを複数チャネルで提供し、縮小モーションでもハプティクスと音が生き残るようにする。アニメーション、成功・エラー状態、ハプティクス、祝祭演出、画面遷移を追加または調整するときに使用する。
UI/UXデザインのインテリジェンス。50種類のスタイル、21種類の配色、50種類のフォントペア、20種類のチャート、9種類の技術スタック(React、Next.js、Vue、Svelte、SwiftUI、React Native、Flutter、Tailwind、shadcn/ui)を提供します。操作:計画、構築、作成、デザイン、実装、レビュー、修正、改善、最適化、強化、リファクタリング、UI/UXコードのチェック。プロジェクト:ウェブサイト、ランディングページ、ダッシュボード、管理パネル、EC、SaaS、ポートフォリオ、ブログ、モバイルアプリ、.html、.tsx、.vue、.svelte。要素:ボタン、モーダル、ナビゲーションバー、サイドバー、カード、テーブル、フォーム、チャート。スタイル:グラスモーフィズム、クレイモーフィズム、ミニマリズム、ブルータリズム、ニューモーフィズム、ベントーグリッド、ダークモード、レスポンシブ、スキューモーフィズム、フラットデザイン。トピック:カラーパレット、アクセシビリティ、アニメーション、レイアウト、タイポグラフィ、フォントペア、余白、ホバー、シャドウ、グラデーション。統合:コンポーネント検索とサンプル表示に shadcn/ui MCP を使用
プロジェクトにACCESSIBILITY.mdファイルが含まれている場合、またはmgifford/ACCESSIBILITY.mdリポジトリに貢献する場合は、直ちにこのスキルを読み込んでください。変更を提案または記述する前に、必ずACCESSIBILITY.mdを読んでください。ACCESSIBILITY.mdファイルが存在する場合、いかなる状況でもこのスキルを省略しないでください。このスキルは、他のすべてのアクセシビリティ関連スキルをいつ、どのように読み込むかを定めます。
CustomPainter/Canvas の規律を徹底する — View/Painter/Scene の分割と、単一の不変な Scene 値型を渡される単純な painter、単一値比較としての shouldRepaint を AnimationController による再描画アニメーション経路と厳密に分離すること、painter とヒットテスターの両方が読む単一の共有アフィン変換(toCanvas/toLogical は正確な逆演算で、スケールを再導出しない)、ジオメトリのヒットテスト(整数格子またはラスタライズされた region-ID バッファ、Path.contains は決して使わない)、ゼロアロケーションの paint()、純粋なトランスレーターとしてのジェスチャが Notifier に型付きコマンドを発行すること(ハンドラー内で状態を変更しない)、表示値を読み上げる ExcludeSemantics + 兄弟 Semantics と冗長な非色エンコーディング、実測による TextPainter のフィッティング、ファーストパーティの RoundedSuperellipseBorder、物理ピクセルのヘアライン、Directional のみのジオメトリ。CustomPainter/CustomPaint の作成・レビュー、キャンバス上のジェスチャ、タップ/ドラッグのヒットテスト、キャンバスアニメーション、実測テキストフィッティング、カスタム描画ピクセル上の Semantics を扱うときに使用する。
Open Graph とソーシャル共有画像のデザイン。プラットフォームの仕様、テキスト配置、ブランディングを扱います。OG meta タグ、Twitter カード、LinkedIn プレビュー、動的生成をカバーします。用途:ソーシャル共有画像、ブログのサムネイル、リンクプレビュー、ソーシャルカード。トリガー:og image、open graph、social sharing image、twitter card、social card、link preview image、og meta、sharing preview、social thumbnail、meta image、og:image、twitter:image、linkedin preview。
ユーザーが独立したファイルまたは埋め込みコンテンツとして、スライドプレゼンテーションを作成・デザイン・制作したい場合は、いつでもこのスキルを使用します。ピッチデッキ、スライド資料、基調講演、研修資料、プロジェクト提案書、四半期レビュー、週次報告スライド、投資家向けピッチ、新製品発表、チームキックオフ、事業計画、オンボーディング資料、戦略プレゼンテーション、営業ピッチ、カンファレンストーク、「slides」や「PPT」に関する依頼が対象です。「做PPT」「做个汇报」「写个演示文稿」「季度汇报」「竞品分析报告(要PPT)」「产品发布会」「培训材料」「周报」と言われた場合も起動します。スライドやプレゼンテーションを制作する必要がある場合は、このスキルを使用してください。
UI ワイヤーフレームを、各領域が YOUR デザインシステムの実在コンポーネントに対応するラベル付き ASCII アートとして描画する。ASCII プロトタイプ、テキストワイヤーフレーム、等幅モックアップを求められたとき、またはデザインツールを開かずにチャット、PR、issue、Slack スレッド内でページレイアウトをスケッチしたいときに使用する。トリガーには「…の ASCII プロトタイプを作って」「これをテキストでワイヤーフレーム化して」「…のホームページをスケッチして」「これを ASCII でモックアップして」「このページを ASCII で見せて」が含まれる。デザインシステムのコンポーネント語彙のワンタイムプロファイルを作成し、それに基づいて描画する。タイポグラフィの階層は説明ではなく描画される。
見栄えのよいウェブインターフェースを構築します。次の場合に使用します。- ウェブアプリ、ウェブサイト、ランディングページ、HTML ページの構築を依頼されたとき - 単発のツール、ユーティリティ、デモアプリを求められたとき - 新しいフロントエンドプロジェクトを始めるとき - 見た目の改善を求められたとき - UI、デザイン、スタイリング、見栄えの改善について言及されたとき。これは「デザイン」タスクに限らず、あらゆるフロントエンド作業に適用されます。シンプルなアプリでも基本的なデザイン原則が役立ちます。
確認済みの公式アカウント用最終稿 Markdown を整形し、WeChat公式アカウントの下書きに保存します。「公式アカウントに投稿」「下書きに保存」「公式アカウント向けに整形」「別のテーマに変更」「小绿书の画像メッセージを送信」などの依頼で使用します。カバー画像と本文中の画像を自動アップロードし、複数のテーマ、カスタム CSS、複数アカウント、server モードに対応します。下書きの作成のみで、一斉送信はしません。認証情報は環境変数からのみ提供します。アダプターツールがインストールされていない場合は、手動投稿用パッケージを提供します。
open-slide ページを書いたり編集したりするための技術リファレンス — ファイル契約、1920×1080 キャンバス、タイプスケール、レイアウト、パレット/ビジュアルの方向性、アセット、スピーカーノート、段階的な表示、ページトランジション、モーフトランジション。`slides/<id>/` 配下のファイルを書いたり変更したりする直前に参照する。`create-slide` や `apply-comments` のワークフロー内からでも、その場限りのスライド編集でも同じ。「edit slide」「tweak this page」「fix the layout」「change the palette」「reveal one by one」「add a transition」「morph transition」「write the speaker notes」「generate the script / talk track」「preview / screenshot a page」「check how it looks」「investigate the slide framework」「how do slides work here」といったフレーズでトリガーする。
`sn-ppt-entry` と `sn-ppt-story` が絶対パスの `DECK_DIR` と `outline.md` を準備した後にのみ使用します。各スライドの個別 HTML(1600×900)、レンダリング済み PNG、スライドごとの発表原稿、`present.html` を生成し、`static_postprocess` の指定に従って Standard 独自の exporter で変換した PPTX を生成します。**`present.html` は常に必須成果物です。欠落は技術的障害であり、納品してはいけません。`static_postprocess` に `pptx` が含まれる場合、PPTX も必須成果物(いずれかの欠落は技術的障害)で、Standard 独自の exporter のみで生成してください。ユーザーが HTML のみを明示的に要求した場合(`static_postprocess` が `[]`)に限り、PPTX を省略できます。**
AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。
