Communitygithub.com

Pacheche/unslop-anything

AI生成っぽさを取り除き、オリジナリティを加えるためのスキル。ウェブページ、UI、画像、文章など、あらゆるコンテンツの「スロップ(AIのデフォルト臭さ)」を検出・修正します。

unslop-anything とは?

このスキルは、AIが生成したような「スロップ(凡庸で決断のないアウトプット)」を検出し、それを具体的で独自性のある成果物に修正するためのワークフローを提供します。主にClaude CodeやCodexなどのAIエージェント上で動作し、HTML/CSS/React/Vue/SvelteなどのUIコード、モバイルアプリ画面、画像・イラスト・ロゴなどのビジュアルデザイン、そしてブログ記事やドキュメント、UIコピーなどの文章を対象とします。スキルは大きく「デフォルトの除去」と「決断の追加」の2段階で構成され、まず`slop_scan.py`スクリプトでパターンをスキャンし、その後詳細なチェックリスト(サイン)を元に監査・修正を行います。UI修正は特定のパス順序に従い、最終的には「テンプレートテスト(競合の名前に置き換えても違和感がないか)」を必ず実施します。重要なのは、製品の機能や内容は保持したまま、クラフトマンシップのみを改善することです。

対応~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/Pacheche/unslop-anything/tree/HEAD

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

Unslop Anything

AIスロップとは、誰も決断しなかったもののことです。モデルが最も一般的な答えに手を伸ばした結果、その出力は他と見分けがつかなくなります:バイオレットのグラデーション、すべてのラベルに付く絵文字、挨拶文のヘッドライン、「単なるXではなく、Yです」という文。たとえ良いパターンでも、みんながデフォルトで出荷するとスロップに変わります。

したがって、アンスロップには二つの側面があり、両方必要です:

  1. デフォルトを取り除く。 名前付きの兆候をすべて見つけ、具体的な値や具体的な文で修正します。
  2. 決断を加える。 どんな製品にも当てはまるクリーンな結果は、次のテンプレートにすぎません。完成した作品には、この製品、ブランド、または書き手だけが持つものが少なくとも一つ含まれていなければなりません。

作業は自分で行います:ファイルを読み、編集し、レンダリングし、比較します。素材自体からわからないことだけをユーザーに尋ねます。

このスキルの使い方

パスはこのスキルのフォルダを基準とします。参照はオンデマンドで読み込み、一度にすべては読み込みません。

  1. ルーティング。 あなたがアンスロップしようとしているものを判断し、その参照のみを開きます。
媒体読むもの
Webアプリ、ダッシュボード、ランディングページ、HTML/CSS/React/Vue/Svelte UI全般references/ui-signs.md、references/ui-passes.md、references/direction.md
モバイルアプリ画面(iOS, Android, React Native, Flutter, SwiftUI)上記UIファイルに加えて references/mobile.md
画像、イラスト、アイコンセット、ポスター、ソーシャルグラフィック、スライド、ロゴreferences/visual-design.md、references/direction.md
文章:投稿、スレッド、記事、メール、ドキュメント、README、UIコピーreferences/writing.md
コピーもスロップになっているUI最初にUIを修正し、次に references/writing.md を使ってコピーパスを実行

