Last updated
AI Slop vs Craft: 6 Side-by-Side Redesigns of AI-Built SaaS Screens
Author
A founder shared their screen with us last month and said, "Nothing's broken. It just feels like nobody's home." They were right on both counts. The product ran. Signups were steady. But the dashboard could have belonged to any of their three competitors; the empty state said "Nothing here yet," and every error was the same red toast.
That feeling finally has a name. Macquarie Dictionary picked "AI slop" as its 2025 word of the year, and Merriam-Webster chose "slop." We’ve already covered what AI slop looks like in UX and the 12 signs your SaaS product has it. This post goes further. We show each screen side by side: first, how an AI tool builds it from a prompt, then how a senior designer rebuilds it after asking what the screen is actually for.
How did we build these examples? Each pair comes from patterns we see in real product audits, recreated for a fictional product. No client screens here; if we have a real client result, we link to the case study.
The short answer: what separates AI slop from craft
AI slop is a screen full of defaults nobody chose. Craft means every key decision has an owner who can explain it. The tools might be the same. The difference is whether someone with context stepped in between 'generate' and 'ship.'
AI Slop | Craft | |
Starting point | A prompt like "modern SaaS dashboard" | A user, a job and a first win |
Hierarchy | Everything at the same volume | One primary action per screen |
Copy | Could appear in any product | Names your object and the outcome |
States | Happy path only | Empty, loading, error and permission states designed |
System | Each screen generated on its own | Tokens and components reused everywhere |
Ownership | Nobody | A named person who can defend it |
Craft doesn’t mean "no AI." We use AI every day. Karo Zieminski’s AI-assisted craft framework makes a key distinction: who made the work, and how much care went into it. A human can ship slop. An AI-assisted team can ship craft.
Why slop passes the demo and fails in week two
Slop rarely looks bad. That’s why it ships. The aesthetic-usability effect tricks people into thinking polished interfaces are easier to use, even when they’re not. Visual polish can hide usability issues during testing. A clean AI-generated screen wins the demo because the demo account always has data, nothing breaks, and the presenter knows every click.
It’s everywhere. In April 2026, Adrian Krebs scored 1,590 Show HN landing pages against 16 common AI design patterns. 22% triggered four or more, another 32% triggered two or three. His verdict: uninspired, not criminal. For a weekend project, that’s fine. For a startup competing with four lookalikes, sameness costs real money.
In our audits, the pain shows up in week two. Support tickets start with 'how do I.' Activation stays flat while signups climb. Sales calls turn into homepage explainers. None of this looks like a bug; founders feel it before they can name it.
Redesign 1: The landing page hero
The AI version
A pill badge above the headline reading "New: AI-powered insights." A purple-to-indigo gradient across the words "Supercharge your workflow." Two buttons of equivalent weight, "Get started" and "Book a demo." Below that, three cards with an icon on top of each, and a logo strip labeled "Trusted by."
Each piece makes sense on its own. Together, they blend into every SaaS template the model has seen. Nothing on the screen tells you who the product is for.
The crafted version
The headline calls out the buyer and the job: "Month-end close for multi-entity finance teams, in three days instead of ten." A real product screenshot replaces the gradient, cropped to the one view that proves the claim. There’s a single primary button. "See a 2-minute walkthrough" drops to a quiet text link. Proof sits right next to the action, not hidden in a logo strip.
A buyer comparing vendors needs to remember you three days later. Specific positioning does that. Gradients don’t. When we repositioned InHouse around one clear promise, getting legal work done, and redesigned the site, product workflows, and brand to match, conversion jumped 105% in 45 days. The case study credits sharper messaging, clearer service framing, and a more task-focused structure, not just a new coat of paint. We go deeper on this in our guide to why so many SaaS products look the same.
What we kept
We kept the section order, navigation, and pricing link in the top bar. These conventions reduce friction. Craft means focusing effort where you stand out, not everywhere.
Redesign 2: The first-run empty state
The AI version
A friendly illustration, the words "Nothing here yet," and a "Create project" button that opens a twelve-field form. The model built this screen last, if it built it at all, because the demo account never sees it.
The crafted version
The screen spells out the first win in one sentence: "Connect a repository and get your first AI review." There’s one button. A "Try it with a sample repo" option catches people who are not ready to connect to real code. The setup form drops to three fields, and everything else gets a sensible default the user can change later.
The empty state is the first screen of activation, not a placeholder. When we worked with CodeRabbit, the drop-off sat before developers connected their first repository, so we redesigned onboarding around one goal: getting every developer to a first AI-powered code review in a single session, with fewer steps and clearer direction. For more patterns like this, see our SaaS onboarding UX guide.
What we kept
We kept the illustration style and button component. The art wasn’t the issue. The real problem was asking for effort before showing value.
Redesign 3: The dashboard
The AI version
Twelve KPI cards, all the same size, each having its own sparkline. Colored status dots on rows that have no status. A data table, an input form, and an export panel are all visible at once because the model assumed the user might need all three.
The crafted version
The dashboard answers one question first: what needs my attention today? Three metrics lead, each with context against last week or a target. The one anomaly gets the only strong color. Actions sit next to the data they act on. The form and export are hidden behind buttons that appear when relevant. That’s progressive disclosure, the single most common fix we make.
Every equal-weight card is a small decision handed back to the user. GoAudience came to us with a blunt founder brief: users were overwhelmed. Dense, repetitive cards and a weak hierarchy made it hard for audiences to compare and scan. Instead of a months-long redesign, we focused on the flows causing the most overwhelm and shipped fixes every week. The case study reports user workflows running twice as fast. Our dashboard UI design guide covers the patterns in more detail.
What we kept
We kept the chart library, queries, and almost all the data. Dashboards rarely need new data. They need a clear opinion about what comes first.
If your dashboard looks like the AI version, that’s normal for a product built fast. Our 5-day UX audit scores every screen based on impact and effort, so you know which three to fix first.
Redesign 4: Forms and error states
The AI version
"Something went wrong" in a red toast that disappears after three seconds. The form clears all fields when any field has an error. The button says "Submit."
The crafted version
Errors show up next to the field that caused them, in plain language, with the fix: "That phone number is missing a digit. US numbers have 10." Everything the user typed stays put. Long forms save progress. The button says what happens next: "Send application."
Forms are where intent turns into revenue: signup, checkout, applications, imports. Double Nickel had a CDL driver application that lost people at the same point every time. Hotjar recordings showed why: the form asked for too much too soon, before giving drivers any reason to keep going. We restructured it around progressive commitment, moving the heavier requirements later in the flow. Conversion jumped from 14.7% to 26.9% in two weeks. Clear errors and saved input follow the same principle: a form should never demand more effort than it has earned.
What we kept
We kept the validation logic. The engineering was solid. The interface just wasn’t telling users what the code already knew.
Redesign 5: The AI feature
The AI version
A sparkle icon on six different buttons. A chat panel docked in the bottom-right corner. AI output written straight into the record, with no label and no way to undo.
The crafted version
Each AI action is labeled by its outcome: "Write a reply from this thread." The result previews before it’s applied, right next to the messages it used. Accept, edit, and undo are each one click. AI-written content stays labeled after it’s saved. The chat panel is just for open-ended questions. The five most common prompts become buttons.
Nielsen Norman Group found that the sparkles icon is ambiguous to users. In a workflow product, one confident wrong answer with no way back can undo the trust that many right answers built. We cover this in our guides to AI feature UX and designing for unpredictable AI outputs.
What we kept
We kept the model, prompts, and response time. The AI was solid. The interface hadn’t earned trust yet.
Redesign 6: The visual system and brand
The AI version
Inter at every size and weight. One indigo accent on buttons, links, badges, and charts alike. Glassmorphism cards. Emoji in the sidebar. A friendly robot mascot that could front any AI startup.
The crafted version
One display typeface with some character for titles, and Inter for body text, because it’s a genuinely good screen face. Color gets roles: one for action, one for danger, one for success, and neutrals for everything else. Icons come from a single set. The illustration style fits the audience, not just "AI company." All of it lives in tokens, so the next generated screen starts from these choices, not the model’s.
Fambot had real technology behind it, but the mascot looked like generic AI, and the app felt vibe-coded rather than designed. The robot’s clean edges felt sterile. On the home screen, the header ate up space, cards had no clear hierarchy, and shadows were inconsistent. We rebuilt the mascot as a modular system of hand-drawn outlines and redesigned the home screen around what parents check first, with clear rules for when a card gets a border, a shadow, or neither. For the system side, see our guide to building a design system that survives AI tools.
What we kept
We kept Inter, the spacing scale, and the component structure. Not every default is bad. The goal is to turn every default into a choice.
The six redesigns at a glance
Screen | AI default | Crafted change | What it moves |
Landing hero | Gradient headline, two equal CTAs, icon cards | Buyer-and-job headline, real product shot, one CTA | Demo requests, recall |
Empty state | "Nothing here yet" and a 12-field form | One first action, sample data, 3 fields | Activation, time to first value |
Dashboard | 12 identical cards, everything visible | 3 lead metrics with context, progressive disclosure | Task speed, feature adoption |
Forms and errors | Vague toast, cleared fields, "Submit" | Inline fixes, saved input, specific button | Conversion, support load |
AI feature | Sparkles, chat panel, no undo | Outcome labels, preview, sources, undo | AI adoption, trust |
Visual system | Inter everywhere, one accent for everything | Type and color with roles, in tokens | Recall, consistency |
The pattern behind all six
Look across the pairs, and you’ll see the same five moves repeat.
Decide the job first. Every crafted screen starts with one sentence: who is here and what’s the one thing they need to do?
Design the unhappy path. Empty, error, loading, and permission states get as much attention as the demo flow.
Write for the customer. Copy should name the object and the outcome. 'Send application' beats 'Submit.'
Put it in a system. Turn decisions into tokens and components so they survive the next prompt.
Keep what works. Craft is editing, not demolition. In every pair above, most of the AI structure stayed.
Here’s the quickest test we know. For any screen, ask someone on your team who it’s for, what the one action is, and why it looks the way it does. If the honest answer is "that’s what the tool gave us," you’ve found slop. If they can defend it, you’ve found craft—whoever or whatever drew it.
Refresh, redesign or rebuild?
Most AI-built products need less work than founders think. The right scope depends on where the real problem lives.
Situation | What to do | Scope |
The product works, feels generic, and users get stuck in a few places | Refresh: copy, states and hierarchy on your existing components | Smallest; often a sprint or two |
Every screen looks slightly different and small changes break things | Redesign: tokens, a component library, then the top flows | Medium; system first, screens second |
Navigation and the data model don't match how users think | Rebuild the information architecture, keeping what you can | Largest; audit before you commit |
If you’re not sure which row you’re in, first sort your AI-built features into keep, simplify, cut, or rebuild. Our AI UX debt guide walks through that triage.
Run your own side-by-side this week
You don’t need an agency to start. You just need an afternoon and some honesty.
Pick the three screens closest to revenue. For most SaaS products, that’s signup, the first-run empty state, and the main dashboard.
Take a screenshot of each one as it is today. That’s your "before."
Under each screenshot, write one sentence: who is here and what’s the one thing they need to do?
Circle every element that doesn’t serve that sentence.
Redesign only that job. If you use an AI tool, give it your tokens, your components, and that sentence, not descriptors like 'premium' or 'clean.'
Put both versions in front of five real users and watch where they hesitate. The moment you want to say 'no, click over there,' that’s your data.
If you want a second opinion on work a designer or agency delivered, our founder's checklist for spotting AI slop in design work pairs well with this exercise.
Where Foundey fits
We’re an embedded product design team for SaaS and AI startups, and we use AI in our own work every day. What we add is the layer the tools skip: deciding who a screen is for, what to leave out, and what occurs when things go wrong.
If you would like a senior team to run this side-by-side on your real product, our 5-day UX audit maps every flow against five lenses (Mental Effort, Conversion Friction, Trust Architecture, Information Hierarchy, and Feedback Cycles), scores each issue by impact and effort, and hands you a 30-60-90 day fix roadmap. If you need that judgment every week, see how our embedded product design team works, or browse more before-and-after outcomes in our work.
FAQ
What does AI slop look like in a SaaS product?
Usually it appears polished. Common signs are a gradient hero with a generic headline, identical cards with equal visual weight, empty states that say "Nothing here yet," vague error messages, sparkle buttons with no clear outcome, and components that change from screen to screen.
Is AI-assisted design the same as AI slop?
No. AI-assisted design means a person sets the goal, constrains the tool, and reviews every decision. AI slop is output that ships without that review. The same tool can produce either.
What should you keep from an AI-generated design?
Keep the conventions that reduce friction: standard navigation, familiar layouts, sound validation logic, working queries, and a reusable component structure. Replace the defaults that carry meaning, such as headlines, hierarchy, empty and error states, and color roles.
Can you fix AI slop without a full redesign?
In most cases, yes. Copy, empty and error states, hierarchy, and a small token system fix the majority of problems on top of what you already have. A rebuild is only worth it when the information architecture or data model is wrong.
Does AI slop hurt conversion?
It rarely shows up as an obvious bug. It shows up as first-session hesitation, flat activation while signups grow, support tickets for fundamental tasks, and buyers who can't tell you apart from a competitor. Fixing the screens closest to revenue is usually where the measurable gains come from.
How long does it take to turn an AI-built product into a crafted one?
A self-check like the exercise above takes an afternoon. An expert audit of a SaaS product takes about a week. Foundey's audit is a five-day sprint. The fixes themselves range from a sprint or two for a refresh to a longer project when the architecture needs work.
Disclosure: Foundey uses AI tools for research and production every day. Every decision that ships is made and reviewed by a senior designer.
