How To Use ChatGPT for UI Design: The 9 Best Prompts

CareerFoundry Blog contributor John Cheung

First things first, there’s something you need to know: UI designers’ jobs aren’t threatened by ChatGPT. 

But don’t dismiss the AI tool completely—although it can’t compete with your average UI designer, there are still ways to use ChatGPT to lighten your daily workload.

Spending a few hours learning to harness ChatGPT for UI design could quickly pay off if it saves you even an hour a week.

In this article, we’ll first outline the basics of the AI tool. We’ll then go over some ideas for how you can use ChatGPT for UI design and walk you through nine of the best prompts. Finally, we’ll wrap things up with a few key takeaways.

You can use this clickable menu to skip ahead to a certain section:

  1. What is ChatGPT?
  2. How to use ChatGPT for UI design
  3. 9 Best ChatGPT prompts for UI design
    1. Checkout prompt
    2. Interactive elements prompt
    3. Color schemes and typography prompt
    4. Error message prompt
    5. Onboarding flow prompt
    6. Feedback form prompt
    7. Layout concepts prompt
    8. UI elements prompt
    9. Microinteraction ideas prompt
  4. Round-up

1. What is ChatGPT?

We’re sure most of you will be familiar with ChatGPT by now, but let’s start with a quick intro to the chatbot for those who aren’t.

ChatGPT—or, to use its complete name, Chat Generative Pre-trained Transformer, is a large language model-based (LLM) chatbot.

Developed by U.S. artificial intelligence research lab OpenAI and launched on November 30, 2022, it’s renowned for its remarkable conversational and research abilities.  

ChatGPT’s core function is to mimic conversation, and it can do this very well, as users can easily steer conversations with it to the length, tone, format, and language (within limits) they want.

Additionally, ChatGPT is versatile enough to serve a whole host of other functions. Some of these include:

  • Generate business ideas and creative concepts (such as names and branding strategies)
  • Write fiction, poetry, and song lyrics
  • Write and debug software
  • Translate text into various languages

Of course, the quality of its output can vary greatly depending on several factors, including the user’s input or prompt. We’ll get on to that later.

So, now that we’ve looked at what ChatGPT is and a bit of the story around it, let’s look at which parts of UI design it can be used for.

2. How to use ChatGPT for UI design

Before we go into specific prompts you can use for ChatGPT in the next section, it’s worth taking a wider look at the kinds of ways it can help you with UI design.

To keep it simple, it helps to think about three broad ways you can use ChatGPT in UI design:

Idea generation and refinement

ChatGPT is useful for quickly coming up with multiple design ideas and then helping you refine them. You can prompt it with your context, requirements, and early concept and ask for support in creating more detailed ideas.

Alternatively, you could prompt it with a more concrete, developed concept and ask for an analysis of its strengths and weaknesses.

Its ideas won’t be fully formed and can’t include visuals, of course, but they will likely be helpful as a starting point for your design exploration.

Creating checklists for concepts and early designs

When prompted with the right context and requirements, ChatGPT can help you by suggesting user flows, navigation structures, and typical features.

You could also work with it to create broader design concepts, layout ideas, typography options, and possible color palettes, as well as options for interactive elements like input forms, buttons, menus, and other interactive elements.

Draft content generation

This will be especially useful if you’re not confident in your writing ability or you’re on a team that doesn’t have the support of a dedicated content designer, UX writer, or copywriter (although, of course, ChatGPT cannot create content of the same quality as a professional writer).

Giving ChatGPT the context around your UI and user journeys and asking it for clear and concise options for your UI copy–for example, labels, descriptions, tooltips, modals, error messages, and so on–can be productive. You can even prompt it for suggestions in line with your brand’s voice and tone.  

The more seasoned UI designers of you might be reading this and thinking these are all second nature. And that may well be true. But for those who are a bit fresher or perhaps struggle slightly in one or more of the above areas, ChatGPT could add some value.

 Now, let’s look at 9 specific prompts–related to these three areas–that can help you generate ideas from ChatGPT.

