Article
Design process

updated on:

27 Nov

,

2024

A No-BS Guide to Product Design AI Tools From Working Designers

12

min to read

Table of contents

While countless articles list product design AI tools, product designers struggle to effectively integrate these tools into their workflow. 

Here’s what Daria Kornienko, a UI/UX designer at Eleken, has to say on this topic:

In fact, I realized that what matters most is not the number of tools you have but how you use them. For example, you can master your skills with GPT and cover 80% of your needs. In addition, many emerging AI tools are either still immature or do pretty much the same thing as GPT.

So, rather than overwhelming you with a long list of solutions that each solve only a small part of the problem, drawing from our product designers' hands-on experience, we'll share how to strategically use a few key AI tools to enhance your design process.

To keep things simple, we’ve divided the tools into three categories. Without further ado, let’s dive into the first one:

AI tools for UX design

AI in UX design excels at automating repetitive tasks and streamlining workflows. This way, AI allows product designers to focus on creativity and user-centric solutions. 

In this section, we'll pay special attention to ChatGPT, which our designers use daily to improve their UX process in many different ways. We'll also look at some helpful Figma plugins since Figma is our main design tool, and having AI assistance right inside it can really make your work easier. 

Chat GPT

using Chat GPT AI in product design

There’s probably no working product designer in the world now who hasn’t heard about Chat GPT. So, instead of explaining what it is, let's jump straight into exploring the situations when this AI is useful in product design.

Use cases for generative AI in product design

ChatGPT can streamline many aspects of a designer's workflow, including creating user personas or using GPT for UX research. Let’s see some interesting cases described by Daria Kornienko from her own experience.

  1. Brainstorming

GPT can be your fellow UI/UX designer for this purpose, with whom you can

  • generate new concepts
  • dispute on the relevance of certain design decisions
  • discuss decisions that you doubt about

How to make the most of it:

  • Clearly explain the problem or goal you’re working on.
  • Provide context, such as user needs or constraints.
  • Ask Chat GPT to play a specific role, like a fellow designer or a critical reviewer.

Here’s Daria's personal take on this use case:

In most cases, my work involves improving existing products. So, the tasks I work on with Chat GPT are related to redesigning features or adding new functionality rather than creating ideas from scratch. In these instances, I use Chat GPT as my personal brainstorming assistant. I explain the ideas I have or describe the design problem, outlining its pros and cons. We then have an actual conversation — like I’m discussing the issue with a colleague.

Sometimes, Chat GPT offers a completely fresh perspective, revealing angles I hadn’t considered. To be effective, this should be not just a quick Q&A exchange but a thoughtful dialogue. But remember,
you're the designer with more expertise who makes the final decision.
  1. Refining user flows

When refining user flows, Chat GPT can provide suggestions to optimize navigation, reduce friction, and improve clarity. Overall you can engage AI in UX audit. It can help:

  • Highlight potential pain points in the flow.
  • Suggest alternative steps or layouts for smoother navigation.
  • Simulate how users might move through your product.

Tips for refining user flows with Chat GPT:

  • Describe the flow in detail, step by step or upload screenshots.
  • Highlight any known issues or areas you’re unsure about.
  • Ask Chat GPT to imagine navigating the flow as a user and identify potential improvements.

Daria shares:

GPT generates ideas the human mind cannot quickly create. It helps explore user flows by assuming how a user might navigate a product and what part of my design may not be intuitive. Then, AI suggests improvements. I, as a designer, then sort through the ideas to pick what works best.
  1. Generating content

Microcopy — such as button labels, onboarding messages, or error prompts — is a small but essential part of product design. Chat GPT makes it easier to:

  • Write content tailored to your product’s tone and audience.
  • Test different versions of text to find what resonates.
  • Add playful or engaging elements to your copy.

How to get great content from Chat GPT:

  • Provide detailed context about your product, users, and tone of voice.
  • Specify the type of content you need (e.g., buttons, error messages, headers).
  • Request multiple options and refine them based on your feedback.

Daria explains:

I often use GPT-4 for writing content. For this purpose, it’s crucial to give it detailed instructions about the product, like the tone of voice and the target audience. For instance, I recently worked on a product for developers. I explained that the tone should be playful and relatable to their humor. GPT adjusted the copy to include jokes and phrases developers would appreciate.

