/ ディレクトリ / プレイグラウンド / Ay-Skills
← 全サーバー ↗ GitHub
● コミュニティ walidboulanouar ⚡ 即起動

Ay-Skills

作者 walidboulanouar · walidboulanouar/Ay-Skills

AY Automateの10スキルバンドル — React/Tailwindアーティファクト、MCPクライアント、Remotionビデオ、Excalidraw、Claude SEO、NotebookLMなど。

walidboulanouar / AY Automateによる幅広いスキルコレクションです。artifacts-builder（React + Tailwind + shadcn/uiバンドルHTML）、mcp-client（Python実行機能付きユニバーサルMCPコネクター）、remotion（Reactビデオ）、skill-creator、notebooklm（ブラウザオートメーション経由のGoogle NotebookLM）、ui-ux-pro-max（デザインシステムガイドライン）、agent-browser（ログイン永続化対応のブラウザオートメーション）、claude-seo（DataForSEO MCP連携）、superpowers（エージェント型TDDパイプライン）、excalidraw-diagramを含みます。

▶ デモを見る 📦 インストール 💡 ユースケース

なぜ使うのか

主な機能

ライブデモ

実際の動作

ay-skill.replay ▶ 準備完了
0/0

インストール

作者のリポジトリ · Claude Skills の公式ドキュメント

ユースケース

実用的な使い方： Ay-Skills

React + shadcnで共有可能なセルフコンテインドHTMLアーティファクトを構築する

👤 デプロイなしで小さなUIをデモしたい開発者 ⏱ ~30 min beginner

使うタイミング： オフラインで動作する単一の.htmlファイルを誰かに渡したいとき。

フロー
  1. アーティファクトを説明する
    artifacts-builder: a single-page pricing calculator with 3 tiers, React + shadcn cards, Tailwind.✓ コピーしました
    → Claudeが埋め込みCSS/JS付きのバンドルHTMLファイルを生成する
  2. ビジュアルを反復改善する
    Use ui-ux-pro-max guidelines — apply the accent palette to the CTA.✓ コピーしました
    → デザインシステムと一貫した、より洗練されたバージョンが出力される

結果： ファイル1つ、ダブルクリックで開き、どこでも動作します。

agent-browserでログインが必要なタスクを自動化する

👤 不安定なSeleniumスクリプトを避けたいエンジニア ⏱ ~30 min intermediate

使うタイミング： 認証が必要なWebアプリをClaudeに操作させたい場合で、セッションの永続化も求めるとき。

フロー
  1. 永続セッションを開始する
    agent-browser: open mysaas.com, log in (I'll do 2FA), save session.✓ コピーしました
    → セッションが保存され、以降のリクエストで再利用される
  2. タスクを自動化する
    Now download last month's invoices from the billing page.✓ コピーしました
    → ファイルがカレントディレクトリにダウンロードされる

結果： セッションをまたいで動作し、再認証の煩わしさがないスクリプト化されたフロー。

注意点
  • サイトの利用規約がオートメーションを禁止している — まず利用規約を確認すること — ブラウザオートメーションはツールであり、免許ではありません
組み合わせ： filesystem

組み合わせ

他のMCPと組み合わせて10倍の力を

ay-skill + filesystem

artifacts-builderの出力を共有ドロップフォルダに直接保存する

Build the artifact and save to ~/Dropbox/demos/.✓ コピーしました
ay-skill + github

アーティファクトをワンステップでGitHub Pagesページとして公開する

Build the artifact, commit to gh-pages branch, push.✓ コピーしました

ツール

このMCPが提供する機能

ツール入力呼び出すタイミングコスト
artifacts-builder UI description 共有可能な単一ファイルデモが欲しいとき 0
mcp-client target MCP server + task 1つのスキルから複数のMCPをオーケストレーションするとき 0
remotion scene description + assets プログラマティックなビデオ生成 0
agent-browser URL + actions 認証が必要なサイトやJSの多いサイト 0
claude-seo URL or keyword オプションの有料データを活用したSEO監査 ローカルは無料、DataForSEO有効化時は有料
superpowers feature intent 構造化されたTDDが効果的な複雑な機能の開発 0

コストと制限

運用コスト

APIクォータ
スキル自体にはなし
呼び出しあたりのトークン
サブスキルによって大きく異なります
金額
無料 — スキルはローカルファイルです。DataForSEO（claude-seoでオプション使用）は有料です。
ヒント
3つしか使わないなら10個すべてのサブスキルを有効にしないこと — コンテキストのオーバーヘッドが累積します。

セキュリティ

権限、シークレット、影響範囲

認証情報の保管： スキルファイル内に認証情報はありません。agent-browserはセッションファイルを保存します。claude-seoはDataForSEOキーが必要になる場合があります。
データ送信先： サブスキルに依存します — agent-browserとclaude-seoは外部サイトにアクセスします

トラブルシューティング

よくあるエラーと対処法

トリガーキーワードの誤り — mcp-clientが間違ったMCPを選択する

プロンプトでターゲットMCPを明示的に指定してください。

代替案

Ay-Skills 他との比較

代替案代わりに使う場面トレードオフ
excalidraw-skill (Agents365)ダイアグラム機能だけが必要なとき範囲が狭い。AYの他9つのサブスキルは含まれません
skills-skill-9UI/ブラウザ中心ではなくプロダクト構築向けスキルが欲しいときカテゴリの重点が異なります

その他

リソース

📖 GitHub の公式 README を読む

🐙 オープンな issue を見る

🔍 400以上のMCPサーバーとSkillsを見る