UI/UX Complete Figma Course 2026 – Design Web & Mobile Projects from Scratch Part 1
Master UI/UX Design with Figma by Creating Professional Web and Mobile App Designs from Scratch—No Prior Experience Required.
About This Course
You'll learn how to transform ideas into beautiful, functional digital products by conducting user research, creating wireframes, designing high-fidelity interfaces, building interactive prototypes, and collaborating effectively with development teams.
Throughout the course, you'll work on real-world projects, including websites, dashboards, mobile applications, landing pages, and e-commerce interfaces. You'll also learn modern design trends, accessibility standards, responsive design principles, and best practices used by leading technology companies.
By the end of this course, you'll have a polished portfolio of UI/UX projects and the confidence to design user-centered digital experiences for clients, startups, or your own products.
Who This Course Is For
Complete beginners interested in UI/UX design.
Graphic designers transitioning into product design.
Web designers and front-end developers.
Entrepreneurs designing their own products.
Freelancers looking to offer UI/UX services.
Product managers and startup founders.
Students pursuing careers in design.
Anyone who wants to master Figma and create modern digital experiences.
What You'll Learn
Requirements
- →Course Requirements
- →No previous UI/UX design experience required.
- →Basic computer skills.
- →A laptop or desktop computer.
- →Internet connection.
- →A free or paid Figma account.
- →Passion for creativity, problem-solving, and design.
Course Curriculum
1. Introduction to the Course.
1.1 Download+Figma+Course+Checklist.xlsx
2. Software Usage.
3. How Websites Work.
4. Box Elements.
5. Website Sections.
6. Modern Trends.
7. Main Screen.
8. Community Tab.
9. Creating the First Project.
10. Explore first Canvas.
11. Basic Shapes.
12. Properties of Object.
13. Useful Shortcuts.
14. Frames and Groups.
15. Typography.
16. Playing with Pictures.
17. SVG files.
18. Exercise 1.
19. What is the Auto Layout.
20. Auto Layout Tools.
21. Creating the First Component.
22. Exercise 2.
22.1 x.svg
22.2 Exercises.fig
23. Exercise 3.
23.1 x2.svg
23.2 Exercises.fig
24. Examples of Real Projects.
25. Moodboard.
26. Colors Psychology and Usage.mp4
27. Choosing Typeface.
34. What is a Design System.
35. 4pt Grid System.
36. How to Import Your Icon Design System
37. First Element.
38. Setting up the First Frame.
39. What is Navigation Panel.
39.1 Home.zip
40. Creating Hero Section.
40.1 Home.zip
41. First Page.
41.1 Home.zip
42. Creating Web View.
42.1 Apps.zip
42.2 Blog.zip
42.3 Product.zip
43. Creating Mobile View.
28. Visual Workspace.
29. Exploring the Space.
30. Developing First Sections.mp4
31. Web View
32. Mobile View.
33. Exporting the Wireframes.
44. How to Create Advanced Prototypes With ProtoPie and Figma.
44.1 Download+Figma+file.fig
45. Project Prototyping.
46. Finishing Touches.mp4
46.1 FinalProjectFile.fig
46.2 Additional+Project+Example.fig
47. Sending a Project to a Client
48. How to do Reviews with a Client.
49. Creating the project.
50. Design system.
51. Wireframes - Part 1
52. Wireframes - Part 2.
53. Wireframes flow
54. Final Design - Part 1
55. Final Design - Part 2.
56. Final Design - Part 3
57. Final Design - Part 4
58. Prototype & Animations.
Jude Aforke
SIR-J
Video Editor