Run This UI/UX Audit on Fable 5 Before It’s Too Late

If you’ve been using Fable 5 inside Claude, there’s a deadline you should know about.

July 8 changes everything.

Until now, many developers have been using Fable through their Claude subscription. Starting July 8, pricing becomes usage-based:

• $10 per million input tokens
• $50 per million output tokens

That means every large audit, architecture review, or long design conversation will cost significantly more than before.

So if you have one final opportunity to run an expensive prompt while it’s still covered by your subscription, don’t waste it.

Instead of asking Fable to generate another landing page or rewrite some CSS, use it for something that delivers long-term value:

Ask it to perform a complete UI/UX audit of your entire application.

Not as an assistant.

As your Senior Product Designer.

Why This Prompt Is Different

Most AI design prompts sound like this:

“Improve my UI.”

The problem?

AI usually responds with generic advice:

• Add more whitespace.
• Improve contrast.
• Use better typography.
• Make buttons more visible.

Those suggestions aren’t wrong.

They’re just shallow.

Real senior designers don’t think in isolated UI components.

They think about the product as a whole.

They ask questions like:

• Who is this product for?
• What feeling should users have?
• What should be emphasized?
• Which features are distracting?
• Which design rules should be broken?

That’s exactly what this prompt encourages.

Instead of Fixing Pixels, It Redefines the Product

The first thing the prompt tells Fable is:

Don’t assume the current design system is correct.

Instead, treat existing design documentation as a hypothesis.

That completely changes how the AI evaluates your product.

Instead of saying:

Current spacing token = 16px
Looks good.

It starts asking:

Does 16px spacing actually create the experience
this product is supposed to have?

That’s a much more valuable question.

Step 1: Build a Taste Baseline

Before making any changes, Fable first tries to understand the product.

It answers three simple questions:

Who uses this product?
Why do they use it?
What personality should the interface have?

For example:

Product:
Internal analytics dashboard
Users:
Data analysts
Character:
Professional
Fast
Minimal
Utility-first

A completely different product might look like this:

Product:
Children's learning app
Users:
Kids
Character:
Friendly
Playful
Colorful

These products should not look the same.

Yet many AI-generated interfaces do.

The taste baseline prevents that.

Step 2: Ignore Trends Unless They Fit

Modern design trends include:

• Glassmorphism
• Heavy gradients
• Floating cards
• Animated backgrounds
• Emoji everywhere

Those styles aren’t universally good.

They’re only good when they match the product.

Imagine adding neon gradients to a banking dashboard.

Or making medical software playful.

It would feel wrong.

The prompt explicitly tells Fable:

Only use visual trends if the product has earned them.

That’s how experienced designers think.

Step 3: Test Like a Real User

Instead of reviewing static screenshots, the prompt tells Fable to walk through the application like an actual customer.

It checks:

Desktop ↓ Tablet ↓ Mobile

At each size it looks for practical usability problems.

For example:

Navigation overlaps
Buttons become too small
Text gets clipped
Horizontal scrolling appears
Cards break alignment

These issues often go unnoticed until users report them.

The Audit Has Two Layers

Layer A: Correctness

These are things that should simply work.

Examples include:

• Overflow
• Broken layouts
• Accessibility
• Keyboard navigation
• Focus states
• Modal behavior
• Loading screens
• Error states
• Empty pages
• Disabled buttons
• Text scaling
• Touch target sizes

Example:

<!-- Bad -->
<button style="width:20px;height:20px">
Menu
</button>

A 20-pixel touch target is difficult to tap on mobile devices.

A better version:

<button class="btn">
Menu
</button>

.btn{
    min-width:44px;
    min-height:44px;
}

This follows common accessibility guidance.

Layer B: Taste

This is where the prompt becomes interesting.

Instead of asking:

Is this button aligned?

It asks:

Does this screen actually feel good?

It looks for subtle design problems like:

• Everything competing for attention
• Weak visual hierarchy
• Inconsistent spacing
• Too many shadows
• Too many borders
• Too many background colors
• Copy explaining the interface instead of helping users act

Imagine a card like this:

background:white;
border:1px solid gray;
box-shadow:0 4px 16px rgba(0,0,0,.2);
border-radius:24px;

Technically valid.

But visually heavy.

A senior designer might simplify it to:

background:white;
border:1px solid #eee;
border-radius:12px;

Cleaner. More intentional.

Three Levels of Authority

One of the smartest parts of the prompt is that it separates changes into three levels.

Level 1

Safe improvements.

Examples:

• Better spacing
• Better typography
• Better colors
• Shorter copy
• Removing duplicated elements
• Improved hover effects

These can be applied immediately.

Level 2

Medium-risk improvements.

Examples:

• Merge sections
• Reorganize dashboards
• Combine components

Each change is isolated in its own commit so it can be easily reverted.

Example:

Commit 1
Merged profile summary
and account settings

Commit 2
Combined duplicate navigation
components

Easy to review. Easy to undo.

Level 3

High-impact ideas.

These aren’t automatically implemented.

Instead, Fable proposes them.

Examples:

• Remove unnecessary features
• Redesign the navigation
• Replace the design language
• Simplify the onboarding flow

These decisions still belong to the product team.

The AI simply provides evidence.

Even the Design System Isn’t Safe

Many teams assume their design system is correct.

The prompt doesn’t.

If repeated problems point back to the design system itself, Fable updates the documentation.

For example:

Problem found:
Card radius inconsistent
across seven pages.
Cause:
Design token
radius-xl
too large.
Recommendation:
Reduce default radius
from 20px to 12px.

That’s a much deeper review than simply fixing one screen.

The Final Report Is Prioritized

Instead of dumping hundreds of suggestions, the audit produces a structured report.

Typical sections include:

Taste Baseline
↓
Major Improvements
↓
Level 2 Changes
↓
Level 3 Proposals
↓
Correctness Table

Example:

| Page      | Device     | Issue                 | Severity     | Status |
| --------- | ---------- | --------------------- | ------------ | ---------- |
| Dashboard | Desktop    | Weak visual hierarchy | High         | Fixed      |
| Settings  | Mobile     | Horizontal scroll     | Critical     | Fixed      |
| Checkout  | Tablet     | Button overlap        | High         | Fixed      |
| Profile   | Mobile     | Missing loading state | Medium       | Fixed      |

This makes the audit actionable instead of overwhelming.

Why This Matters

AI-generated interfaces are becoming increasingly common.

The challenge is no longer generating code.

It’s generating good product decisions.

This prompt shifts Fable from acting like a UI assistant to thinking like a design leader.

Rather than asking:

“How can I improve this page?”

You’re asking:

“How should this product feel, and what changes would move it closer to that vision?”

That’s a much higher level of thinking.

Final Thoughts

With Fable moving to metered pricing after July 8, your remaining subscription-based usage is valuable.

Instead of spending it on another code-generation session, consider investing it in a comprehensive UI/UX audit to improve your product across every screen.

Whether future models outperform Fable in design remains to be seen. But one thing is clear: giving an AI genuine design authority — paired with a well-crafted prompt — produces insights that go far beyond cosmetic tweaks.

If you only run one expensive prompt before pricing changes, make it one that leaves your product in a better place for months to come.