Anti Ai Patterns

🛡️ Anti-AI-Generated Design & Slop Guardian Skill

The Anti-AI-Patterns Skill acts as an uncompromising aesthetic critic and quality guardian within the Pixel Crew framework. It does not write raw UI code—its sole objective is to inspect, score, and reject synthetic tropes before they reach the user.

---

1. Automated Detection Matrix: The 10 Banned AI Slop Patterns

The skill executes static and visual pattern recognition to strictly ban and reject these 10 synthetic AI tropes:

❌ THE 10 BANNED AI SLOP PATTERNS
├── 1. ❌ Monotonous 3-Column / 4-Column Stat Box Rows
│      Example: [ 486+ Hours ] [ 4+ Platforms ] [ 3+ Credentials ] [ 100% Delivery ]
│      Fix: Integrate metrics inline within case narratives, timeline ribbons, or asymmetrical callouts.
│
├── 2. ❌ Hashtag & Pill Badge Spam
│      Example: Row of 8 pill tags (#React #Nextjs #Groq #Tailwind #Vue #Laravel #Supabase #MySQL)
│      Fix: Replace with structured architectural specs, interactive code/tab matrices, or real stack diagrams.
│
├── 3. ❌ Fake macOS Windows with 🔴 🟡 🟢 Dots in Hero
│      Example: A decorative dark box with red/yellow/green macOS dots pretending to be a "terminal".
│      Fix: True high-impact typography lead, interactive system node diagram, or live code tabs.
│
├── 4. ❌ Checkmark Bullet Lists (✓) on Project Cards
│      Example: Every project card has 3–4 bullet points starting with green checkmarks.
│      Fix: Real engineering case narratives with problems, architecture decisions, and measured outcomes.
│
├── 5. ❌ Card-in-a-Card Syndrome (Nested Dark Box in Dark Box)
│      Example: A large dark rounded box containing 3 smaller identical rounded dark boxes with glowing borders.
│      Fix: Use clean divider lines, whitespace grouping, single cohesive containers, or tabular layouts.
│
├── 6. ❌ Predictable Split Hero (Left text, Right dark box, Bottom 4 stats)
│      Example: "Hello, I'm [Name]" + pills + right dark card + bottom 4 metric cards.
│      Fix: Asymmetric Bento Grid (col-span-8 deep dive + col-span-4 live telemetry), full-width editorial hero.
│
├── 7. ❌ Cyan/Emerald Neon on Flat Black Monoculture
│      Example: Defaulting to #10B981 / #00F0FF glowing text and green buttons on flat #0a0a0c.
│      Fix: Choose an authentic palette (e.g. Architectural Obsidian & Amber, Swiss High-Contrast Monochrome, Warm Editorial Stone & Ink).
│
├── 8. ❌ Cliché AI Copywriting & Fake Status Badges
│      Example: "✨ Elevate your workflow", "Seamlessly innovate", "Available for work" pill everywhere.
│      Fix: Concrete, grounded value propositions, real system metrics, and architectural outcomes.
│
├── 9. ❌ Monotonous 16px Rounded Cards Repeated Everywhere
│      Example: Every single section is just another grid of identical rounded rectangles.
│      Fix: Dynamic section rhythm (alternating airy typographic hero, dense technical table, interactive demo, asymmetric split).
│
└── 10. ❌ Meaningless Floating Icons at the Top of Every Card
       Example: Random Lucide icons placed above every sentence just to fill space.
       Fix: Purposeful visuals, interactive architecture graphs, or clean icon-free typography.

---

2. Concrete Component Refactoring Blueprints: "DO THIS, NOT THAT"

❌ Pattern 1: Banned Stat Box Rows vs. ✅ Asymmetric Metric Storytelling

❌ BANNED (Generic AI Slop):

{/* DO NOT GENERATE: Monotonous 4-card metric rectangle row */}

  
    486+
    Hospital IT Hours
  
  
    4+
    Platforms Built
  
  {/* ... repeated 4 times */}

✅ REQUIRED (Authentic Asymmetric Bento Narrative):

{/* DO GENERATE: Metrics embedded directly inside flagship project case study */}

  
    
      
      Production Flagship / Hospital Queue AI
    
    
      Sub-Second LPU Triage Dispatcher for 480+ Clinical Beds
    
    
      Engineered end-to-end patient queueing using Groq LPU inference, handling 486+ hours of live hospital operation with zero downtime.
    
    
      
        486h
        Live IT Operation
      
      
        99.98%
        Uptime SLA
      
      
        <450ms
        Inference Latency
      
    
  
  
  
    System Capabilities
    
      
        RAG Pipeline
        Groq / Llama-3
      
      
        HRIS Security
        QR-Tokenized
      
      
        Full Ownership
        Schema to UI
      
    
    4 Platforms Deployed & Client-Owned
  

---

❌ Pattern 2: Banned Fake macOS Window vs. ✅ Editorial Masthead & Live Architecture Graph

❌ BANNED (Generic AI Slop):

{/* DO NOT GENERATE: Fake macOS terminal box with 🔴 🟡 🟢 dots */}

  
    
    
    
    live-telemetry.sys
  
  GROQ LATENCY: 114ms

✅ REQUIRED (High-Impact Editorial Masthead):

{/* DO GENERATE: Pure typographic authority with direct contact and live stack summary */}

  
    
      Software Engineer & Systems Architect
    
    
      Building sub-second LPU inference systems & high-throughput web platforms.
    
    
      Specialized in clinical queue triage with Groq, tamper-proof QR HRIS engines, and full-stack React/Next.js/Laravel platforms.
    
    
      
        Flagship Deployments ↓
      
      
        Email Directly →
      
      |
      486h Clinical IT Experience
    
  

---

❌ Pattern 3: Banned Checkmark Bullet Lists vs. ✅ Engineering Case Studies

❌ BANNED (Generic AI Slop):

{/* DO NOT GENERATE: Identical card with 3 green checkmarks */}

  Hospital AI Triage
  
    ✓ Engineered ultra-fast symptom categorization
    ✓ Developed responsive Vue.js frontend
    ✓ Architected secure PHP database layer
  

✅ REQUIRED (Structured Architectural Narrative):

{/* DO GENERATE: Deep architectural breakdown with problem, solution, and specs */}

  
    CLINICAL AI & HEALTHCARE
    2026 / PRODUCTION
  
  Hospital Triage & Queuing Dispatcher
  
    Engineered to solve patient congestion across 480+ beds by routing incoming clinical symptoms through Groq LPU inference pipelines in under 120ms.
  
  
  
    
      Architecture
      Groq LLM + Vue 3 + Laravel REST
    
    
      Benchmark Result
      <120ms Latency (99.98% SLA)
    
  

---

3. Rubric Evaluation & Strict Score Gate

Every generated UI must be verified against the Anti-AI 6-Dimension Rubric ($\ge 8.5/10.0$ threshold to pass):

| Dimension | Weight | Slop Penalty Triggers (< 7.0) | Exemplary Standards ($\ge 9.0$) | | :--- | :--- | :--- | :--- | | 1. Layout Asymmetry & Bento Flow | 20% | Monotonous 3/4-card grids, split-hero box clones | Staggered column spans (8+4, 7+5), alternating rhythm | | 2. Typography & Hierarchy | 20% | Default Inter, low contrast, no fluid clamp | Expressive Display (Grotesk/Serif) + JetBrains Mono labels | | 3. Content Grounding & Metrics | 20% | Hashtag pills, cliché copy ("Unlock next-gen") | Concrete architectural specs, integrated metric story | | 4. Surface Depth & Color Authenticity| 15% | Cyan-on-black monoculture, purple mesh blobs | Curated obsidian/amber, stone/ink, or slate/cobalt tiers | | 5. Container Hygiene (No Card-in-Card)| 15% | Triple-nested rounded cards, identical borders | Clean divider lines, unified containers, whitespace gravity | | 6. Micro-Interactions & Living UI | 10% | Static decorative boxes, fake pastel charts | Interactive code tabs, live terminal shell, real filters |

---

4. Mandatory Execution Protocol for AI Coding Agents

When invoked in any coding agent (Antigravity, Kiro, Claude, Cursor):

1. Never jump directly to writing raw template cards.
2. Review the user brief and select an authentic visual archetype.
3. Embed metrics inside real project narratives, never in isolated 4-card stat strips.
4. Group technical capabilities by architecture layer, never as a raw cloud of hashtag pills.
5. No fake macOS red/yellow/green terminal widgets.
6. Run a self-audit against the 10 Banned Patterns before outputting code.

Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

• Author: hiroqt
• Source: hiroqt/PixelCrew
• License: Apache-2.0

Install and usage instructions live in the source repository linked above.