AOS/skills/design/horizontal-craft/anti-ai-slop.md

name, description, mode, platform, scenario, preview, default_for, fidelity, sources

name	description	mode	platform	scenario	preview	default_for	fidelity	sources
anti-ai-slop	Anti-AI-default design craft rules. Use during generation and again as a quality-gate check to avoid generic model output, fake proof, decorative emoji, template layouts, and unearned visual effects.	reference	any	horizontal-craft	type none	anti AI slop AI味 反AI味 generic design template-looking design design polish	system	adapted-from-open-design/craft/anti-ai-slop.md extracted-from-previous-quality-gate.md

Anti-AI Slop

This file is a generation-time craft reference. It defines what not to do by default.

quality-gate.md should reference this file, not duplicate it.

Core test:

Did this design choice come from the brief, scenario skill, design system, content, or user request?
If not, it is probably model autopilot.

A slop item is not always forbidden. It is forbidden when used as an unearned default.

---

P0 hard failures

Fix these before delivery.

1. Default indigo / purple AI accent

   • Avoid #6366f1, #4f46e5, #4338ca, #3730a3, #8b5cf6, #7c3aed, #a855f7 as generic accent colors.
   • Use the active design system token or a content-driven palette.

2. Generic blue-purple hero gradient

   • Avoid purple→blue, blue→cyan, indigo→pink hero gradients unless the brand or brief explicitly earns it.

3. Emoji as UI icons

   • Do not use ✨, 🚀, 🎯, ⚡, 🔥, 💡 as feature icons, section markers, button decoration, status labels, or deck bullets.
   • Use inline SVG, typographic numbers, CSS shapes, or no icon.

4. Invented proof

   • Do not invent “10× faster”, “99.9% uptime”, “3× productivity”, fake customer logos, fake testimonials, fake awards, fake press quotes, fake benchmarks, or fake market data.
   • Use horizontal-craft/link-and-proof.md.

5. Filler content

   • No lorem ipsum, “feature one / two / three”, “placeholder text”, fake console handlers, TODO comments, or empty demo logic.

6. Rounded-card dashboard default

   • Avoid the reflexive pattern: rounded white card + 1px border + subtle shadow + colored left border.
   • Use hierarchy, spacing, typography, and state semantics instead.

7. Unlabeled placeholders

   • If content is demo or missing, label it visibly. Do not disguise it as real proof.

---

Color and palette failures

Avoid as defaults:

• purple / blue two-stop gradients as hero, button fill, text gradient, progress bar, or accent
• generic AI dark mode: near-black background + indigo / purple glow
• mesh gradients without a strong reason
• pastel pink / lavender / peach as automatic “soft polish”
• black + gold / muddy bronze as automatic “premium”
• dirty earth tones on dark backgrounds
• Tailwind / Vercel tutorial defaults: indigo, slate, gray ramp, emerald accent, tutorial-blue
• low-contrast muted text, especially opacity 0.4–0.6

Prefer:

• a nameable color territory
• product- or content-driven palettes
• solid color fields when conviction matters
• material metaphors: paper, ink, cinnabar, brick, forest, phosphor, steel, terminal amber
• explicit CSS tokens instead of scattered magic hex values

---

Typography failures

Avoid as defaults:

• Inter, Roboto, Open Sans, Arial, system-ui, PingFang SC, HarmonyOS Sans, Microsoft YaHei as the visible display identity
• Space Grotesk / Fraunces / Playfair / Instrument Serif as automatic taste markers without reason
• italic serif accent word inside a sans h1 as a reflex move
• gradient text inside h1
• tracked all-caps section labels everywhere
• Chinese body text that is too light on dark backgrounds
• Chinese display text without an intentional display font or accepted fallback

Allowed:

• common fonts as fallback stack positions
• system fonts when the design system explicitly chooses a neutral product voice
• expressive fonts when loaded and tied to the visual direction

---

Layout failures

Avoid:

• generic Hero → Features → Pricing → FAQ → CTA sequence with no variation
• three equal feature cards with icon / title / description as filler
• bento grid unless the information is genuinely modular
• centered max-width: 800px; margin: auto; text-align: center across all sections
• card grids where every card has the same size and rhythm
• fake macOS window chrome with traffic-light dots
• top nav default: monogram left + four links right + hairline rule
• floating phone / device mockups with reflection as default

