Ultimate Figma Megacourse: UI/UX Design Beginner To Expert

Focused View

A F M Jamal Uddin

15:54:55

241 View

1. Getting started with FIGMA

1. Creating an account.mp4

09:34

2. Creating new file And introduction to the layout.mp4

04:58

3. Layers tab, assets tab And pages.mp4

08:51

4. Design, prototype And inspect tab.mp4

15:37

2. Introduction to different tools And creating basic shapes

1. Rectangle, line, arrow And ellipse tool.mp4

15:53

2. Polygon And star shape tools And quick view settings.mp4

08:13

3. Selection, move And scaling tool.mp4

04:07

4. Image tool And quick recap.mp4

05:26

3. Properties, Basic Editing and vector editing of shapes

1. Basic and vector edits of rectangles.mp4

12:59

2. Basic and vector edits of lines And arrows.mp4

10:24

3. Basic and vector edits of ellipses.mp4

09:12

4. Polygon and star tool.mp4

06:39

5. Pen And pencil tool, bend tool And bezier curves.mp4

08:15

6. Comment tool, hand tool and basics of text tool.mp4

10:12

4. Frames, booleans And mask tool, first project

1. Basics of frame tool.mp4

06:38

2. Boolean groups.mp4

15:48

3. Mask tool.mp4

09:17

4. Image fill Vs masks with effects.mp4

09:23

5. First project Sliced Text Effect.mp4

08:50

6. Common mistakes to look out for.mp4

11:18

5. Alignment tools

1. Alignment tools.mp4

15:57

2. Space distribution, Quick rearrange handles And tidy up tool.mp4

14:51

6. Quiz 01

1. Quiz from Lecture 01 to 05.html

7. Grid system

1. Understanding and first look.mp4

11:19

2. How, why and when of the grid system.mp4

09:37

3. Product page design with text baseline alignment.mp4

11:56

8. Constraints, fixed while scrolling And demo the project

1. Understanding constraints.mp4

04:11

2. Understanding the settings And practical usage.mp4

10:57

3. Fixed while scrolling.mp4

08:40

4. Practical usage with a demo project.mp4

11:54

9. Getting started with auto layout

1. Understanding the basics.mp4

07:42

2. Understanding the options And settings.mp4

07:11

3. Deep dive part 1.mp4

10:12

4. Deep dive part 2.mp4

06:16

5. Deep dive part 3.mp4

09:58

6. Deep dive part 4.mp4

13:34

10. Practical examples And real-life usage using mock projects

1. Mock project 1, 2, 3 And 4.mp4

10:17

2. Mock project 5, 6, 7, 8 And 9.mp4

10:17

3. Mock project 10 And 11.mp4

11:13

4. Mock project 12.mp4

06:33

5. Mock project 13.mp4

08:41

6. Mock project 14, 15 And 16.mp4

11:35

7. Latest features And useful shortcut.mp4

10:21

11. Typography

1. Understanding the terminology.mp4

10:00

2. Intro to FIGMA text tool.mp4

08:03

3. Text customisation options And shortcuts.mp4

11:02

4. Paragraph controls, alignments, justifications, advanced And additional options.mp4

10:18

12. Quiz 02

1. Quiz from Lesson 07 t0 11.html

13. Strokes, effects And Glass morphism effect

1. Adding strokes.mp4

05:42

2. Inner shadow And Drop shadow.mp4

10:24

3. Layer Blur And Background Blur.mp4

04:49

4. Glass morphism Project.mp4

10:18

14. Intro to Wireframes

1. Understanding the concept of a wireframe.mp4

07:02

2. A walkthrough of creating a Wireframe.mp4

15:19

3. Understanding the points of wireframing And key points to remember.mp4

09:37

4. Sketching out the contact us page And a responsive versio.mp4

06:46

15. From wireframes to the first draft

1. Creating a low fidelity design.mp4

10:17

2. Creating a navigation bar And header.mp4

09:18

3. Creating the about us section.mp4

10:46

4. Creating the sponsors And footer section.mp4

14:30

16. Making a high-fidelity design from a low-fidelity design

1. Designing the homepage.mp4

14:13

2. Creating the footer section And understanding the design choices.mp4

09:02

3. Creating a responsive version.mp4

13:00

17. Intro to components And Rookie mistakes Dos and Donts

1. Dos And Donts.mp4

09:16

2. Understanding by comparison.mp4

07:19

3. Introduction to components.mp4

13:24

4. Organic components And slash naming convention.mp4

08:39

18. Quiz 03

1. Quiz from Lesson 13 to 17.html

19. Components And instances Deep dive

1. Understanding Instances.mp4

06:11

2. Understanding variants.mp4

08:01

