One & Only Mobile App UI/UX Design Masterclass with Figma from Udemy

Welcome to my course. This course will be all about the Figma. Figma is one of the most complete, collaborative and community-driven design softwares out there. With Figma you can do all different sorts of things, from UI/UX Design, Graphic Design, Wireframing, Brainstorming to Prototyping and Creating your own Design Systems, all of that, in an easy and collaborative way with other people.

To be honest, this course has a lot to offer. We are going to start by introducing with some of most important features in Figma. Then after that I'm going to show you in practice how to work with all of the tools that are available in Figma. How to apply them in a real-world projects.

And only after that, after you're comfortable enough, then we are going to start working on our own project design from scratch. That project will be a Mobile application, or a game, called Tic-Tac-Toe.

That project will have around 70-80 different screen designs, including a design for both light and a dark theme. You will learn how to make your own Design System, how to create unique and reusable custom UI components, and more.

After we complete all of that, at the end, like a cherry on top of the cake, we are going to create a real prototype application out of that same design. You will learn how to give a life to your design, by creating an interactive animations. We are going to build a real application flow, for all those 80 different screens.

I could go on with this a lot more, but why waste your time. Enroll in this course and let's get started.

What's inside

Syllabus

Introduction

Desktop vs Browser Version

Download and Install Figma

Figma Interface Overview

Traffic lights

Read about what's good

what should give you pause

and possible dealbreakers

Uses Figma, a leading design software known for its collaborative features, making it suitable for team-based UI/UX projects

Covers design systems and reusable UI components, which are essential for maintaining consistency and efficiency in large-scale projects

Includes a hands-on project designing a Tic-Tac-Toe mobile application with around 70-80 screens, providing practical experience

Explores prototyping with interactive animations, enabling designers to create realistic and engaging user experiences

Features sections on collaboration tools within Figma, such as Spotlight, Cursor Chat, and Comments, which are useful for remote teams

Requires learners to download and install Figma, which may pose a barrier to those who prefer browser-based tools or have limited storage space

Reviews summary

Comprehensive figma ui/ux design masterclass

According to learners, this course offers a positive and comprehensive introduction to Figma, covering its core tools and features extensively. Many found the real-world project of designing a mobile app to be practical and highly valuable for applying concepts learned. Students appreciate the instructor's teaching style, often describing it as clear and easy to follow, making complex topics accessible even for absolute beginners. However, some recent reviews mention that certain parts might feel slightly outdated due to Figma updates, and a few learners desired more depth on specific advanced topics or challenges in the `Tic-Tac-Toe` project, suggesting it can be quite `challenging` at times. The coverage of `Prototyping` and `Design Systems` is generally seen as a significant `strength`. Overall, it's considered a `strong foundation` course.

Project can be challenging for some learners.

"The Tic Tac Toe project is quite complex and required a lot of effort."

"While valuable, the project felt a bit overwhelming at times."

"Needed to replay some project videos multiple times to keep up."

"The project pushed my skills, which was good but also challenging."

Strong sections on design systems and prototyping.

"The section on Design Systems was particularly useful and well-explained."

"I loved learning how to build a real prototype at the end."

"Creating interactive animations was a great addition to the course."

"Understanding Design Systems has been a game changer for my workflow."

Highly recommended for those starting out in UI/UX.

"As a complete beginner, this course was perfect for me."

"Definitely a great starting point for anyone new to UI/UX design."

"I had no prior experience, and this course guided me well."

"If you're a beginner looking for a solid start, take this course."

Instructor is clear, engaging, and easy to follow.

"The instructor is amazing, very clear explanations and easy to understand."

"Fantastic instructor, makes learning Figma enjoyable."

"His teaching style is very engaging and helps you grasp the concepts easily."

"I really appreciate the way the instructor breaks down complex ideas."

Provides a thorough grounding in Figma basics.

"This course gives a very good introduction about Figma."

"Perfect for beginners who want to learn the basics of Figma quickly."

"I really liked how the course went through all the basic tools and features step by step."

"It was a good overview of the Figma interface and essential functions."

Practical project applying skills to a mobile app.

"The Tic Tac Toe project was a great way to apply everything we learned."

"Designing the whole mobile app from scratch felt like a real job."

"I found the project part incredibly helpful for solidifying my understanding."

"Building the project was the highlight, very hands-on and useful."

Some content feels outdated due to Figma updates.

"Some parts of the course seem a bit outdated with the latest Figma features."

"It would be great if the course could be updated to reflect recent Figma changes."

"Found a few discrepancies with the current Figma interface and features."

