Make UI Less Generic

Escape the default-AI look: define a real visual identity and apply it systematically across your app.

5 steps15 verify checks60-90 minutesWorks with: emergent · chatgpt · claude · cursor

Start Guided Walkthrough

#design #ui #branding #polish #deslop

The Route

0/5 verified

Audit the generic tells

Name exactly what makes the app look AI-default.

3 checks 02

Define the visual direction

You cannot restyle toward nothing - pick a direction with tokens.

3 checks 03

Apply the foundation

Install tokens globally: fonts, colors, spacing - the base coat.

3 checks 04

Restyle key components

The identity lives in the details: cards, buttons, forms, nav.

3 checks 05

Add micro-interactions and final sweep

Deliberate motion and a last pass separate polished from generic.

3 checks

Every step ends at a Verify Gate. Do not continue until every check passes.

Context Pack

Paste this first. It briefs the AI on requirements, constraints, and the Definition of Done before your first build prompt.

Context Pack

PROJECT CONTEXT:
My AI-built app looks like every other AI-built app: default fonts, purple gradients, emoji icons, cookie-cutter cards.

GOAL:
Define a distinct visual identity and apply it consistently: typography, color, spacing, components, and micro-interactions.

REQUIREMENTS:
- A named visual direction with specific tokens
- A real font pairing (not defaults)
- An intentional color system replacing generic gradients
- Component restyling applied consistently
- Micro-interactions that feel deliberate

CONSTRAINTS:
- No purple-to-pink gradient defaults
- No emoji as icons - use a real icon set
- Function must not regress while restyling

DEFINITION OF DONE:
- The app has a recognizable visual identity
- Typography, colors, and spacing follow defined tokens
- No default-AI tells remain (emoji icons, generic gradients, lorem)
- Interactions have polished hover/focus/transition states

COMMON FAILURES TO AVOID:
- Restyling one page while others keep the old look
- Swapping one gradient for another equally generic one
- Inconsistent spacing that keeps the cheap feel
- Breaking layouts while changing styles

Paste this into your AI builder first. It teaches the AI what you want before you give it the build prompt.