ユーザーが特定のオーバーレイやコンポーネントを要求し、その名前が曖昧な場合(「ポップアップを作って」)は、構築する前に references/component-vocabulary.md を確認してください。

  1. ジョブを選ぶ。

    • 検出。 ユーザーが「これはスロップ?」と尋ねる、監査を希望する、または何も変更しないでほしいと言う場合。媒体のサイン・ファイル(ui-signs.md、visual-design.md または writing.md)のみを読み込みます。編集は行いません。次の形式で回答します:
      スロップレベル:N%(重い | 軽い | なし)
      <カテゴリ>
      - <サイン>:<場所:ファイル:行、画面領域、または「引用文」> -> <修正案を数単語で>
      確認が必要な主張:<検証不可能な主張、またはなし>
      未確認:<確認できなかったもの、またはなし>
      修正しますか?
      
    • 修正(デフォルト)。 以下のワークフローを実行します。
  2. 素材を目の前に置く。

    • コード:画面をレンダリングするファイルを見つけます。実行できる場合は、実行してスクリーンショットを撮ります。コードだけでなく、人が見るものを判断します。
    • URLがありコードがない場合:ブラウザツールで開き、スクリーンショットを撮り、HTMLをローカルにコピーとして保存して作業します。出力は、ユーザーがサイトの所有者に渡せる再設計されたファイルです。その旨を伝えます。
    • スクリーンショットのみ:それに近い1つの静的HTMLファイルとして再構築し、それをオリジナルとして扱い、その旨を伝えます。
    • ブラウザやレンダリングツールがない、またはアプリが起動しない場合:画面を静的HTMLファイルに抽出し、可能であればそれをレンダリングします。そうでなければコードから作業し、すべての視覚的確認項目を「未確認:」の下にリストします。
    • 文章:ドラフトが貼り付けられていない場合は依頼します。対象読者が不明な場合は、1つだけ質問します:誰がこれをどこで読むのか。

ワークフロー

  1. スキャン。 コードまたはテキストファイルの場合、スキャナーを実行します。スキャナーは候補を見つけるものであり、判定を下すものではありません:
    python3 <skill folder>/scripts/slop_scan.py <files or folders>
    python3 <skill folder>/scripts/slop_scan.py --text draft.md      # 任意のファイルに文章ルールを適用
    
    Windowsでは python3 の代わりに py を使用します。必要なのはPython 3のみです。終了コード0は候補なし、1は候補あり、2は何もスキャンされなかったことを示します。 スキャン対象はターゲットのみとします:画面のファイルとそれが使用する共有コンポーネントやスタイル。リポジトリ全体は対象としません。ただし、ユーザーがリポジトリ全体の監査を依頼した場合は除きます。リポジトリ全体の監査の場合は --json を使用し、読み取る前にルールごとにヒットをグループ化します。各ヒットを読み取って確認します。誤検出は破棄し、その理由をレポートに記載します。
  2. 監査。 媒体のサイン・ファイルを確認します。サインごとに1行:何を、どこで(ファイル:行、画面領域、または引用文)、修正方法。スキャナーでは見えないサイン(階層、リズム、構成、意味)も追加します。
  3. 評価する。 サイン・ファイルのカテゴリ(スキャナーではなくファイルのカテゴリ)のうち、少なくとも1つのサインがあるものを数えます。各サインは、それを最初にリストしている1つのカテゴリにのみ分類します。その数に10を掛けたものがスロップレベルです。UIの場合、最後のカテゴリ(テンプレートルック)は、他の9つが空の場合にのみカウントします。次にモードを選択します:
    • 重い(50%以上):完全なプロセス。方向性を最初に決定。
    • 軽い(10-40%):ポリッシュモード。監査で見つかったものだけを修正します。パレット、タイポグラフィ、レイアウト、トーン、ブランドは維持します。より大きなアイデアは提案としてレポートに記載します。
    • なし(0%):その旨を明確に伝えます。正確な値を伴う2つまたは3つの改良点を提案し、ユーザーが同意した場合のみ適用します。単に目新しさのために良い作品を決して変更してはいけません。
  4. 方向性(重いUIおよびビジュアルデザインのみ)。 references/direction.md に従います:製品ステートメント、キャラクター、世界観、瞬間、シグネチャー。新しいルックの場合は、1つに決める前に3つの候補となる方向性を示します。監査と方向性を表示し、ユーザーの回答を待つために一時停止します。方向性を後で変更すると全てをやり直すことになるからです。ユーザーがすでに「とにかくやってくれ」と言っている場合のみ、待機をスキップします。その場合でも、レポートには3つの候補(それぞれ1行)と、なぜその1つを選んだかを記載します。
  5. パスで修正。 UI:パスの順序は references/ui-passes.md に従います。ビジュアルデザイン:順序は references/visual-design.md に従います。文章:ワークフローは references/writing.md に従います。次のパスを開始する前に、作品全体に対して1つのパスを完了します。
  6. 検証。 再度レンダリングし(実行ごとに最大3回)、フルサイズで領域ごとに確認します:衝突する列、クリップまたは重なったテキスト、ずれたエッジはそこにしか現れません。監査リストと使用した参照のチェックリストと照合します。スキャナーを再度実行します。リストに残っているものは修正されるか、明示的に正当化されます。
  7. レポート。 前後のスロップレベル、方向性、パスごとに変更点を数行、破棄した誤検出、確認できなかったもの(「未確認:」)、ユーザーに確認が必要な主張を記載します。

