Master Figma in 2025: Web & Mobile App Design from Scratch from Udemy

Take your web & mobile app design skills to the next level with this hands-on course. Whether you're just starting or looking to become an AI-enabled expert in UI/UX Design with Figma, this course will guide you step-by-step through designing stunning, professional User Experiences (UX), User Interfaces (UI), and prototypes using Figma.

What You’ll Gain by the end of this course:

Master Figma Basics and Beyond: Learn Figma's essential tools and features, from creating shapes and frames to advanced responsive design techniques.
Design Real-World Projects: Build a complete web app mockup interface for a travel booking app, gaining experience with a practical project.
Become an AI Designer: In a world where AI is only growing, learn how to take advantage of the many AI tools both inside of Figma and outside to become a faster AI-enabled designer.
Create Interactive Prototypes: Turn mockups into advanced clickable prototypes with animations, overlays, and device testing.
Boost Efficiency with Figma’s Tools: Master Auto-Layout, reusable components, variables, and plugins to create dynamic, scalable designs faster.
Collaborate Like a Pro: Discover how to work live with teams, share projects, and export assets seamlessly.
Enhance Your Portfolio: Develop polished, real-world projects to showcase to potential clients or employers.

About the Project:

In this course, you'll be working hands-on in Figma designing a travel booking app for the web and mobile. We'll start from scratch by learning how to read a product requirement document. We'll then go from wireframing to putting together a design system, before diving deep into designing mockups and building realistic prototypes we can share with the world, on our portfolios, and with friends.

About the Instructor:

With over 14 years of design experience, entrepreneur and designer Nima Tahami brings you expert insights and real-world knowledge. Nima has sold startups, had his work featured in Forbes, taught over 15,000 students, and his open-source tools have helped hundreds of thousands of developers worldwide.

Start designing your future today – enroll now and take your skills to the next level.

What's inside

Learning objectives

Figma basics (including the new ui3)
Designing full mobile & web mockups (ui design)
Using figma ai features to speed up the design process
Crafting great experiences (ux design)
Building advanced prototypes to share with the world

Using ai to generate first drafts, images, translate text, and more!
Creating easy-to-tweak designs using re-usable components and styles
Using variables to create scalable and flexible designs and advanced prototypes
Choosing color schemes and typography
Gain a portfolio-ready mobile & web app project

Figma basics (including the new ui3)
Designing full mobile & web mockups (ui design)
Using figma ai features to speed up the design process
Crafting great experiences (ux design)
Building advanced prototypes to share with the world
Using ai to generate first drafts, images, translate text, and more!
Creating easy-to-tweak designs using re-usable components and styles
Using variables to create scalable and flexible designs and advanced prototypes
Choosing color schemes and typography
Gain a portfolio-ready mobile & web app project

Syllabus

Introduction

We'll learn how to set up a Figma account and cover the basics of how to navigate and work with it.

Getting Started

File Layout

Traffic lights

Read about what's good

what should give you pause

and possible dealbreakers

Covers Figma basics and beyond, which is essential for beginners looking to build a strong foundation in UI/UX design

Teaches how to design a travel booking app, providing hands-on experience with a practical, real-world project

Explores the use of AI tools within Figma, which is increasingly important for modern designers looking to enhance their workflow

Develops skills in creating interactive prototypes with animations and overlays, which are crucial for showcasing design concepts

Emphasizes the use of reusable components and styles, which are essential for creating scalable and flexible designs

Focuses on responsive design with variables and constraints, which is necessary for creating mobile-friendly applications

Reviews summary

Mastering figma for app design

According to learners, this course offers a solid foundation in Figma for web and mobile app design, particularly praised for its clear, step-by-step instruction. Students highlight the practical, real-world project (designing a travel app) as highly beneficial for applying concepts and building a portfolio. The inclusion of AI tools and features is frequently mentioned as a unique and valuable addition. While many find the pace suitable for beginners, some intermediate users note it might be too basic in parts. The prototyping section and topics like Auto Layout and components are generally well-received.

