UI/UX Design with Gen AI: Wireframing & Prototyping (2026)

In this lecture, you’ll learn how large language models (LLMs) such as ChatGPT can dramatically speed up the UI/UX design process. You’ll see how AI can be used to generate user personas, create user journeys, mockups and suggest layout ideas in seconds. The session focuses on practical, real-world prompts that help you move faster without sacrificing design quality—showing how AI becomes a design assistant that supports ideation, validation, and decision-making throughout the UI/UX lifecycle.

In this lecture we take a look at ChatGPTs Pricing Models. This is important as the free tear has limitations you should be aware of

In this lecture, you’ll learn how to use ChatGPT as a creative partner for generating UI/UX design ideas. You’ll explore how AI can help brainstorm layouts, features, navigation patterns, and user flows based on real product requirements. The focus is on turning vague ideas into structured design concepts quickly, helping you overcome creative blocks, explore multiple design directions, and arrive at stronger, more user-centred solutions with greater confidence and speed.

In this lecture, you’ll learn how to use ChatGPT to quickly generate realistic UX personas that inform and guide your design decisions. You’ll see how AI can help identify user goals, behaviours, pain points, and motivations based on product context and assumptions. The session focuses on turning these AI-generated personas into practical design inputs—helping you make more user-centred decisions, validate ideas earlier, and design experiences that better align with real user needs.

In this lecture, you’ll explore how ChatGPT can be used to help design wireframes and mockups directly through structured prompts and visual guidance. You’ll learn how to describe layouts, components, and user flows in a way that translates into clear wireframe and mockup concepts that can be taken into design tools like Figma or Miro. The focus is on using AI to accelerate early-stage design thinking—helping you move from ideas to tangible UI structures faster, while maintaining clarity, usability, and design intent.

In this lecture, you’ll learn how to use ChatGPT as your personal UI/UX expert to analyse and critique your designs. You’ll see how AI can provide structured feedback on usability, accessibility, visual hierarchy, and user flows, helping you identify potential issues and areas for improvement. The session focuses on asking the right questions and using AI-driven insights to refine your designs, validate decisions, and iterate more confidently—just like having an experienced UI/UX professional reviewing your work.

In this hands-on workshop, you’ll learn how to write an effective initial prompt to create a working prototype of our high-end trainer e-commerce website using Lovable. You’ll see how easy it is to get a working prototype together in minutes.

We continue workshopping our prototype, looking at the user experience journeys it has created and the effectiveness of the user interface.

Now we have a working prototype, it's time to make some changes. In this lecture we check out how to change elements directly and how to prompt different user interface elements

We've added User interface elements, but how about new journeys? Lets add a returns page in this lecture by prompting for new pages and key elements to manage the return process.

I am keen you have full visibility on what is possible for free and what you have to pay for. This lecture now dives into the pay structure for the tool, which is especially interesting as it utilises AI credits, of which there are ways of minimising the cost to yourself here

In this lecture, you’ll get a practical overview of Balsamiq and how it’s used for rapid wireframing. We’ll walk through the core features of the tool, including the interface, key components, and basic workflows, so you understand what Balsamiq is designed to do and when to use it. By the end of this session, you’ll have a solid foundation for creating low-fidelity wireframes and will be ready to start using Balsamiq confidently in your own design process.

Let's take a look at the pricing model. Balsamiq doesn't have a free tier as such so you may want to consider your long term usage of it based on the cost and other tools you want to invest in.

In this lecture, you’ll learn how to use Balsamiq’s AI features to quickly generate clean, low-fidelity wireframes. We’ll explore how to turn simple ideas or prompts into structured layouts, refine AI-generated results, and keep your wireframes clear, consistent, and easy to understand. By the end of this session, you’ll know how to combine AI assistance with Balsamiq’s core tools to speed up your wireframing process without losing clarity or control.

Miro is a fully featured digital white boarding tool and I LOVE it. In fact I have two whole other courses on it. This lecture is a short overview of navigating Miro and some of is main features so that you get a good feel on how to use it before we move on to UI and UX concepts

As with the other tools we've looked at, it can be frustrating purchasing a course and using a tool only to find that the features you thought were free aren't and stuck behind a paywall. In this lecture we get an overview of the subscription tier as well as Add ons and AI credits

In this lecture we walkthrough wire framing templates available in MIRO as well as how to edit, update and finesse your Wireframe in record time.

Miro has great AI driven prototyping features via this add on. In this lecture we explore prompts to create effective and interactive prototypes and how to manipulate them to reflect just what you need.

Uizard is a pretty reasonable tool for what you get. Let's dig into the proving structure, its free tier and the limitations it has.

Over this lecture get an overview of Uizards key features and functionality

In this lecture, you’ll learn how to effectively prompt Uizard’s AI to generate high-quality mockups. We’ll cover how to structure prompts, describe layouts and components clearly, and guide the AI toward usable, realistic design outputs. You’ll also see how to iterate on AI-generated mockups and refine them into designs that better match your product vision.

In this lecture, you’ll learn how to use an AI agent to review your UI designs using heat maps. We’ll explore how AI can predict user attention, highlight high- and low-engagement areas, and surface potential usability issues before real users ever interact with your design. You’ll see how to interpret heat map insights and apply them to improve layout, hierarchy, and overall user experience. By the end of this session, you’ll understand how AI-driven feedback can help you make more informed design decisions, faster.

In this lecture, you’ll learn how to switch from mockups to wireframes in Uizard in seconds and understand when and why to use each approach. We’ll walk through the process of changing design modes, simplifying visual detail, and refocusing on structure, layout, and user flow.

In this lecture, you’ll learn how to convert hand-drawn sketches and low-fidelity wireframes into digital mockups using the Wireframe Scanner. We’ll explore how the scanner interprets layouts and components, what makes a sketch work well with AI, and how to refine the generated mockups once they’re created. By the end of this session, you’ll understand how to quickly move from paper or rough concepts to editable, high-fidelity mockups—saving time and accelerating your design workflow

In this lecture, you’ll learn how to convert an existing screenshot into a working, editable mockup using AI-powered tools. We’ll walk through how the conversion process works, what types of screenshots produce the best results, and how to refine layouts, components, and styles after import. By the end of this session, you’ll know how to quickly recreate and iterate on existing interfaces—whether for redesigns, inspiration, or rapid prototyping.

In this lecture, you’ll learn how to create interactive prototypes in Uizard. We’ll cover how to link screens, define user flows, and add basic interactions to bring your designs to life. You’ll also see how to test and iterate on your prototype to validate ideas and gather early feedback. By the end of this session, you’ll be able to build functional prototypes in Uizard that clearly communicate your design intent and user experience.

In this lecture, you’ll get an overview of Figma and how it’s used in modern UI and UX design workflows. We’ll explore the interface, key tools, and core concepts you need to understand before designing screens and components. You’ll also see how Figma fits into the wider design process, from early concepts through to collaboration and handoff. By the end of this session, you’ll have a solid foundation for working confidently in Figma in the lectures that follow.

Let dive into the pricing stricture for Figma

In this lecture, you’ll learn how to get started with Figma Make to create interactive UI/UX prototypes. We’ll walk through the basic tools, interface, and workflows needed to turn your designs into clickable prototypes.

In this lecture, you’ll learn how to turn your Figma mockups into fully interactive prototypes. We’ll cover how to link screens, define user flows, and simulate real interactions so your designs feel like a working app or website.