ReddRadar
Agent skill
ban-pattern
Register AI-generated-looking UI patterns as prohibited rules in the design system. Use when user says "AIっぽい", "AI臭い", "これ禁止", "このパターンやめたい", "ban this pattern", "add to prohibited", or points out a generic/cookie-cutter UI element.
Install this agent skill to your Project
npx add-skill https://github.com/tsubotax/melta-ui/tree/main/skills/ban-pattern
SKILL.md
AI生成UIに頻出する「それっぽい」装飾パターンを特定し、DS全体の禁止ルールとして登録する。
手順
Step 1: パターンを特定する
ユーザーの説明（テキスト or スクリーンショット）から、禁止対象のパターンを特定する。
以下を明確にする:
- 何が問題か: どの視覚要素がAI生成っぽいのか
- 該当する Tailwind クラス / CSS: 具体的な実装パターン（例:
border-l-4,bg-gradient-to-r） - 代替パターン: DS準拠の代わりの実装
不明点があれば AskUserQuestion で確認する。推測で進めない。
Step 2: 既存ルールと重複がないか確認する
以下を読み込む:
foundations/prohibited.mdの「AI生成パターンの排除」セクションCLAUDE.mdの禁止パターン要約テーブル
既に同じ or 類似のルールが存在する場合は、ユーザーに報告して既存ルールの更新で対応するか確認する。
Step 3: 禁止ルールを登録する
以下の3箇所を更新する（順序厳守）:
3-1. foundations/prohibited.md — SSOT（正規版）
「## AI生成パターンの排除」セクションのテーブルに行を追加する。
セクションが存在しない場合: ## コンポーネント の直前に以下を挿入してからルールを追加する:
## AI生成パターンの排除
> AI（LLM）がUIを生成する際に頻出する「それっぽい」装飾パターンを明示的に禁止する。
| 禁止 | 理由 | 代替 |
|------|------|------|
フォーマット:
| 禁止パターン（具体的な Tailwind クラス） | 理由（なぜAI生成っぽいか） | 代替（DS準拠の実装） |
3-2. CLAUDE.md — 禁止パターン要約テーブル
禁止パターン要約テーブルに1行サマリーを追加する。 AI生成パターン関連の行は近くにまとめて配置する。
テーブルが見つからない場合: ## 禁止パターン要約 セクションを Grep で探す。見つからなければユーザーに報告して確認する。
3-3. 関連コンポーネント md — 禁止事項
パターンが特定のコンポーネントに関連する場合、該当する components/*.md の禁止事項セクションにも追記する。
Step 4: 既存サンプルを走査・修正する
examples/ と docs/ 配下のHTMLファイルを Grep で走査し、禁止パターンに該当する実装が既にないか確認する。
該当がある場合:
- 全箇所をリストアップしてユーザーに報告する
- ユーザーの承認後、DS準拠の代替パターンに修正する
該当がない場合:
- 「既存サンプルに該当なし」と報告する
Step 5: 結果を報告する
以下のフォーマットで報告する:
## 禁止パターン登録完了
**パターン**: [禁止したパターンの説明]
**Tailwind クラス**: `[該当クラス]`
**代替**: `[DS準拠の代替]`
### 更新ファイル
- foundations/prohibited.md — AI生成パターンの排除セクションに追加
- CLAUDE.md — 禁止パターン要約に追加
- [components/xxx.md — 禁止事項に追加]（該当する場合）
### サンプル修正
- [修正した箇所のリスト or 「該当なし」]
トラブルシューティング
| 問題 | 対処 |
|---|---|
foundations/prohibited.md が存在しない |
ユーザーに報告し、ファイル作成の承認を得る |
| 「AI生成パターンの排除」セクションが存在しない | Step 3-1 のテンプレートで自動作成する |
| 禁止パターンの Tailwind クラスが特定できない | AskUserQuestion でスクリーンショットや具体例を求める |
| 既存ルールと部分的に重複する | 既存ルールの拡張（行の更新）で対応するか、新規行として追加するかをユーザーに確認する |
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
tsubotax/melta-ui
design-review
davila7/claude-code-templates
verl-rl-training
Provides guidance for training LLMs with reinforcement learning using verl (Volcano Engine RL). Use when implementing RLHF, GRPO, PPO, or other RL algorithms for LLM post-training at scale with flexible infrastructure backends.
davila7/claude-code-templates
openrlhf-training
High-performance RLHF framework with Ray+vLLM acceleration. Use for PPO, GRPO, RLOO, DPO training of large models (7B-70B+). Built on Ray, vLLM, ZeRO-3. 2× faster than DeepSpeedChat with distributed architecture and GPU resource sharing.
davila7/claude-code-templates
gguf-quantization
GGUF format and llama.cpp quantization for efficient CPU/GPU inference. Use when deploying models on consumer hardware, Apple Silicon, or when needing flexible quantization from 2-8 bit without GPU requirements.
davila7/claude-code-templates
Claude Code Guide
Master guide for using Claude Code effectively. Includes configuration templates, prompting strategies "Thinking" keywords, debugging techniques, and best practices for interacting with the agent.
davila7/claude-code-templates
qdrant-vector-search
High-performance vector similarity search engine for RAG and semantic search. Use when building production RAG systems requiring fast nearest neighbor search, hybrid search with filtering, or scalable vector storage with Rust-powered performance.
Didn't find tool you were looking for?