Great for beginners, potentially basic for others.

"As a complete beginner, the pace was just right for me."

"Some parts felt a bit slow if you already have basic Figma knowledge."

"Wish there was more depth on advanced prototyping or complex component structures."

"It's a solid intro, but intermediate users might find themselves skimming sections."

AI tools are useful and relevant additions.

"The sections on using AI with Figma were surprisingly useful and modern."

"Loved learning about using AI for generating ideas and content within Figma."

"Incorporating AI into the workflow feels very current and forward-thinking."

"The AI tips are a game-changer for speeding up the design process."

Covers core Figma tools effectively.

"Learned so much about Auto Layout, components, and variables."

"The coverage of core Figma features like prototyping was excellent."

"The course does a great job of explaining essential tools needed for professional design."

"Mastered the fundamentals needed to build responsive designs."

Real-world project enhances learning and portfolio.

"Working on the travel app project from start to finish was incredibly helpful."

"This project gave me the confidence to tackle my own design ideas."

"Having a completed project for my portfolio right out of the course is a huge plus."

"The hands-on project approach really solidified my understanding of the workflow."

Instructor provides easy-to-follow guidance.

"The instructor's explanations are very clear and easy to follow, especially for someone starting out."

"I really appreciate the step-by-step approach. It made learning Figma less intimidating."

"Every lesson builds logically on the last. The clarity of the instructor is fantastic."

"The instructions were very clear throughout the course, making complex topics understandable."

Activities

Be better prepared before your course. Deepen your understanding during and after it. Supplement your coursework and achieve mastery of the topics covered in Master Figma in 2025: Web & Mobile App Design from Scratch with these activities:

Review Auto Layout Fundamentals

Show steps

Reinforce your understanding of Auto Layout in Figma to prepare for more advanced responsive design techniques covered in the course.

Browse courses on Auto Layout

Show steps

Review Figma's official documentation on Auto Layout.
Practice creating simple layouts using Auto Layout.
Experiment with different Auto Layout properties.

Read 'Refactoring UI' by Adam Wathan and Steve Schoger

Show steps

Improve your understanding of UI design principles to create more visually appealing and effective interfaces in Figma.

View Melania on Amazon

Show steps

Read the book and take notes on key concepts.
Apply the principles learned to your Figma projects.

Recreate existing UI designs

Show steps

Sharpen your Figma skills by replicating existing UI designs from popular apps or websites.

Show steps

Find examples of UI designs you admire.
Attempt to recreate them in Figma, paying attention to detail.
Compare your recreation to the original and identify areas for improvement.

Four other activities

Expand to see all activities and additional details

Show all seven activities

Document your design process

Show steps

Solidify your understanding of Figma by documenting your design process for a small project.

Show steps

Choose a small design project, such as a landing page or a mobile app screen.
Document each step of your design process, from wireframing to prototyping.
Share your documentation with others and solicit feedback.

Design a UI kit

Show steps

Deepen your understanding of components and styles by creating a UI kit for a specific design system.

Show steps

Choose a design system, such as Material Design or iOS.
Identify the key components and styles used in that design system.
Create those components and styles in Figma, paying attention to detail.

Read 'Don't Make Me Think' by Steve Krug

Show steps

Improve your understanding of UX principles to create more user-friendly designs in Figma.

View Don't Make Me Think, Revisited: A Common Sense... on Amazon

Show steps

Read the book and take notes on key concepts.
Apply the principles learned to your Figma projects.

Build a portfolio website

Show steps

Showcase your Figma skills by designing and building a portfolio website to display your projects.

Show steps

Plan the structure and content of your portfolio website.
Design the website in Figma, paying attention to visual appeal and usability.
Develop the website using HTML, CSS, and JavaScript, or a website builder.

Career center

Learners who complete Master Figma in 2025: Web & Mobile App Design from Scratch will develop knowledge and skills that may be useful to these careers:

Prototyper

