MS

mengto/skills

Developer tools

このページは AI により自動翻訳されています。技術的な詳細は原文をご確認ください。 原文を見る

7169 stars 品質 66 トレンド 82MIT

Codex、Claude、Cursor、その他のAIコーディングエージェントを使用するデザイナーやビルダーのためのエージェントスキル

概要

デザイナーやビルダーが、 、 、 などのAIコーディングエージェントを使って、豊かなユーザーインターフェース、フロントエンドシステム、エージェントループ、自動化、再利用可能なワークフローを構築するための厳選されたコレクションです。 これらのスキルをエージェントスタックの他の部分と組み合わせて、参照をプロンプトに変換し、詳細なランディングページを作成し、再利用可能なフロントエンドワークフローを構築しましょう。 まずは旗艦ウェブデザインのワークフローから始めましょう: 1. デザイン、ランディングページ、アニメーションの画面録画を、Fable 5でHTMLをワンショットで作成できる非常に詳細なプロンプトに変換します。2. 既存のHTMLページ(例えばAura Buildページ)を、1セクション、1つのアニメーション、1つのボタン、1つのホバー状態、または1つのWebGL効果の再利用可能なプロンプトに変換します。3. ヒーローだけでなくランディングページ全体をキャプチャし、エージェントに構造、ペース、視覚的階層に関する全ページの参照を提供します。4.

概要(AI 翻訳)

Codex、Claude、CursorなどのAIコーディングエージェントを使い、豊富なユーザーインターフェース、プレイ可能なゲーム、フロントエンドシステム、エージェントループ、自動化、再利用可能なワークフローを構築するデザイナーやビルダー向けの厳選されたエージェントスキルのコレクションです。

これらのスキルをCodex、Claude Design、Aura Build、Lovable、その他のエージェントスタックで活用し、参照をプロンプトに変換し、詳細なランディングページを作成し、プレイ可能なThree.jsシステムを構築し、再利用可能な実装ワークフローを作成してください。

まずは旗艦ウェブデザインのワークフローから始めましょう:

  1. 動画からスーパープロンプトへ デザインやランディングページ、アニメーションの画面録画を、Fable 5でHTMLをワンショットで作成できる超詳細なプロンプトに変換します。
  2. HTMLからインタラクションプロンプトへの変換 既存のHTMLページ(例えばAura Buildページ)を、1セクション、1つのアニメーション、1つのボタン、1つのホバー状態、または1つのWebGLエフェクトの再利用可能なプロンプトに変換します。
  3. 縫い付けされた全ページキャプチャ ヒーローだけでなくランディングページ全体をキャプチャし、エージェントに構成、テンポ、視覚的階層の全ページ参照を提供します。
  4. 日々のUIインスピレーション

このページは AI により自動翻訳されています。技術的な詳細は原文をご確認ください。

README

以下は原文 README の抜粋です。原文を見る。

Agent Skills

A curated collection of agent skills for designers and builders using Codex, Claude, Cursor, and other AI coding agents to build rich user interfaces, playable games, frontend systems, agent loops, automations, and reusable workflows.

Use these skills with Codex, Claude Design, Aura Build, Lovable, and the rest of your agent stack to turn references into prompts, generate detailed landing pages, build playable Three.js systems, and create reusable implementation workflows.

Start with the flagship web-design workflow:

  1. Video to Super Prompt Turns a screen recording of a design, landing page, or animation into a super detailed prompt that Fable 5 can use to one-shot HTML.
  2. HTML to Interaction Prompts Turns an existing HTML page, like an Aura Build page, into reusable prompts for one section, one animation, one button, one hover state, or one WebGL effect.
  3. Stitched Full Page Capture Captures the entire landing page instead of only the hero, giving your agent a full-page reference for structure, pacing, and visual hierarchy.
  4. Daily UI Inspiration Combines browsing, capture, reference study, and prompt generation into a useful agent loop that turns strong landing pages into detailed prompt packs.

These are portable agent skill folders: concise SKILL.md playbooks with optional references, articles, scripts, and assets. The goal is simple: turn good prompts, workflows, style systems, capture recipes, and debugging habits into versioned files an agent can load and follow.

Portable by default. Each skill should work for any user, repo, or workspace unless the user supplies project-specific context through local agent instructions.

Browse all runnable demos and recreation prompts.

Explore the 3D rendering skills for ultra-realistic water, underwater god rays, virtual tours, sky rays, sky backgrounds, falling leaves, four seasons, detailed textures and models, and Retina rendering at 200%.

Explore the illustration skills for 14 hand-written SVG illustration styles, from flat and outlined cartoon to halftone, one-line, isometric and vintage emblem, each with example cards, a palette, a drawing kit and a render-and-lint loop.

Use these skills when you want:

  • repeatable design direction
  • reusable game architecture and gameplay QA
  • procedural implementation steps
  • copy/paste snippets
  • common pitfalls and guardrails
  • reusable workflows instead of one-off chat answers

Agent support

The format is intentionally plain Markdown and folder-based.

GitHub で README 全文を見る

推奨ツール

別のキーワードを試すか、フィルタを外してください。

インストール

npx skillfish add mengto/skills
MCP 初心者?mcpskill.org のガイドから始めましょう →