I redesigned the AI. Here's what happened - honestly and without embellishment
Main chat
A chat for vibe coders: news, guides, live cases, marketplace, and finding executors.
In March, I decided to check whether it is possible to give a redesign of the landing page to Claude Design and get a result that is not ashamed to show the client. Not “help write a prompt,” but a real iterative redesign from scratch through AI.
Spoiler: It worked. But not in the way I expected.
The starting point
Landing of a SaaS product for managing team tasks. Product 3 years, landing - about the same. Conversion rate from visitor to registration is 2.8%. According to the benchmark for this niche, 4-6% is considered the norm.
Task: Redesign landing without a complete product redesign. The first 3 screens are hero, social proof, value proposition. The time budget is one working day.
Tools: Claude (for concept, text, structure) + Figma (for visual) + v0 (for quick prototype in code).
Step 1: Diagnosing problems through AI – 1 hour
The first thing I did was not “draw something new,” but asked Claude to analyze the current landing page.
What uploaded: screenshots of all three screens + current header and subheading texts.
Prompt:
Here are screenshots of the current SaaS landing product for task management.
Target audience: team leads and managers in teams of 5-30 people.
Current conversion rate: 2.8% (Norm for niche: 4-6%).
Conduct a conversion audit:
1. What immediately catches your eye as a problem?
2. How clear is the value proposition in 5 seconds?
3. Rate all texts: title, subtitle, CTA
4. What's missing for trust?
5. Put problems first
What you got:
Claude issued a list of 9 problems. Some of them I already knew - a weak headline, no social proof above fold. But two insights were unexpected:
- The title “Manage Team Effectively” is a promise of process, not outcome. The user does not want to “manage effectively”, but “do not spend 2 hours a day on status rallies”.
- The feature section goes before the problem section. The user has not yet agreed that he has a problem and is already offered a solution.
Both findings are not new concepts. But when you see them articulated about your particular product, that’s different.
Step 2: New structure and texts – 1.5 hours
Prompt for structure:
Propose a new structure for the first three landing screens.
Product: [Description]
Audience: team leads, managers, 5-30 people in the team
The main pain: too much time for status synchronization and coordination
The structure should:
- Start with a problem that the user already feels.
- Offer a solution through the result, not through the features
- Contain social proof in the first two screens
- Have one clear CTA
Propose 2 variants of the structure with an explanation of the logic of each.
Got two options. The first is more aggressive, with pain in the headline. The second is softer, starting with the result.
I chose a hybrid: the headline from the result, but the second paragraph is about pain. I asked Claude to write three different titles:
Write 5 title options for this landing page.
Requirements:
- All right, 3 seconds.
- Talking about the outcome, not the process
- Without the words “effective”, “simple”, “smart” (banality)
- For a team lead that's fed up with chaotic status rallies
Of the five options, two were strong. I took one almost unchanged, one as the basis for editing.
**Important point: * Claude texts are 70% of the finished result. The remaining 30% – editing to the voice of the brand, clarifying the specifics, adding real numbers and details that AI does not have.
Step 3: Visual concept - 1 hour
Here AI has helped the least - and that's expected.
What did you try
Claude Design for mockup generation. Prompt described style, colors, structure. The result is a good starting point for a conversation, but not the final decision. The proportions were wrong, some elements were arranged strangely, the typography was not perfect.
Used it as a “skeleton” – transferred the structure to Figma and brought it to normal.
Where AI really helped with visuals:
- Description of the visual concept (“minimalistic, B2B, without unnecessary decorativeness, dark hero with accent blue”) →
- Selection of references through style description
- Generation of illustrative elements for hero (UI-screenshots of the product in mockups)
Step 4: Quick prototype in code – 45 minutes
That suddenly became the best part of the process.
He took the final design from Figma, described it to Claude, and asked to generate an HTML/CSS prototype for quick testing on real devices.
Received the working code of the first two screens from about the fifth request (there were several iterations with edits). This prototype was used to:
- Checking on mobile (in Figma mobile is not as honest as in the browser)
- Demo for the client without “it’s just Figma, in reality it will be different”
- A/B test using a simple traffic sharing script
What happened in the end
After 2 weeks of A/B testing new landing vs old:
- Conversion rate: up from 2.8% to 4.1% (+46%)
- Bounce rate on the first screen: decreased from 68% to 51%
- Time on page: up from 45 seconds to 1 minute 23 seconds
That's a good result. But more importantly, the whole process took one working day instead of the usual 3-4. And most of that time, I was thinking about the product and the users, rather than doing technical work.
What AI did well
Analysis and diagnostics. ** That's the best use. AI quickly finds obvious problems that are “blurred by the eye” in a person working with the product for a long time.
Texts and copy. Headings, subheadings, CTA – Claude generates enough options to find a good one. A final edit is needed, but this is editing a good foundation, not writing from scratch.
Structure and information architecture. Offer a logical sequence of sections, explain why one structure is better than another – AI does it well.
Do you need 5 versions of the CTA or 3 variants of the structure? Instead of brainstorming, one request.
What AI did wrong
Visual design. Generated layouts are suitable as a starting point, not as a result. Typography, proportions, visual hierarchy – all require serious refinement.
Product context. AI doesn’t know the specific details that make copyright compelling: real numbers, specific instances from users’ lives, the brand’s internal voice. It should be given to him explicitly.
“Team lead in B2B SaaS” is very broad. Nuances are understood only from real interviews with users. AI works with generalizations.
** Iterations with visuals.** Verbal description of design works to a certain limit. When you need accurate pixel work, Figma is still a must.
Honest conclusion
AI redesign is not a replacement for a designer. It's a different organization.
Earlier: a lot of time to generate options (texts, structure, concept) → less time to evaluate and select.
Now: less time for generation → more time for evaluation, decision-making, refinement and verification with data.
A skill that has become more necessary: the ability to set precise AI tasks. Bad results, bad results, loss of time. Good prompt → 70% finished solution → fast finish.
Step-by-step process of AI-redesign: cheat sheet
1. Diagnostics (1 hour)
Download screenshots + context in Claude
Get a list of problems.
Separate new insights from what you already know
2. Structure (30 minutes)
Ask for 2 Structure Options
Choose or create a hybrid
Record the logic of each block
3. TEXTS (1 hour)
Hero: 5 title options, 3 subheadings, 3 CTAs
Choose the best, refine to the voice of the brand
Add real numbers and specifics
4. VISUAL (Figma, independently)
AI generation as a starting point
Finishing with hands in Figma
5. PROTOTIP (30 minutes)
HTML prototype via Claude Code or v0
Checking on real devices
6. TEST
A/B test against current version
Minimum 2 weeks, sufficient sample
How to build an AI-redesign process: a detailed analysis of each stage
The step-by-step pattern above is a skeleton. This is what happens at every stage and where time is most often wasted.
Diagnostics: How to get the most out of AI analysis
The quality of the Claude output directly depends on the quality of the input data. "Check my landing" gives general recommendations. Contextual query with data – specific insights.
What must be given:
- Type of product and audience – AI needs to know who the user is
- **Current metrics - conversion rate, bounce rate, problem data
- ** Known Complaints** - What Users Say About Support
- Screenshots - not only the main screen, but also problem areas
What's often missed:
- Competitive Context: What Competitors Do Differently
- Traffic channel – users with SEO and advertising have different expectations
- *Mobile vs. desktop – if the difference is significant, screenshots are needed for both
Texts: iterative process, not one request
The first version of Claude’s lyrics is work material, not the final. The real process:
- Generate 5 header options
- Choose 2 that are close
- You ask them to refine them taking into account the specific details of the product (real numbers, real cases)
- Edit the final version under the voice of the brand
Error: Take the first generated text without iteration. The result will be "right but faceless." Iterations with specific edits give live text.
Useful prompt for iteration:
Here is a variant of the title: [text]
It's good, but it sounds too [general/corporate/aggressive].
Our brand voice: [description is friendly/serious/expert].
Make 3 choices with a different tone.
Visual: where AI helps and where it hinders
Helps:
- Describe the visual concept with words (“minimalist, dark hero, blue accent, B2B seriousness without boredom”)
- Find references through style description
- Generate the first draft for discussion with the team
- Create illustrative UI product mockups for hero block
Not helping (you need hands in Figma):
- Final typographical work (kerning, rhythm, hierarchy)
- Exact proportions and grids
- Animation and transitions
- Adaptation to different screen sizes
Use AI generation as a “quick draft to align expectations” with a customer or team. When everyone agrees on a direction, go to Figma.
Different Types of Tasks: When AI Redesign Works Best
Not all tasks are solved equally well through AI. Here's the map:
Great for the AI process
**Landings and marketing pages. ** The biggest influence of text and structure is the strength of AI. The visual is less critical than the UI product.
Email templates. Structure + text + simple visualization. AI is doing well.
Onboarding flow. The logical sequence of steps, the text of the clues, the structure – all this AI generates well. Visual design is finalized in Figma.
Information architecture. How to structure navigation for this product is a question AI provides useful options for discussion.
It requires more work with your hands
Product dashboards. Complex information hierarchy, many types of data, nuances of interaction - AI gives a common structure, the details need to work independently.
**Mobile-specifics (gestures, sizes, navigation patterns iOS/Android) – AI knows, but to implement correctly requires experience on the platform.
Complex data-heavy interfaces. Tables, graphs, filters — where the devil is in the details of the interaction. AI helps with the concept, the end with the hands.
Client AI redesign: how to build a process
If you work with a client (not an internal project), AI changes not only tools but also communication.
What to explain to the client
The customer may be surprised, “Are you using AI?” So I can write in ChatGPT myself. It's important to explain the value:
“AI generates options quickly. My job is to formulate the problem correctly, evaluate the quality of the output, choose the best, refine the details and check on users. AI speeds up the process — but decisions are made by a person with expertise.”.
Documentation for the client
The AI process is well documented: you can show “we generated 10 titles and that’s why we chose this one.” This makes the decision-making process transparent.
Typical AI redesign mistakes and how to avoid them
** Mistake 1: Adopt the first option** AI delivers a workable solution at the first request — and the temptation is to stop there. The first option is always “good enough” but rarely the best. At least 3 iterations.
** Mistake 2: Forget about user data** AI works with generalizations. You have specific data: interviews, session recordings, support data. Use them as a corrective signal – “AI suggested X, but our users say Y.”.
** Mistake 3: Skip validation ** AI redesign is not a substitute for user testing. Show the prototype 5 to real users before launching. This is 2-3 hours, which can save weeks of overwork.
** Mistake 4: Use AI text without editing** AI writes in "middle" language. Without editing to the voice of the brand, the result will be correct but faceless. Each text must go through the editor or the designer.
** Mistake 5: Skip the A/B test** “AI helped, so it’s better” is not proof. Testing against the old version is the only way to know for sure.
How to evaluate the quality of AI output: checklist for a designer
The main skill when working with AI is not “how to ask”, but “how to evaluate the answer”. Without this skill, the AI process generates a lot of noise and little signal.
For Texts: 5 Assessment Questions
**1. Does that mean value or function? ** “Manage tasks in one place” is a function. "Free 2 hours a week from status rallies" is a value. A good headline is about value.
**2. Is it specific or generalized? ** "Save time" is generic. “Save 4 hours a week” – specifically. AI is prone to generalizations - add specifics yourself.
**3. Does that sound like your brand? ** AI says "average." The brand's voice is individual. If the text could belong to any competitor, you need an edit.
**4. Does that answer the user's question? ** The user who came to the landing page has a specific question: “will this solve my problem?” The text should respond to him.
**5. Can it be reduced without losing meaning? ** AI is often verbose. If you can remove 30% of the words without losing the meaning, remove them.
For structure: 3 evaluation questions
**1. Is consistency logical? ** Each next block must follow from the previous one. “Problem → agravation → solution → proof → CTA” is logical. "Fichie → CTA → problem" - No.
**2. Is there a missed step? ** AI sometimes misses an important element. No social proof? No answer to the main objection? Check the converting landing list.
**3. Is it for your audience or the average? ** AI offers a framework for “typical SaaS.” If your audience is atypical (a very narrow niche, a specific market), the structure needs to be adapted.
Prompt engineering for redesign: advanced techniques
After the basic prompts - several techniques that significantly improve the quality of output.
Play the part technique
You are an experienced conversion rate optimization specialist with 10+ years of B2B SaaS practice.
Analyze this landing page from a conversion perspective. Be critical and specific - I want real problems, not general advice.
[screenshots/description]
Indicating a role dramatically changes the quality of analysis – Claude switches to expert mode, rather than general assistant.
Devil's Advocate Technique
After receiving recommendations, ask for weak points:
Here are 5 changes you have recommended for landing.
Now play the role of a skeptic: which ones might not work and why? What are we missing? Where can our assumptions be wrong?
This identifies risks before launch, not after.
The Competitive Context Technique
Here's our landing: [Description]
Here's what 3 top competitors do: [description or screenshots]
What are we doing worse than our competitors in terms of conversion? What's better? Where is our ability to differentiate?
Technique "User in the head"
Imagine that you are [target user description: position, tasks, pains].
You first came to this landing through an advertisement with the ad "[advertising text]".
Describe your thoughts and feelings when viewing each block. What convinces you that you don't? At what point would you hit CTA? Where did you close the tab?
This is a simulation of a user interview without recruiting.
AI Redesign Tools 2025–2026: What to Use
The ecosystem is changing rapidly. Up-to-date tool map:
For analysis and texts
Claude (claude.ai) - the best for long analytical tasks, structuring, writing texts. He understands complex context and works with screenshots.
ChatGPT (openai.com) is strong for generating copy options, especially marketing ones. It works well in “generate 10 options”.
For visual design
*Claude Design – generation of mockups and visual concepts. Best for quick sketches for discussion.
v0 (v0.dev) - generation of React components and landing pages from the description. Good for creating quick prototypes in code.
Figma AI - built-in AI functions in Figma: content generation for placeholder, component variants.
For code
Claude Code - Writing, refactoring and explaining code. Ideal for creating HTML/CSS prototypes from Figma layouts.
*GitHub Copilot is an assistant directly in the code editor. Accelerates the implementation of prototypes.
For research purposes
Perplexity / Claude with Search – quick research of competitors, benchmarks, best practices in the niche.
The Ethics of AI Redesign: What to Remember
Rapid redesign through AI creates temptations that should not be given in.
Don't miss user validation
AI is not a substitute for 5 interviews with real users. Show the prototype to live people before launch – especially if the redesign involves critical flow.
Don’t attribute AI results without verification
“AI suggested is optimal” is not an argument. AI optimizes for patterns from training data, not for your specific audience. Always check with an A/B test.
Retain authorship of decisions
AI generates options – you make decisions. In the documentation, in the conversation with the team, be honest that you used AI as a tool, not as a substitute for professional expertise.