Here’s an example of a prompt I used:
"My product is an AI tool for developers. Please create ideas for a playful and fun header about [topic]. The user is a developer, so adjust the language to include their slang."
  1. Presenting new ideas to your client

Chat GPT can help you prepare for client presentations by:

  • Crafting strong arguments to support your design decisions.
  • Simulating potential client questions and helping you refine answers.
  • Helping you organize your pitch into a structured, persuasive narrative.

Tips for presenting ideas effectively with Chat GPT:

  • Share details of your design solution and the client’s needs.
  • Ask Chat GPT to list arguments supporting your solution or potential drawbacks.
  • Use the AI’s suggestions to create multiple options for solving the problem.

Here’s a quote from Daria:

Whenever I need strong arguments to pitch my design ideas or explain why a particular solution might not work, I consult Chat GPT. I either upload a screenshot or explain my request in text format. Together, we refine the reasoning, and I use that to present multiple solutions to the client. It really pumps up your presentation skills
  1. Simulate user testing

While it can’t replace real user feedback, Chat GPT can simulate a user’s perspective to help you:

  • Identify potential pain points or confusing elements.
  • Validate early designs before actual testing begins.

Tips for simulating user testing with Chat GPT:

  • Upload or describe your design in detail.
  • Ask Chat GPT to imagine interacting with it as a user.
  • Request feedback on specific elements, such as navigation clarity or visual hierarchy.
Sometimes, I upload a screenshot of my design, and Chat GPT evaluates it as if it were a user. It points out potential areas of confusion or where users might hesitate. While it’s not a substitute for actual user testing, it’s a great way to catch early design flaws before conducting more formal usability tests. – Daria

Custom GPTs for designers

In general, I use ChatGPT for just about everything. That's because it has different custom versions for UI/UX designers – some help to write creatively, others help to identify UI patterns, some are savvy with technical knowledge, which helps to better understand developers and design documentation. — Nazar Neshcheret, Eleken UI/UX designer

As Nazar explains, custom GPTs are like having specialized teammates on hand for different parts of the design process. And there are dozens of them in Chat GPT. 

For example, Daria Kornienko uses two custom GPTs — Design Wizard and Designer GPT by Pietro Schirano

example of a custom GPT Design Wizard for AI and product design
Custom GPT for UI/UX designeres
custom GPT example for product designers

Here’s how she applies Designer GPT to her work:

I recently received a task, but I quickly realized that my client’s idea was rather strange and inconvenient from a UX perspective. I went to Designer GPT, explained my concerns, and together we discussed the pros and cons. The GPT helped me craft a solution and prepare a detailed explanation of why the client’s idea would be too complex and impractical.
GPT prompt example for assessing the pros and cons of design desicion
A piece of Daria's chat with custom GPT

However, the effectiveness of custom GPTs can vary depending on the complexity of your task, or the quality of the prompt you provide.

So, how to find the right Custom GPT?

  1. Go to the “Explore GPTs” and type in what you need (e.g., "designer" or "UI/UX").
where to find Custom GPTs in paid Chat GPT version?
  1. Look at the description of each custom GPT, their competencies, and the number of users. Select a few that match your requirements.
  2. Present the same design problem to multiple GPTs and evaluate their answers. Choose the one that gives you the most relevant and professional results.
  3. If your preferred GPT starts providing less accurate answers, revisit the search process. Either refine how you’re explaining your problem or test new custom GPTs to find a better match.

If one custom GPT doesn’t meet your expectations, you can always try another. Asking multiple custom GPTs the same question and comparing their answers is often the best approach. It’s also crucial to use your own critical thinking and not rely solely on AI-generated insights.

Finally, here are a few tips on how to ask questions in Chat GPT:

  • Set up your own instructions: Paid versions allow you to customize your profile to align with your interests and workflow. Specify your role, goals, and expectations. There are many online guides on the internet on how to do it – combine the best prompts and add something relevant for you specifically.
an instruction on how to customize GPT's answers

Here’s an example of Daria’s custom instructions: 

example of custom instructions in Chat GPT for UI/UX designer
  • Be clear and detailed: Frame your questions with context and specificity. 