"An update would make this excellent course even better."

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 One & Only Mobile App UI/UX Design Masterclass with Figma with these activities:

Review vector graphics fundamentals

Show steps

Strengthen your understanding of vector graphics principles to better utilize Figma's vector editing capabilities.

Browse courses on Vector Graphics

Show steps

Watch tutorials on vector paths and shapes.
Practice creating simple vector illustrations.
Experiment with different vector editing tools.

Brush up on UI/UX design principles

Show steps

Revisit core UI/UX concepts to enhance your ability to create effective and user-friendly mobile app designs in Figma.

Browse courses on UI/UX Design

Show steps

Review articles and videos on UI/UX best practices.
Analyze existing mobile app designs for usability.
Take a short online quiz on UI/UX fundamentals.

Read 'Refactoring UI'

Show steps

Learn practical UI design techniques to improve the visual quality of your Figma projects.

View Melania on Amazon

Show steps

Read a chapter of 'Refactoring UI'.
Apply the techniques to a sample Figma design.
Share your refactored design with peers for feedback.

Four other activities

Expand to see all activities and additional details

Show all seven activities

Recreate UI components from popular apps

Show steps

Sharpen your Figma skills by replicating existing UI elements, focusing on constraints, auto layout, and component properties.

Show steps

Choose a UI component from a popular app.
Recreate the component in Figma using Auto Layout and Constraints.
Compare your version to the original and refine.

Read 'Don't Make Me Think, Revisited'

Show steps

Learn about usability principles to create intuitive and user-friendly mobile app designs.

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

Show steps

Read a chapter of 'Don't Make Me Think'.
Identify usability issues in an existing app.
Propose solutions to improve the app's usability.

Design a UI kit for a specific niche

Show steps

Apply your Figma knowledge to create a reusable UI kit, reinforcing your understanding of components, styles, and design systems.

Show steps

Choose a specific niche (e.g., e-commerce, travel).
Design a set of reusable UI components for that niche.
Document your UI kit and share it with the community.

Write a blog post about Figma tips and tricks

Show steps

Solidify your understanding of Figma by sharing your knowledge and insights with others.

Show steps

Choose a specific Figma topic (e.g., Auto Layout, Components).
Write a blog post explaining the topic and providing examples.
Publish your blog post on a platform like Medium or your own website.

Career center

Learners who complete One & Only Mobile App UI/UX Design Masterclass with Figma will develop knowledge and skills that may be useful to these careers:

Figma Designer

A Figma Designer is a user-interface designer that uses Figma in particular. The course focuses heavily on Figma. It will help you master its features, from UI/UX design to prototyping and design systems. The course is structured to teach you how to work with Figma's tools, and how to apply them within real-world projects. The Tic-Tac-Toe game project, complete with light and dark themes, gives you experience with design systems and reusable UI components. With Figma, you can apply everything you learned with this course, when you are a Figma Designer.

See salaries and explore the career path for Figma Designer

User Interface Designer

As a User Interface Designer, you will focus on the visual elements users interact with. This course, which centers on Figma, will help you become fluent with one of the leading platforms for UI design. The course spends time introducing key features in Figma, and then guides you through applying tools to a real-world project. Specifically, learning how to design components, work with colors, and leverage the prototyping capabilities within Figma will be invaluable in crafting intuitive and engaging user interfaces. The Tic-Tac-Toe game project, complete with light and dark themes, gives you experience with design systems and reusable UI components, skills essential for any UI Designer.

See salaries and explore the career path for User Interface Designer

Mobile Application Designer

A Mobile Application Designer specializes in crafting the look and feel of mobile applications. This course is directly relevant, as the final project involves designing a complete mobile application using Figma. The course will help you learn how to create custom User Interface components, design for both light and dark themes, and prototype interactive animations. Understanding the nuances of mobile UI and UX, which the course provides, is essential for any Mobile Application Designer. Moreover, the prototyping segment will be helpful in understanding app flow.

See salaries and explore the career path for Mobile Application Designer

User Experience Designer

The role of a User Experience Designer involves understanding user needs and designing interfaces that are both functional and enjoyable. This course, with its emphasis on Figma, provides a strong foundation for UX design. You will learn how to create interactive prototypes and animations, which are crucial for testing and refining user flows. The focus on collaboration within Figma also mirrors the collaborative nature of UX design. By designing an entire mobile application, you will gain holistic experience in understanding the many screens and user interactions that define user experience. Such experience is crucial for a User Experience Designer.

See salaries and explore the career path for User Experience Designer

Interaction Designer

