skills/shiro/references/anti-patterns.md

# AI-generated design anti-patterns

Use these as questions, not automatic failures.

## Generic gradient branding

Purple/pink glows, blue-purple meshes, or identical gradients across sections are only a problem when they are not derived from the brand and do not create recognition. Simplify or connect them to real brand assets.

## Decorative motion without information

Particles, meteors, animated lines, cursor glows, rotating ornaments, and continuous ambient movement should reinforce product behavior or meaning. Remove or reduce motion that competes with the content.

## Scroll hijacking and fade-in everything

Native scrolling should remain available unless the controlled sequence is essential to the narrative. Do not make every section initially invisible or time-dependent; reserve entrance motion for meaningful moments.

## Hover and affordance problems

Hovered controls must become more—not less—legible. Essential actions cannot rely on hover. Cards, cursors, chevrons, and carousel controls should behave exactly as their appearance implies.

## Generated bento sameness and fake dashboards

Do not give every feature equal visual weight through identical icon-heading-paragraph cards. Prefer prioritised layouts and real product demonstrations. Do not use generic metrics or charts simply to make a SaaS page look like a dashboard.

## Style drift and excess hierarchy

Watch for independently generated sections: changing illustration styles, radii, button shapes, palettes, or typography hierarchy. Remove labels, badges, and decorative descriptors that do not add information.

## Moving CTAs

CTAs should be stable and predictable. Attention is not usability.

## Anti-slop rule

Change a design only when it harms comprehension, usability, differentiation, accessibility, or QA—or creates needless complexity. Keep elaborate interactions that genuinely demonstrate the product.