9 Best ChatGPT prompts for UI design

1. Checkout prompt

Use it for: A quick checklist to make sure your checkout UI ticks off the essentials.

Prompt: Design a user-friendly checkout process for an e-commerce website with an emphasis on reducing cart abandonment.

Output:

(All outputs are reduced for the sake of space, but you can head over to ChatGPT with the prompts to see what you get.)

A screenshot of a prompt showing how to use chatgpt for ui design

2. Interactive elements for engagement prompt

Use it for: Getting lots of quick ideas for interactive elements to explore further.

Prompt: “Generate ideas for interactive elements that encourage user engagement in a fitness-tracking app.”

Output:

A screenshot of a prompt showing how to use chatgpt for ui design

3. Color schemes and typography prompt

Use it for: A starting point for exploration, discussion, and further research around color schemes and typography.

Prompt: “Suggest color schemes and typography for a finance management app that conveys trust and reliability.”

Output:

A screenshot of a prompt showing how to use chatgpt for ui design

4. Error message prompt

Use it for: Generating quick copy ideas for a cookies modal or similar. 

Prompt: Write copy for a modal telling users about a website’s cookies policy. Write it in an approachable tone.

Output:

A screenshot of a prompt showing how to use chatgpt for ui design

5. Onboarding flow prompt

Use it for: Ideas on potential onboarding flows and understanding what they might typically look like.

Prompt: “Create a user flow for onboarding in a language learning app. Emphasize the ease of use for beginners.”

Output:

A screenshot of a prompt showing how to use chatgpt for ui design

6. Feedback form prompt

Use it for: Quick ideas on how to structure and create a feedback form. 

Prompt: “Design a feedback form that encourages users to provide detailed insights for a product improvement app.”

Output:

A screenshot of a prompt showing how to use chatgpt for ui design

7. Layout concepts prompt

Use it for: Brainstorming potential layout concepts.

Prompt: “Generate layout concepts for a minimalist portfolio website that effectively showcases a photographer’s work.”

Output:

A screenshot of a prompt showing how to use chatgpt for ui design

8. UI elements prompt

Use it for: Getting a quick overview of commonly used UI elements in dashboards. 

Prompt: “Suggest UI elements for a clean and modern dashboard to display sales analytics.”

Output:

A screenshot of a prompt showing how to use chatgpt for ui design

9. Microinteraction ideas prompt

Use it for: Generating fast microinteraction options as a platform to explore from.

Prompt: “Suggest microinteraction ideas to make a social media feed more engaging without overwhelming the user.”

Output:

A screenshot of a prompt showing how to use chatgpt for ui design

4. Round-up

As we’ve already stated, ChatGPT can’t be used for the vast majority of UI design, and it won’t replace UI designers in the foreseeable future.

It can, however, be a useful tool to help UI designers to some extent with some parts of their jobs. 

It can speed up idea generation and refinement, quickly create checklists for concepts and early designs, and create basic content and copy drafts.

So whether you’re an aspiring or established UI designer, some time spent exploring, creating, and tweaking prompts might be a good long-term investment, especially as its capabilities and functions are only going to expand. 

It doesn’t end there—discover the best AI tools for UI design in this article.

Want to learn more about the world of UI design? Try our free short course.

And if you enjoyed this article, then you might also like these:

What You Should Do Now

  1. Get a hands-on introduction to UI design and design your very first app screen with a free, self-paced UI design short course.

  2. Take part in one of our FREE live online UI design events with industry experts, and read about UI graduate Florian’s career change to product design.

  3. Become a qualified UI designer in just 4-9 months—complete with a job guarantee.

  4. Don’t miss our biggest deal of the year! This month, get up to 30% off tuition with our End-of-Year Offer. Schedule a call with a program advisor today and take the first step toward your future!

What is CareerFoundry?

CareerFoundry is an online school for people looking to switch to a rewarding career in tech. Select a program, get paired with an expert mentor and tutor, and become a job-ready designer, developer, or analyst from scratch, or your money back.

Learn more about our programs
blog-footer-image