A protytper specializes in building interactive prototypes to test and validate design concepts. This course helps learn how to build advanced prototypes in Figma, covering user flows, animations, overlays, and component interactivity. The course's emphasis on variables, conditional logic, and smart animate directly translates to creating realistic and functional prototypes. By enabling you to make advanced prototypes, the course helps equip you with the skills that you need to become a Prototyper.

See salaries and explore the career path for Prototyper

User Interface Designer

A user interface designer crafts the visual elements people interact with on websites and applications. They focus on creating intuitive, aesthetically pleasing interfaces. This course helps build a strong foundation in Figma, a leading UI design tool, enabling aspiring user interface designers to create compelling designs and prototypes. The course's emphasis on responsive design with variables directly translates to creating adaptable interfaces across different devices. Learning to use Auto Layout, components, and variants in Figma allows designers to rapidly iterate and maintain consistency, crucial for efficient UI design workflows. This course's focus on web and mobile design using Figma makes it perfect for learning to become a User Interface Designer.

See salaries and explore the career path for User Interface Designer

Design Systems Manager

A design systems manager oversees the creation, maintenance, and implementation of a design system, ensuring consistency and scalability across products. This course helps learn how to create and manage reusable components and styles in Figma, a core aspect of design systems. The course's emphasis on variables, component variants, and team libraries directly translates to creating scalable and maintainable design systems. The course equips one with the skills to manage design systems effectively. Aspiring Design Systems Managers should find this course very valuable.

See salaries and explore the career path for Design Systems Manager

Freelance Designer

A freelance designer works independently, providing design services to clients on a project basis. They handle various design tasks, from branding to web design. This course helps learn how to use Figma to create professional designs and prototypes. The course's emphasis on real-world projects and portfolio development directly translates to building a successful freelance design career. Learning to use Figma efficiently and collaborate effectively with clients is vital for freelance designers. Aspiring Freelance Designers should find this course very valuable.

See salaries and explore the career path for Freelance Designer

User Experience Designer

A user experience designer focuses on the overall feel and usability of a product, ensuring it meets user needs effectively. They conduct research, create user flows, and design interactions. This course helps aspiring user experience designers learn to build interactive prototypes in Figma, a key skill for testing and refining user experiences. The course's focus on crafting great experiences and building advanced prototypes is directly applicable to UX design. Furthermore, this course's project based approach helps one learn how to translate product requirements into wireframes and mockups, essential for a user experience designer.

See salaries and explore the career path for User Experience Designer

AI Design Specialist

An artificial intelligence design specialist focuses on leveraging AI tools to enhance the design process, creating more efficient and innovative solutions. This course explicitly addresses the integration of artificial intelligence in Figma, helping one become a faster AI enabled designer. The course's emphasis on using artificial intelligence to generate first drafts, images, translate text, and more directly aligns with the responsibilities of an artificial intelligence Design Specialist. Students in this role may find this course very useful.

See salaries and explore the career path for AI Design Specialist

Mobile App Designer

A mobile app designer specializes in creating user-friendly and visually appealing interfaces for mobile applications. They consider the unique constraints and opportunities of mobile platforms. This course helps learn the fundamentals of mobile app design using Figma. The course's hands-on project involves designing a travel booking app for both web and mobile, providing direct experience in mobile app design. Learning about responsive design and creating interactive prototypes ensures the app provides a seamless user experience on mobile devices. Also the course may equip one with skills to create stunning designs for mobile applications, including prototyping skills needed to become a Mobile App Designer.

See salaries and explore the career path for Mobile App Designer

Interaction Designer

An interaction designer focuses on how users interact with a product, crafting intuitive and engaging experiences. This course helps learn how to create interactive prototypes using Figma, a critical skill for interaction designers. The course's emphasis on animations, overlays, and component interactivity directly translates to creating dynamic and engaging user interfaces. Furthermore, the course's focus on user flows and conditional logic helps interaction designers design seamless and intuitive interactions. The course may equip one with skills to create advanced prototypes and design intuitive user interactions needed to become an Interaction Designer.

