Faysal AzizAI-Assisted UI/UX Design Workflow
A guided Figma prototype from product brief to design review
Explore AI-assisted product design and create a small Figma prototype, distinguishing generated design hypotheses from real user evidence.
Why this course
This beginner-friendly one-day workshop follows a small digital-product design example from discovery through wireframes, interface content, prototyping and handoff. Generative AI supports brainstorming, organisation and critique while participants make and review the design decisions.
The practical output is a limited set of screens and a short interaction flow, not a complete production application or comprehensive design system. Figma and selected conversational or source-grounded AI tools support the exercises. Free plans may be used where their current limits permit; AI features, collaboration and advanced handoff capabilities are plan-dependent. AI-generated personas and reviews are working hypotheses, not substitutes for research with users.
Learning outcomes
The course teaches participants to:
- Draft a product brief, user scenarios and prioritised requirements with AI assistance.
- Distinguish evidence-based UX research from generated persona and journey hypotheses.
- Organise a simple navigation structure, screen map and task flow.
- Create selected wireframes and interface components in Figma.
- Draft and review interface text and choose suitable visual assets.
- Build a short interactive prototype, identify design issues and prepare basic handoff notes.
Prerequisites
- Basic computer skills and familiarity with websites or mobile applications.
- No previous UI/UX experience is required.
- A modern browser, internet access and a Figma account.
- Access to a selected tool such as ChatGPT or Gemini; a source-grounded notebook tool can support document exercises.
- Account and feature availability should be checked before class; advanced paid features are not required for the core exercise.
6 modules
01Module 1 — AI-Assisted Discovery and Research5 topics
- AI as a design assistant: uses, limitations, responsible data handling and human judgement.
- Define an illustrative product problem, stakeholders, goals and a concise product brief.
- Brainstorm features and prioritise requirements.
- Use competitor information with source checking; draft persona, empathy-map, user-story and journey hypotheses.
- Identify which assumptions require actual user research.
02Module 2 — Information Architecture and Wireframes4 topics
- Organise content, navigation, screen maps, user flows and task flows.
- Set up a Figma file and sketch selected low-fidelity screens.
- Plan layouts and introduce Auto Layout.
- Iterate wireframes using AI suggestions without treating the suggestions as validated user preferences.
03Module 3 — Interface Fundamentals and Reusable Elements4 topics
- Typography, colour systems, layout grids and visual consistency.
- Create a small reusable component set.
- Introduce variants, variables and responsive-design considerations as demonstrations appropriate to the available plan.
- Discuss the difference between a small component exercise and a maintained design system.
04Module 4 — UX Writing and Visual Assets5 topics
- Draft labels, form text, errors, empty states, help text and illustrative marketing copy.
- Review clarity, consistency and factual claims in generated content.
- Compare illustration, background-removal and image-enhancement tools where available.
- Select fonts, icons and placeholder imagery from resources such as Google Fonts, Material icons, Heroicons, Unsplash or Pexels.
- Check licences, attribution requirements and optimisation before using assets; demonstrate a selected image tool rather than assuming every feature is free.
05Module 5 — Prototype and Design Review5 topics
- Connect selected screens into a short interaction flow and introduce simple transitions.
- Share and present the prototype with appropriate permissions.
- Use AI for heuristic critique and prioritise suggested improvements.
- Review basic accessibility considerations alongside manual checks; an AI review does not establish accessibility conformance.
- Separate design critique from usability testing with representative users.
06Module 6 — Guided Capstone and Handoff4 topics
- Refine the selected screens, reusable elements and interaction flow from the workshop example.
- Organise the design file, export assets and write basic specifications or handoff notes without assuming paid Dev Mode access.
- Present the prototype, explain remaining assumptions and identify research or development work still needed.
- Recap reusable prompting, verification, confidentiality and design-consistency practices.
A programme built around your team.
Share your training goals and requirements.