how to ask questions in Chat GPT for UI/UX designers
  • Use or create your own custom GPTs: Search the GPT store for specialized options. Test multiple GPTs to find the best fit, or create your own for recurring needs.

Probably that’s enough information on Chat GPT, let’s move to AI Figma plugins useful for UX design needs. 

QoQo.ai

QoQo.ai as one of the best AI for product design
User journey map generated with QoQo AI

What it does:
QoQo.ai integrates seamlessly into Figma to generate everything related to UX, like customer journey maps, or user flows. It saves time by transforming text-based inputs into visualized UX elements. So, basically, you can use Chat GPT to generate a user persona and use it in QoQo AI to get a visualization right in your Figma file. 

How to use it:

  • Create user personas: Provide a basic persona description (e.g., "Frequent traveler looking for affordable flight options"). Add key scenarios, and QoQo.ai will visualize the journey map for you.
  • Visualize journey maps: Provide key scenarios and persona descriptions, and QoQo.ai transforms them into clear, actionable journey maps.
  • Design user flows: Use the tool to outline and structure user interactions for a seamless UX.

However, keep in mind that no AI UX research is effective only in combination with conventional user research

Why it’s great: The plugin combines AI-generated insights with the precision of Figma, making it easier to integrate AI into existing design workflows.

Wireframe Designer

How to use Wireframe Designer AI Figma plugin for AI product design

What it does:
Wireframe Designer speeds up the creation of basic UX layouts. It interprets inputs about app goals and generates wireframes with structured user flows both for mobile and desktop.

How to use it:

  • Choose if you want to create a wireframe for mobile or desktop version.
  • Describe your project, providing details such as app purpose, target audience, and functionality.
  • The tool produces an initial layout with sections like navigation, key features, and user actions. Use the wireframe as a foundation, refining it to match the design goals.

Daria shared how, using Wireframe Designer, you can create a booking app's wireframe:

I described the app’s purpose and target user. In a matter of seconds, it delivered a wireframe of the homepage with relevant sections like search, upcoming events, and speakers. Adjustments took minutes instead of hours.
Wireframe designer Figma plugin prompt example for creating event booking app
Prompt Daria gave to Wireframe designer
AI-generated product design example of a wireframe for an event booking app
Mobile wireframe generated by AI
web version of wireframe  for event booking app generated by AI
Desktop wireframes generated with Wireframe Designer for the event booking app

Why it’s great: It makes rapid prototyping during the ideation phase easier.

Figjam AI

using Figjam AI in product design

What it does:
Figjam AI is a brainstorming assistant integrated into Figjam, Figma's collaborative whiteboard tool. It helps designers generate ideas, summarize discussions, and draft early concepts for UX designs.

How to use it:

  • Find a star icon in the top menu panel.
  • Write what you need help with and click “Generate”. You may use prompts like for example "Generate five ideas for improving onboarding flows" to jumpstart team discussions.
  • AI will visualize your request/idea.

For example, here's the result our designer Darina got when she asked FigJam AI to generate a user persona with details like goals, background, and motivations and then summarize that information.

user personas generated with Figjam AI

Why it’s great: Designers used this as a starting point to refine their flow and usability strategies.

As a summary for this section, here’s an important thing to remember when using product design AI tools for UX: since AI is still in the early stages of development, it can make many mistakes. As a human, you should always double-check each answer artificial intelligence provides.

AI tools for UI design

From generating prototypes in minutes to crafting perfect color schemes, here’s how you can make your UI process faster, smarter, and more creative using AI for product design. The tools mentioned below will help you with those tasks, however as Daria says 

In most cases, AI-generated design won't be your final choice, but it makes finding creative ideas much faster.

Uizard.io

Uizard.io Ai for product design
Source

What it does:
Uizard.io is a rapid prototyping tool that allows designers to create app or website interfaces quickly. It’s perfect for turning rough ideas into visual prototypes in minutes. 

How to use it:

  • Select mobile, tablet, or desktop as your base.
  • Provide details about the design purpose, style preferences (colors, fonts, etc), and features.
  • Uizard.io delivers clean, ready-to-use UI prototypes that can be further refined.
Uizard AI prompt example
AI-generated product design example of mobile version of even booking application
Mobile prototype version of an event booking app
how to generate UI interface with Uizard AI
example of work in Uizard AI product generator
AI-generated product design of a desktop podcast app depicting several screens of a main flow

