Figma Ultimate Mega Course

Low and High Fidelity ,Animations, Multi-Dimentional Variables, Colors, Text, Icons and Plugins with Prototyping

What you'll learn

With Figma, you can create fully interactive prototypes, work with UX personas, and design simple wireframes.

You'll also learn how to implement colors and images properly, choose appropriate fonts for web and mobile apps, and create your own icons, buttons, and other U

You will learn how to use photopea to enhance your design

Whether you want to design websites or mobile phone apps, this course will teach you everything you need to know about working with fonts and colors.

collaborating with team members and exporting the appropriate files for your developer or software engineer.

You'll even learn how to create your first UX brief and persona, and pick up professional workflow tricks and shortcuts.

You will learn how to create various UI/UX design effects including Glasmorphism, Neomorphism and Skeuomorphism .you will receive a comprehensive guide on

Best of all, you'll be able to add "UX designer" to your CV with confidence, knowing that you have the skills and knowledge to succeed in this exciting field.

Throughout the course, you'll build a UX project from beginning to end, and learn what clients expect from a UX designer.

You'll also learn how to create a simple style guide for client handoff, and make both simple and advanced micro interactions, page transitions, and animations.

With videos of detailed Figma and UX/UI design content, you'll have all the techniques used by UX professionals at your fingertips.

Requirements

To get started, all you'll need is a copy of Figma, which you can download for free from Figma website.

Whether you're a beginner or an experienced designer, Figma is accessible to all skill levels.

This course is designed for anyone who wants to learn UX/UI design with Figma, regardless of their prior design or software skills.

Figma is easy to learn and use, even if you have no prior design or software experience.

You don't need any previous design or Figma experience to take this course - just an interest in learning UX/UI design.

Don't worry if you're new to UX/UI design or Figma - this course assumes no previous experience.

Description

Hello and welcome to  complete UI/UX Mega Course using Figma for Beginners, my name is Elisha Nanyong and I am glad to be your instructor in this journey to become a UI/UX Designer using Figma. This design tool will help us create stunning interfaces and engaging prototypes.In this course, we are specifically catering to beginners who are new to design and the field of user experience design. Even if you're unsure about what UI UX design is all about, don't worry, we will start from the basics and work our way up step by step.We will begin by discussing the brief and how to work with a UX persona. Then we will dive into creating simple wireframes. We will learn about incorporating colors and images into high fidelity mockups as we progress. You will also learn about the dos and don'ts of choosing fonts for web and mobile apps.Moreover, we will cover topics such as creating icons, buttons and other UI components, as well as advanced concepts like component sets, constraints, and multi-dimensional variants that are easier to understand the moment we start getting our hands dirty. To make our workflow smoother, we will also be using free UI kits and plugins in Figma.By the end of this course, you will have a complete understanding of how to create simple and advanced micro-interactions, page transitions, and animations. You will be able to build fully interactive prototypes ready for user testing, collaborate with other team members, and export the right files for handoff to your developer or software engineer.Throughout the course, I will set assignments to help you practice and develop your skills, and by the end of it, you will have something unique to showcase in your portfolio. So let's upgrade ourselves and go from Figma novice to Figma Professional. Sign up today and I will see you in class.

Overview

Section 1: KICKING OFF

Lecture 1 Introduction

Lecture 2 Starting out as a beginner

Lecture 3 What is UI/UX, Importance and Differences

Lecture 4 What is Figma

Lecture 5 Introduction to personna

Lecture 6 Task flow and user flow

Lecture 7 What we will be Making in this Course

Section 2: WIREFRAME

Lecture 8 What is a wireframe and what is it use for

Lecture 9 High fidelity in figma

Section 3: INTRO TO FRAME,TEXT AND COLOR

Lecture 10 Figma Installation and Creating a New design file

Lecture 11 Introduction to frames

Lecture 12 Using text tool

Lecture 13 The use of shape tool

Lecture 14 Using strokes and managing default

Lecture 15 Basics of working with colors in Figma

Lecture 16 Object Editing and Manipulation

Lecture 17 Introduction to scale and move tool

Lecture 18 Frame , GrouFrame , Groups and Section in Figma

