サイト上のすべてのスキルには、コピー&ペーストでインストールできるコマンドが用意されています。 登録不要で、パッケージマネージャーも必要ありません。
スキルを一つインストール
mkdir -p ~/.claude/skills && curl -fsSL https://skill.metacog.co.kr/dist/hugo-blog-builder.zip \
-o /tmp/skill.zip && unzip -oq /tmp/skill.zip -d ~/.claude/skills
hugo-blog-builder の部分を、カタログ内の任意のスラッグに置き換えてください。
すべてのスキルをインストール
git clone https://github.com/jeonck/skill-hub.git
cp -r skill-hub/skills/* ~/.claude/skills/
スキル一覧
97個のスキル、それぞれにアイコンが一つずつ。名前をクリックするとインストールコマンドが表示されます。
自動化パイプライン
| スキル | 機能 | |
|---|---|---|
日記パイプラインdaily-diary-pipeline | GitHubファイルの一行を編集するだけで、スケジュールされたClaude実行がトリガーされ、記事を書いてHugo + GitHub Pagesに公開するパイプラインを構築します。 | |
インサイトパイプラインdaily-insight-pipeline | 毎日の収集とトリアージパイプラインを構築 — RSS、Reddit、HN、GitHubから情報を取得し、Claudeに各項目を「今すぐ対応」「バックログ」「学習」「無視」に評価させ、サイトに転送します。 | |
用語比較パイプラインterm-comparison-pipeline | オンデマンド比較記事 — 「REST vs GraphQL」のような一行をファイルに追加すると、プッシュがトリガーされ、ClaudeがSVG図と比較表を生成してデプロイします。cronも代替コンテンツも不要。 | |
トランスクリプト学習パイプラインtranscript-study-pipeline | 貼り付けられた授業のトランスクリプトを構造化された英語学習記事に変換 — イディオムと例文、語彙、話し言葉の間違い訂正、穴埋めクイズ、ミニ日記 — プッシュ時に公開。 |
コンテンツとライティング
| スキル | 機能 | |
|---|---|---|
ビジネスイディオムセクションus-work-english-idiom-section | 折りたたみ可能なブロックとしてビジネスイディオムセクションを記述 — 各表現につき太字の英語一行とキーポイント一つのみ、それ以外はなし。 | |
CCNP / CCIE ナレッジライターccnp-ccie-writer | Cisco CCNP/CCIEナレッジベースドキュメントを固定構造で記述 — 定義、特性、コンポーネント、パケットフロー、比較表、設定、試験ポイント — Mermaid図付き。 | |
CISA コンテンツライターcisa-content-writer | 6つのISACAドメインにわたるCISA(IS監査)ベストプラクティスガイドを作成 — 標準の10セクションレイアウト、Mermaid図、HTML監査チェックリスト付き。 | |
データプラットフォームアーキテクチャdata-platform-architecture | 最新のデータプラットフォームアーキテクチャスタイル(Lakehouse、Medallion、Data Mesh、Data Fabric、Lambda/Kappa、Streaming Lakehouse、Modern Data Stack、Zero-ETL)を比較・選択し、その決定を制約とともに文書化します。 | |
ELI5eli5 | あらゆるトピック、コード、概念、エラーを指定された聴衆(5歳児、マネージャー、親、新人エンジニア)向けに説明 — 語彙、例え、深さを聞き手に合わせます。「まるで私が…のように説明して」「かみ砕いて」「上司にどう説明すれば…」でトリガーされます。 | |
SEOエージェンシーをやめようfire-your-seo-agency | 5つのレーン(SEO、AEO、GEO、LLMO、NEO (Naver))にわたってサイトを監査・最適化 — 検索エンジン、回答エンジン、生成AI、NaverのAIブリーフィングが引用する一次情報源にします。診断 → 実装 → 測定。クローラー視点のチェック(JSなしのHTML表示)、ブラックハット禁止、ブログ/コンテンツパイプラインを含む。バイリンガルリファレンス。 | |
韓国語を人間らしくhumanize-korean | AIが書いたように読める韓国語テキスト(翻訳調、英語の多用、機械的な並列構造、受動態の多用、均一なリズム、絵文字や箇条書きの過剰)を10カテゴリの兆候にわたって書き換え、内容は変えずにスタイルとリズムを変更します。深刻度に応じて1回、2回、3回以上のパスに振り分けます。 | |
社内コミュニケーションinternal-comms | 社内向けの定型フォーマットでコミュニケーションを作成 — ステータスレポート、リーダーシップアップデート、ニュースレター、FAQ、インシデントレポート、プロジェクトアップデート。 | |
IT技術士コンテンツit-professional-content | 韓国「技術士」試験形式でフレームワークと方法論のコンテンツを記述 — ブロック図、Mermaidビジュアライゼーション、比較表を含む3セクション構造。 | |
問題メモライターproblem-note | ICTインシデント、エラーログ、トラブルシューティングセッションを構造化された問題メモとしてQuartz v5セカンドブレイン用に記述 — 概念メモ、MOCページ、公開前のマスキングチェックも含む。 | |
アメリカ職場英語コンテンツus-work-english-content | Docusaurus英語学習サイトに表現練習ページを追加 — テーマ別の折りたたみ可能グループ、太字表現とキー/ソース/類似の箇条書き、ヒントアドモニション、サイドバー配線。 |
デザインとUI
| スキル | 機能 | |
|---|---|---|
アルゴリズムアートalgorithmic-art | p5.jsを使用したジェネレーティブアート — シード付き乱数、フローフィールド、パーティクルシステム、インタラクティブなパラメータ探索ループ。 | |
アニメーションanimate | ウェブアニメーションをゼロから構築 — アニメーションするかどうか、どのツール、どのプロパティ、どのカーブ、どのように割り込み・終了するかという順序で決定し、実装。 | |
Expoでアニメーションanimate-expo | React NativeとExpo向けの同じアニメーション決定順序 — どのスレッドで実行するか、スプリングかタイミングか、ジェスチャーの引き継ぎ方法、劣化方法 — Reanimated、Gesture Handler、Expo Router、expo-hapticsで実装。 | |
アニメーション用語集animation-vocabulary | 逆引き用語集 — モーション効果の曖昧な説明を正確な用語に変換。「ポップオーバーが開くときのバウンドするやつ」→ Pop in、「iOSのゴムバンドスクロール」→ Rubber-banding。 | |
アンチUIスロップanti-ui-slop | コーディングエージェントが汎用的なUIを出荷するのを防止 — インターフェースをUIZZEの80万以上の実際のWeb・iOS画面ライブラリに基づかせ、デザイン契約を定義し、必要な状態をカバーし、出荷前の厳格な最終ゲートを実行。Claude Code、Cursor、Copilot、Codexで動作。 | |
ウェブ向けAppleデザインapple-design | Appleのインターフェースデザインと流動的で物理的なモーションアプローチをウェブ向けに翻訳 — ジェスチャー駆動UI、スプリングと割り込み可能なトランジション、半透明マテリアルと奥行き、オプティカルタイポグラフィ、モーション抑制。 | |
バナーデザインbanner-design | ソーシャル、広告、ウェブサイトヒーロー、印刷物向けバナー — Facebook、X、LinkedIn、YouTube、Instagram、Googleディスプレイサイズ向けの複数アートディレクション。 | |
ブランドガイドラインbrand-guidelines | Anthropic公式ブランドカラーとタイポグラフィを、一貫したハウスルックアンドフィールの恩恵を受けるあらゆるアーティファクトに適用。 | |
ブランドキットジェネレーターbrandkit | プレミアムブランドガイドラインボード、ロゴシステム、アイデンティティデック — ミニマリスト、シネマティック、エディトリアル、ダークテック、ラグジュアリーシステム、アートディレクションされたモックアップ。 | |
ブランドボイスとアイデンティティbrand | ブランドボイス、ビジュアルアイデンティティ、メッセージフレームワーク、アセット管理、ブランドコンテンツのコンプライアンスチェック。 | |
キャンバスデザインcanvas-design | 実際のデザイン哲学に基づき、デフォルトテンプレート出力ではなく、ポスターやアート、静的ピースを.pngまたは.pdfとしてデザイン。 | |
デザインディレクションdesign | プロダクト作業のためのアートディレクションとビジュアルデザイン決定。Pro Maxリファレンスデータに基づく。 | |
Sleekでモバイルアプリをデザインdesign-mobile-apps | ホスト型のsleek.design APIを通じてモバイルアプリ画面をデザイン — プロジェクトを作成し、意図と作成したスタイルディレクションを一つのメッセージとして送信し、実行をポーリングしてスクリーンショットまたはHTMLを取得。 |
…(以下省略)