Here’s one more use case that Daria shared from her experience using this tool: 

When you're at the ideation stage, you can use Uizard.io to present your client's product in various UI styles. Just upload a reference you like (using a screenshot, URL, or text prompt) and generate a similar theme for your app. The good part is you can edit the result by changing fonts, styles, and visuals.
The reference Daria used for her podcast app
UI styles generated with AI app
The results she received
You can also test the prototype you created using heat mapping within Uizard.io. It will predict which areas of the interface users are most likely to focus their attention on.
heat mapping with Uizard AI

Why it’s great: It’s an intuitive tool for ideation and prototyping, ideal for early-stage design exploration.

Foundation: Color Generation

example of using Figma plugin Foundation Color Generation

What it does:
Foundation: Color Generator is a Figma plugin that helps designers create accessible and cohesive color palettes, making it easier to maintain consistency in UI design systems.

How to use it:

  • Pick a base profile: Orbit, Atlassian, Material, Ant Design.
  • Choose tone: Color, Dark, Surface
  • The plugin provides complementary colors and assesses their accessibility on light and dark backgrounds.
  • Add generated colors directly into your design system.

Why it’s great: It simplifies the creation of color palettes while ensuring adherence to accessibility standards. What is more, it can organize structured color palettes into a clear table that you can use for your UI kit/design system.  

Huemint

using Huemint AI to pick the right color for your app

What it does:
Huemint uses AI to generate unique color schemes tailored for branding and UI designs. It works great for brainstorming color ideas for your product.

How to use it:

  • Input details such as project type (brand, website, graphic) and the desired mood (gradient, illustration, amount of accent colors).
  • Explore color combinations that suit your needs.
  • Use advanced options to adjust contrast or customize your palette further.

One more tip from Daria here:

Doublecheck if proposed colors are compatible with each other in terms of accessibility.

Why it’s great: Huemint is perfect for discovering fresh and innovative color ideas.

Magician

Using Magician AI for product design tasks

What it does:
Magician is a Figma plugin that creates icons, images, and other design elements using AI. It’s a lifesaver for designers who need quick assets without leaving their workspace. When is best to use it? Here’s an answer from Daria:

As for me, I find this plugin most useful for creating icons. Sometimes you may need an icon for a specific purpose and can't find a suitable one in any ready-made icon pack. You can request Magician to generate the needed icon for you.

How to use it:

  • Generate icons: Specify the style or theme of the icon you need.
  • Create images: Input a description to generate custom visuals.

Why it’s great: Magician eliminates the need to search externally for assets, keeping everything streamlined within Figma.

Cleanup.pictures

AI tool example to clean background Cleanup.pictures

What it does:
Cleanup.pictures removes unwanted elements from images with remarkable accuracy.

Here’s a quote from Daria Kornienko:

There are situations when a client sends you images that have unnecessary details that need to be removed. From my experience, Cleanup.pictures does this job very accurately. The task is done quickly, and you can export your image.

How to use it:

  • Drag and drop your file into the tool.
  • Highlight objects or elements to erase.
  • Save the edited image for further use.

Why it’s great:
It’s quick, easy, and perfect for minor adjustments that enhance overall aesthetics.

Icons8 Background Remover

Icongs8 Background Remover AI tool for UI/UX design purposes

What it does:
The same as our previous tool, Icon8 simplifies the process of removing backgrounds from images, ensuring clean and professional results. Why do we need to mention two of them? Daria will explain:

I know there are dozens of plugins that remove backgrounds. The problem with most of them is that they often reduce image quality and fail to remove tiny details (like a hair) properly. Icon8 copes with both problems well.

How to use it:

  • Select a file from your computer or library.
  • The tool removes the background automatically.
  • Export the isolated subject for use in your designs.

Why it’s great:
It delivers high-quality results, especially for product photography or user avatars.

Gamma AI

Gamma AI to make presentations for product design purposes
Source

What it does:
Gamma AI is a dynamic presentation tool that uses AI to create visually stunning decks for product pitches, updates, or presentations.

How to use it:

  • Define the purpose of your presentation (e.g., product update, sales pitch).
  • Add text or bullet points, and Gamma AI generates polished slides with layouts and visuals.
  • Adjust colors, images, and layouts to match your branding.