An Interaction Designer focuses on the points of interaction between a user and a digital product. This course will help you develop your skills in creating interactive prototypes and animations using Figma. By the conclusion of the course, you will have designed a complete mobile application, including interactive elements, and will have hands-on experience creating prototypes for around eighty different screens. The course will also deepen your practical understanding of user flows and interaction, things that will be particularly valued when you are an Interaction Designer.

See salaries and explore the career path for Interaction Designer

Prototyper

A Prototyper specializes in developing prototypes of digital products. This course, with its substantial focus on Figma's prototyping capabilities, is highly relevant to this role. You'll learn how to create interactive animations and build real application flows. The course will help you prototype a mobile application with around eighty different screens. Since prototyping is at the heart of the role of a Prototyper, this course may be particularly helpful.

See salaries and explore the career path for Prototyper

Design Systems Manager

A Design Systems Manager oversees the creation, maintenance, and implementation of design systems within an organization. This course is valuable as it includes a module on creating design systems using Figma. You will learn how to create reusable User Interface components, manage color and text styles, and ensure consistency across designs. Mastering these skills within Figma will better equip you to manage design systems effectively. The Tic-Tac-Toe project will show you how to apply those principles. Any Design Systems Manager should be familiar with this.

See salaries and explore the career path for Design Systems Manager

Product Designer

A Product Designer is involved in the entire product development lifecycle, from ideation to launch. This course is relevant. It covers UI/UX design principles, prototyping, and design systems, all essential aspects of product design. Hands-on experience creating a complete mobile application will give you a holistic perspective on product design. Familiarity with Figma is also increasingly expected of Product Designers. Thus, this course could be very useful.

See salaries and explore the career path for Product Designer

Web Designer

A Web Designer is responsible for the visual design and layout of websites. This course may be useful to you, as it will help you gain proficiency in Figma, a tool increasingly used for web design prototyping and UI design. The course teaches core design principles through the context of a mobile application but many of these principles can be applied to any website design. The design system module included in this course will be particularly applicable to Web Designers.

See salaries and explore the career path for Web Designer

UI/UX Engineer

A UI/UX Engineer bridges the gap between design and development. This course will help you understand the design process. It will also give you proficiency in Figma, enabling you to collaborate effectively with designers and implement their designs accurately. The course's focus on design systems and component creation will be invaluable. Furthermore, the prototyping segment is useful. This course may be particularly beneficial.

See salaries and explore the career path for UI/UX Engineer

Design Director

A Design Director leads and manages a team of designers, setting the overall design vision for a project or company. This course will help you maintain hands-on skills with current design tools and methodologies. By learning Figma, you can better guide your team. The design systems and component creation modules are also relevant. Having a practical understanding of how to design is essential for a Design Director.

See salaries and explore the career path for Design Director

Graphic Designer

A Graphic Designer creates visual concepts to communicate information. This course may be useful to Graphic Designers. It introduces Figma, a versatile tool used for various design tasks, including graphic design. You'll learn about image manipulation with Figma. While the project revolves around mobile UI/UX, the foundational design principles taught can be applied to graphic design projects, and will provide a strong boost in skills that any Graphic Designer needs.

See salaries and explore the career path for Graphic Designer

Accessibility Specialist

An Accessibility Specialist ensures digital products are usable by people with disabilities. This course may be useful, as it will introduce Figma, a tool that supports accessible design practices. You can leverage Figma's features to create designs that adhere to accessibility guidelines. You can also learn to design inclusive UI components. While the course doesn't explicitly focus on accessibility, the design and prototyping skills acquired can be applied to create more accessible user experiences. Being adept in Figma will be helpful to an Accessibility Specialist.

See salaries and explore the career path for Accessibility Specialist

Digital Strategist

A Digital Strategist develops and implements digital strategies to achieve business goals. This course may be useful, as it provides insights into the UI/UX design process and the importance of user-centered design. While not directly related to strategy, understanding the design process informs strategic decisions. This course introduces Figma, too. Familiarizing yourself with Figma, and design thinking, will be valuable.

See salaries and explore the career path for Digital Strategist

Creative Director

A Creative Director oversees the creative output of a team, ensuring that designs align with the brand's vision and strategy. This course may be useful, as it provides a deep dive into UI/UX design and prototyping using Figma. Gaining proficiency in Figma will enable you to be a more effective leader for your team. In addition, the design systems and component creation modules are also relevant. Understanding how to apply Figma is essential for a Creative Director.

See salaries and explore the career path for Creative Director

One & Only Mobile App UI/UX Design Masterclass with Figma

What's inside

Syllabus

Traffic lights

Save this course

Reviews summary

Comprehensive figma ui/ux design masterclass

Activities

Career center

Reading list

Share

Similar courses