Prefer:

• asymmetric grids
• meaningful density variation
• editorial rhythm
• one strong signature surface
• exact-ratio frames for key screens
• visual choices based on actual content hierarchy

---

Component failures

Avoid:

• decorative emoji as icons or UI ornament
• pill chip with colored dot as the universal badge
• gradient primary button + outline ghost button with equal weight
• colored rounded status pills for every state
• fully rounded plastic CTA buttons with shadow
• fake avatars, fake quote cards, fake testimonial blocks
• icon grids that add no information

Use instead:

• inline SVG icons
• typographic numbers
• CSS shapes
• hairline labels
• text links for secondary actions
• real component states
• no icon when text is clearer

---

Imagery failures

Avoid:

• stock photos used as fake product evidence
• Unsplash desks, sticky notes, laptops-with-coffee, moodboards, gears, Pantone flatlays
• fake product screenshots with fake proof
• screenshots without captions or real source context
• three-quarter floating device mockups as default

If real imagery is missing:

• use type-only hero
• use honest product UI with demo-labeled content
• use SVG diagrams
• use typographic plates
• use honest placeholders

---

Chinese copy smells that affect design quality

This is not a copywriting rulebook. Only fix copy when it makes the artifact feel generic, breaks hierarchy, or weakens CTA clarity.

Common visual-quality smells:

• 赋能、打造、匠心、极致、丝滑、惊艳、震撼、颠覆、革新、引爆、解锁、加持、沉浸、深度、全方位、一站式
• 闭环、抓手、心智、链路、生态、矩阵、势能、心智占位
• 全新升级、隆重推出、强势来袭、火热进行中
• 「X，让 Y 更 Z」
• 「不止 X，更是 Y」
• 「重新定义 X」
• 「X，从未如此 Y」
• 「为 X 而生」

Prefer concrete verbs:

• 查、算、生成、对比、导出、预约、上传、筛选、复盘、发送

---

Motion failures

Avoid:

• fade-in on every section as the only motion idea
• parallax by default
• bouncing hover curves everywhere
• decorative background motion unrelated to the task
• animations that delay input or obscure results

Use:

• one purposeful signature motion
• tactile button feedback
• result reveal for tools
• view transitions for multi-view artifacts
• reduced-motion fallback

---

Background and texture failures

Avoid:

• full-page repeating grid / dot / line patterns behind text
• high-contrast patterns behind body or display text
• multiple noise layers
• blobs, orbs, gradient spheres, floating rings
• background decoration used only to fill empty space

Allowed:

• one subtle material texture on an isolated surface
• edge hairlines
• paper grain at low opacity when the visual world calls for it
• no texture when solid color is stronger

---

Over-addition decision table

Tempted to add…	Default decision
gradient	probably not; use solid field or grounded palette
emoji	no; use inline SVG, type, or nothing
rounded card + left-border accent	no; use hierarchy or divider
blob / hand-drawn hero illustration	no unless the visual direction needs it
testimonial quote	only with real user-provided quote
icon feature row	only if icons clarify information
bento grid	only if information is genuinely modular
hero + 3 cards + CTA	redesign from actual content
scroll reveal on everything	no; use one choreographed motion if any

Rule of thumb: if you are unsure whether to add it, do not add it.

---

Emoji scan

Before delivery, scan visible text and labels for emoji characters.

Forbidden emoji usage:

• feature icons
• slide icons
• section headers
• navigation icons
• status labels
• CTA decoration
• fake excitement or “friendly” ornament

Allowed emoji usage:

• user-provided content contains emoji
• product/content is emoji-based
• chat/social content uses emoji as actual content
• user explicitly requests emoji-led style

Replacement priority:

1. inline SVG
2. CSS shape
3. typographic number
4. text label
5. no icon

Mandatory scan ranges:

U+1F300–U+1F6FF
U+1F900–U+1F9FF
U+1FA70–U+1FAFF
U+2600–U+26FF
U+2700–U+27BF
U+2300–U+23FF
U+FE0F
U+200D