Section 4: PAGES, ICONS AND PLUGINS

Lecture 19 Where to find and use free icons

Lecture 20 How to synchronize icons strokes

Lecture 21 Using pages in figma

Lecture 22 How to install and use plugins in figma

Section 5: BASIC PROTOTYPING

Lecture 23 How to create Prototype in Figma

Lecture 24 Prototype animation and easing

Lecture 25 View Prototypes on a mobile device using Figma Prototype mirror share.

Section 6: BASIC ANIMATION

Lecture 26 Smart animation and delays

Section 7: COMMENTING

Lecture 27 Sharing and Commenting on Figma file with Stakeholders

Section 8: MOODBOARD - HIGH FIDELITY

Lecture 28 Getting inspirations for UI/UX projects

Lecture 29 Creating mood boards in figma

Section 9: COLUMNS

Lecture 30 Working with Columns and Grid

Section 10: FIGMA TIPS AND TRICKS

Lecture 31 Figma tips and tricks

Section 11: Colours

Lecture 32 Using the eye dropper tool and color inspiration

Lecture 33 Creating a color Palette in Figma

Lecture 34 Making color gradients in Figma

Lecture 35 Create and use color styles in figma.

Section 12: TEXT AND FONT- ADVANCED

Lecture 36 Variations in the amount of font between the browser and desktop versions of Fig

Lecture 37 Choosing and pairing fonts

Lecture 38 Common font size to use in web design

Lecture 39 Making Text styles in figma

Lecture 40 Lorem ipsum

Section 13: DRAWING

Lecture 41 Drawing tips and tricks in Figma

Lecture 42 Tidy up and Smart selection in Figma

Section 14: WORKING WITH ILLUSTRATOR

Lecture 43 Working with Illustrator

Section 15: IMAGES

Lecture 44 Tips are tricks using images in Figma

Lecture 45 How to get royalty free images using plugins

Section 16: WORKING WITH PHOTOPEA

Lecture 46 Do you need Photoshop for your UX design

Lecture 47 About Photopea

Section 17: AUTOLAYOUT AND CONSTRAINTS

Lecture 48 Using Autolayout for spacing

Lecture 49 Spacing in Autolayout

Lecture 50 How to use Constraints

Lecture 51 How to use Constraints 2

Section 18: Effects

Lecture 52 Layer Blur, Image and Background Blur in Figma

Lecture 53 Neumorphic, Glasmorphism, Skeoumorphism Design in Figma

Section 19: SAVINGS and HISTORY

Lecture 54 Local and Save History in Figma

Section 20: COMPONENTS AND INSTANCES

Lecture 55 Updating and resetting your components

Lecture 56 Master Components cannot be deleted from your Project

Lecture 57 Component best design practices

Lecture 58 Advanced way of organizing your components using Forward slash

Section 21: VARIABLE AND VARIANTS IN FIGMA

Lecture 59 How to make a variable component in Figma

Lecture 60 How to make a multi dimensional variant in Figma

Section 22: MAKING A FORM

Lecture 61 How to make a form using variants in Figma

Section 23: PROTOTYPING 2

Lecture 62 How to add a pop up overlay modal in Figma

Lecture 63 How to make and prototype a tooltip in Figma

Lecture 64 Mobile Nav Menu Overlay in Figma

Lecture 65 How to Fix Navigation to the top in Figma

Lecture 66 How to make Horizontal Scrolling Swipe in Figma

Lecture 67 How to design Automatic Carousel / Slider in Figma

Section 24: ANIMATIONS AND MICRO INTERACTIONS

Lecture 68 Animation with custom easing in Figma

Lecture 69 Micro Interactions using Interactive Components in Figma

Lecture 70 Toggle Switch and Burger Menu Micro Interaction

Section 25: THUMBNAIL UPDATE

Lecture 71 How to change the thumbnail for Figma Files

This course is designed for individuals who are looking to incorporate Figma into their career and get paid for their user experience design skills.,It is specifically tailored to beginners, newbies, and amateurs in the field of UX design who are new to the world of design and user experience.,If you need to add "UX Design" to your portfolio or are interested in learning the essentials of UI and UX design, this course is for you.