3. Instances And instance swaps.mp4

09:16

4. Creating component sets.mp4

05:46

20. Component properties

1. Understanding component properties.mp4

13:26

2. Properties Vs variants.mp4

08:16

3. Integrating properties in previous component sets.mp4

13:47

21. Prototyping in FIGMA

1. What is prototyping And Making connections.mp4

10:01

2. Making a prototype And different interactions.mp4

10:32

3. Understanding overlays.mp4

13:01

4. Overlays part 2.mp4

13:52

22. Overflow behavior And scrolling

1. Overflow behavior.mp4

13:59

2. Full screen preview.mp4

05:24

3. Splash screen animation.mp4

08:18

4. Mock mailing app refresh animation.mp4

08:31

5. Delete tap And drag interactions.mp4

08:58

23. Plugins And widgets

1. Widgets.mp4

12:16

2. Plugins.mp4

06:31

3. Plugins 2.mp4

08:46

4. Plugins 3.mp4

12:22

5. Plugins 4.mp4

07:33

24. Quiz 04

1. Quiz from Lesson 19 to 23.html

25. Creating a website design from scratch

1.1 creating a complete website.zip

1. Design look And wireframe.mp4

11:06

2. Type-scale, text styles And color styles.mp4

10:39

3. Spacing system, frame selection, grid layout And top nav bar.mp4

11:59

4. Creating the footer section.mp4

09:19

5. Buttons.mp4

12:17

6. Flip cards.mp4

09:16

7. Review cards And interactive carousel.mp4

13:27

8. Expanding page, support card And article card.mp4

04:36

9. Creating vector designs.mp4

14:59

10. Prototyping And final thoughts.mp4

08:40

26. Quiz 05

1. Final Quiz.html

Description

Become UI/UX Designer in 2023. Use Figma to build career in UI Design, User Interface, User Experience design, UX Design

What You'll Learn?

How to start working with Figma as a UI/UX Designer.
How to use colours & images properly in user interface.
How to create your buttons, UI components and assets.
How to make micro interactions, page transitions & animated UI.
Work with fonts & colors while designing UI.
How to make fully interactive prototypes that feels like real website.
Best way to export project for development.

Who is this for?

Anyone who wants to start using Figma in their career or Expand the skill set in CV.

This course is for beginners, newbies & amateurs in the field of UI design.

Anyone wants to design their application, website or blog.

What You Need to Know?

Just need a copy of Free Figma account, a computer and an internet connection.

No previous knowledge needed in Figma.

No previous UX /UI Design experience is required.

And of course patience and a positive mindset.

More details

Description
Build responsive real-world user interface designs in Figma
If you're tired of stretching your head while using Figma. Then, this course is the complete guide to learning how to build amazing things in Figma. For absolute beginners â€” with hands-on exercises.
Figma is a web-based graphics editing and user interface design app that works on your browser. That means you can access your projects from any device without installing software. It has collaboration facilities on the same file in real-time. So, your team can join you online taking the project from brainstorming to prototypes. Figma is not limited to UI design. It has the full potential to use as a daily graphics designing tool. By the end of this project, you will be able to use Figma with full potential.

From this course, you learn,
Navigation and Interface: Familiarize yourself with Figma's interface, including the different panels, menus, and shortcuts.
Vector Graphics: Learn how to create and manipulate vector graphics in Figma, including shapes, paths, and vector networks.
Layers and Frames: Understand how layers and frames work in Figma, including layer organization, frame creation, and layer styles.
Components and Assets: Discover how to create and use components and assets to streamline your design workflow and maintain consistency.
Prototyping: Learn how to create interactive prototypes in Figma using the built-in prototyping tools.
Design Style: Understand the benefits of design style and how to create and maintain a design system.
Collaboration and Sharing: Learn how to collaborate with other designers and stakeholders and share your designs with them.
Plugins and Integrations: Explore Figma's extensive plugin library and how to integrate Figma with other tools in your workflow
Who this course is for:
Anyone who wants to start using Figma in their career or Expand the skill set in CV.
This course is for beginners, newbies & amateurs in the field of UI design.
Anyone wants to design their application, website or blog.

User Reviews

Rating

average 0

Total votes0

Focused display

Hi, I'm Jamal, a Developer having more than 10 years of experience based in Helsinki, Finland. Over these years, I helped to build thousands of businesses online presence successfully all over the world. I am a proud Elite Author of Envato Marketplace. Along with my 9-5 Developer job, in my free time, I love to create tutorials and connect with people.

Udemy

View courses Udemy

Students take courses primarily to improve job-related skills.Some courses generate credit toward technical certification. Udemy has made a special effort to attract corporate trainers seeking to create coursework for employees of their company.