Why it’s great:
Gamma AI is perfect for creating engaging presentations or pitch decks quickly, making it easier to showcase design concepts or updates to stakeholders.

Tools with AI for testing & copywriting

Creating seamless UX and eye-catching UI is only part of a product designer's job. From analyzing usability to generating content for realistic mockups, there are countless other tasks that are just as critical. Fortunately, combining AI and product design can be a game-changer for handling these responsibilities efficiently.

Attention Insight

Attention Insight AI tool used for heat mapping by product designers

What it does:
Attention Insight is a Figma plugin that provides heatmaps and focus maps that predict where users will look on a design. As well, it assesses your interface for accessibility (pay attention to the number in the lower right corner on a screenshot).

How to use it:

  • Upload a design or connect the plugin to your Figma file.
  • Examine areas with the most and least user attention.
  • Tweak layouts to ensure users focus on the right elements.

Why it’s great: It eliminates guesswork in visual hierarchy, making it easier to improve user engagement.

Clueify

Clueify AI tool for testing used for UI/UX design purposes

What it does:
Clueify evaluates designs and performs A/B testing to determine which variations resonate best with users. It provides data-driven insights to enhance design decisions.

How to use it:

  • Upload multiple versions of a layout.
  • Gather feedback from real users or predictive AI models.
  • Identify the most effective design based on engagement metrics.

Why it’s great: Clueify simplifies decision-making by delivering actionable insights for iterative improvements.

Content Reel

Content Reel AI Figma Plugin used by UI/UX designers

What it does:
Content Reel Figma plugin allows designers to quickly populate designs with realistic placeholder content such as names, avatar images, and data sets. This helps make mockups more visually aligned with real-world applications.

“Finally, I don’t have to put ten John Does in the table in my interface,” – says Daria about this tool. 

How to use it:

  • Open the Content Reel plugin within Figma.
  • Select the type of content you need (e.g., avatar photos, names, job titles).
  • Drag the chosen content directly into text or image layers in your design.

Why it’s great:
It saves designers significant time by automating the repetitive task of adding placeholder data. Instead of using generic text or empty images, Content Reel ensures your designs feel complete and presentation-ready.

How to find new tools with AI

As we mentioned at the beginning, the number of AI product design tools you use isn’t what defines success — it’s how effectively you use the right ones. Plus, most tools need paid subscriptions to show their full potential. So, if you’re already paying for an advanced version of ChatGPT, isn’t it wise to use it for as many purposes as possible?

However, the AI market is evolving at lightning speed. New tools are emerging every day, offering unique solutions to common design challenges. To stay up to date, our designers recommend these go-to resources: 

  • Product Hunt: A treasure trove of online product design tool lists. Type "AI" into the search bar, and you’ll find a curated list with details such as user adoption, ratings, and descriptions to help you discover what’s trending.
how to use product hunt to find new AI tools for product design
  • Figma Community search: Since Eleken relies heavily on Figma for our design work, we often explore Figma’s community plugins for AI-powered solutions. It’s a great way to find tools that integrate directly into your existing workflows.
searching for AI tools in Figma community

Well, seems like it’s time to sum up. Here’s what we want to tell you – design is about solving user problems, and AI’s role is to help designers do that faster and more efficiently. 

If you’re still wondering, “Can AI replace product designers?” the answer is no. No matter how many AI tools you incorporate into your process, as long as we create designs for people — which requires understanding human psychology, cultural context, and creativity — AI cannot replace the designer.

At Eleken, we’ve learned how to streamline our process with AI in SaaS while staying true to what matters most: creating exceptional, user-centered designs. With the right tools and expertise, we’re here to help you solve your design challenges and deliver outstanding results.

Share
written by:
image
Kateryna Mayka

Senior content writer at Eleken UI/UX design agency. Kateryna has 4 years of experience translating complex design concepts into accessible content for SaaS businesses.

imageimage
reviewed by:
image
Daria Korniienko

UI/UX Designer at Eleken with over 2.5 years of experience. With a marketing degree, Daria combines business insights with creative design to craft intuitive SaaS products. Her recent work helped a client grow their user base from zero to 1,000 and earn a top 3 spot on Product Hunt.

imageimage