譲れないルール

  • 製品を維持し、クラフトを変える。 機能、コンテンツ、データ、セクションの順序、製品名はそのまま残します。セクションを追加してはいけません。
  • モックデータはプレースホルダーのみを置き換える。 オリジナルがプレースホルダー値($123,456、Lorem、John Doe、偽のチャート)を示している場合、それらを妥当なモック値に置き換えることができます。すべてのモック値はレポートの「置き換えるモックデータ」の下にリストします。実際のデータは決して変更しません。
  • 決して捏造しない。 新しい機能、統計、お客様の声、出典、ロゴ、引用は追加しません。「10,000以上のチームに信頼されています」や「10倍高速」といった主張は、ユーザーに確認するか削除します。それらをレポートにリストします。
  • 削除した装飾を新しい装飾で置き換えない。 パープルグラデーションをグラスモーフィズム、グレイン、ネオン、ベントーグリッド、3Dガラスアイコンに交換することは、新しいトレンドの中での同じスロップです。
  • 静かであることと、薄いことは違う。 すべての色を取り除いて何も読めなくなるのも失敗です。色は意味を持つ場所に残します:主要なアクション、選択状態、ステータス、データ系列、一つの重要な瞬間。
  • 色とラベルは真実を伝える。 ラベルはその数値と一致します(「64%回復」は、スケールがそうでない限り「優れている」ではありません)。赤は問題を意味します。緑は良好を意味します。
  • デザインシステムを通じて作業する。 プロジェクトにテーマトークンやCSS変数がある場合、その値または使用方法を変更します。ハードコードされた値でそれらをバイパスしてはいけません。
  • 書き手の声と実際のブランドを維持する。 実際のロゴ、色、書体はそのまま残します。ロゴのバイオレットからブルーへのグラデーション、スパークルタイル、グローは、ユーザーがそう言わない限りブランドではありません。文章は書き手の語彙、率直さ、ユーモアを維持します。
  • 有名なアプリをコピーすることはアンスロップではない。 構造と数値のために3〜5つのリファレンスを調査し、ある製品のルックを別の製品に貼り付けてはいけません。
  • 検出器の推測はしない。 検出モードでは、証拠を持ってパターンに名前を付けます。「これはAIによって書かれた」とは決して主張しません。
言い訳現実
「今はきれいに見える」きれいはテンプレートです。テンプレートテストを実行してください:競合の名前に置き換えます。それでも適合するなら、方向性を推し進めてください。
「ユーザーはただきれいにしたいだけだ」きれいであることと、異なることは同じではありません。10のきれいなAIアプリを並べると、1つのアプリになります。
「色を削除すれば直る」段階、アクセント、意味なしに色を削除すると、グレーのテンプレートになります。
「スキャナーは何も見つけなかった」ヒットゼロは、grep可能なサインがゼロであることを意味します。階層、リズム、意味は依然としてあなたの目を必要とします。
「レンダリングはスキップします。コードは正しいので」スロップは人が見るものに宿ります。クリップされたテキスト、不均一なギャップ、弱い階層は、レンダリング時にのみ現れます。

テンプレートテスト(毎回、最後に実行)

製品名または書き手の名前を競合のものに置き換えます。画面、画像、またはテキストが編集なしでまだ適合する場合、それは完成していません。コピー、ビジュアルモーメント、シグネチャーのディテールで方向性をより強く推し進めてください。

関連スキル