See salaries and explore the career path for Interaction Designer

Web Designer

A web designer plans and creates the look and feel of websites. They focus on visual appeal, usability, and functionality. This course helps learn the principles of web design using Figma, a popular tool for creating website mockups and prototypes. The course's hands-on project which involves designing a web app mockup interface provides practical experience in web design. Furthermore, learning about responsive design and creating reusable components allows web designers to create scalable and maintainable websites. This course may be useful in learning to become a Web Designer.

See salaries and explore the career path for Web Designer

Visual Designer

A visual designer focuses on the aesthetic aspects of a product, ensuring it is visually appealing and aligned with the brand. They create designs that are both beautiful and functional. This course helps learn how to use Figma to create visually stunning designs. The course's emphasis on choosing color schemes, typography, and using images effectively allows visual designers to create compelling visual experiences. The course may equip one with skills to create visually appealing and brand-consistent designs needed to become a Visual Designer.

See salaries and explore the career path for Visual Designer

Product Designer

A product designer is involved in the end-to-end design process of a product, from initial concept to final implementation, ensuring it meets user needs and business goals. This course helps learn how to use Figma to design and prototype products. The course's hands-on project, which involves designing a travel booking app, provides practical experience in product design. The course teaches about wireframing, design systems, and interactive prototypes, all essential skills for a product designer. The course may equip one with the skills and knowledge to design and launch successful products needed to become a Product Designer.

See salaries and explore the career path for Product Designer

UX Researcher

A UX Researcher conducts user research to understand user behaviors, needs, and motivations, informing design decisions and improving user experiences. While this role often involves qualitative and quantitative research methods, understanding design tools like Figma can facilitate collaboration with designers and the communication of research findings through prototypes. This course helps learn how to use Figma to create prototypes that can be used for user testing and feedback. The course helps gain a deeper understanding of the design process, improving collaboration with design teams. Although not a primary skill, understanding design tools like Figma can enhance a UX Researcher's ability to contribute to the design process, and this course may prove useful.

See salaries and explore the career path for UX Researcher

Accessibility Specialist

An accessibility specialist ensures that digital products are usable by people with disabilities, adhering to accessibility standards and guidelines. While this course doesn't explicitly focus on accessibility, understanding design principles and tools like figma facilitates the creation of accessible designs. The course helps learn how to use Figma to create designs that can be easily adapted for accessibility. The course helps gain a deeper understanding of visual design, leading to more accessible user interfaces. Although not a primary skill, knowledge of figma can improve the accessibility of digital products, making the course generally useful.

See salaries and explore the career path for Accessibility Specialist

Front-End Developer

A front end developer translates designs into code, building the user interface of websites and applications. While coding is the primary skill, understanding design principles and tools like Figma facilitates better collaboration with designers. This course helps understand design specifications and requirements more effectively by familiarizing with Figma. The course helps gain a deeper understanding of design systems and components, leading to more efficient front end development. Although primarily focused on design, knowledge of Figma can improve communication and collaboration between front end developers and designers, and this course may still prove useful.

See salaries and explore the career path for Front-End Developer

User Advocate

A user advocate champions the needs and perspectives of users throughout the product development process, ensuring that their voices are heard and considered. While this role doesn't directly involve design tools, understanding design principles and processes enhances the ability to advocate for user-centered design. This course helps learn how to create and interpret prototypes, facilitating better communication with designers and stakeholders. The course helps gain a deeper understanding of the design process, leading to more effective user advocacy. Although not a primary skill, knowledge of figma can improve the effectiveness of user advocacy efforts, and this course may be useful.

See salaries and explore the career path for User Advocate

Master Figma in 2025

Web & Mobile App Design from Scratch

What's inside

Learning objectives

Syllabus

Traffic lights

Save this course

Reviews summary

Mastering figma for app design

Activities

Career center

Reading list

Share

Similar courses