LearnUX.io Awwwards Honorable Mention

Figma Course

  1. Intro to Figma 03:06

    Intro to Figma

    Learn what Figma is all about

  2. Figma Basics 10:06

    Figma Basics

    Take a look at the basic features

  3. Features Preview 08:18

    Features Preview

    Explore basic tools and techniques

  4. Working with Frames 08:46

    Working with Frames

    See how to use Frames inside of Figma

  5. View Options 07:31

    View Options

    Check out how to move inside document Canvas

  6. Layout Grid 09:12

    Layout Grid

    Work efficiently with Layout Grid in Figma

  7. Sketch and Illustrator Import 07:30

    Sketch and Illustrator Import

    Import readymade design files and continue work in Figma

  8. Scaling in Figma 05:34

    Scaling in Figma

    See how imported content behaves in Figma and how scaling works

  9. Readymade Components 05:05

    Readymade Components

    Use some predefined components for your layout

  10. Working with Color 14:29

    Working with Color

    Check out the color tools you will find in Figma

  11. Styles in Figma 08:37

    Styles in Figma

    Learn how to use Styles in order to create a consistent UI

  12. Working with Images 08:04

    Working with Images

    See how easy is importing and working with images

  13. Text Frames 07:36

    Text Frames

    Working with text inside of Figma

  14. Images in Layout 07:25

    Images in Layout

    See how to optimally use images

  15. Pen tool 12:45

    Pen tool

    Create paths and basic shapes with Pen Tool

  16. Advanced Shapes Operations 13:41

    Advanced Shapes Operations

    Work with more advanced Shapes in Vector Environment

  17. Components 11:40

    Components

    See how to reuse elements with components inside of Figma

  18. Second Screen 06:44

    Second Screen

    Working with second screen of our app

  19. Masks and Third Screen 07:27

    Masks and Third Screen

    Working with third screen of our app

  20. Working with Effects 12:27

    Working with Effects

    See how effects work in Figma

  21. Last Screens 09:04

    Last Screens

    Working with last screens of our app

  22. Constraints 14:34

    Constraints

    Using constraints to scale seamlesly to any resolution

  23. Version History 03:32

    Version History

    Explore different versions of a design file

  24. Device Preview 03:05

    Device Preview

    See how to preview Designs on real device

  25. Collaboration 04:08

    Collaboration

    Use Figmas great collaboration features for teamwork

  26. Using Comments 02:24

    Using Comments

    Communicate with your team and get feedback

  27. Libraries 13:13

    Libraries

    Working with team libraries in Figma

  28. Asset Export 06:29

    Asset Export

    How to export images from Figma efficiently

  29. Blending Modes 03:13

    Blending Modes

    See how you can mix and match layers together

  30. Prototyping 04:03

    Prototyping

    Check out new prototyping options inside Figma

  31. Advanced Prototyping 08:14

    Advanced Prototyping

    Work with overlays and other advanced interactions.

  32. Prototyping Tips 09:18

    Prototyping Tips

    See some more advanced features of Figma prototypes

  33. Code Handoff 02:23

    Code Handoff

    Pass your design spec to Developers with no effort

  34. Figma Tips & Tricks 25:43

    Figma Tips & Tricks

    50 Figma Tips in 25 minutes. Enjoy!

  35. See You Soon 00:56

    See You Soon

    Goodbye

Figma Course

Duration: 04:46:22 Last update: 4 years ago
  • Key Points
  • Author
  • Source Files
  • Who is this course for?

Figma is a revolutionary application, because it maintains its full functionality in both desktop, and browser versions. You can use either of them, and the web version will still surprise you with how efficient it is! Moreover, designing interfaces is but one of its many features. Thanks to its intuitive and user – friendly interface and tool set, everybody is going to be able to edit graphic assets using this app. Figma differs from other, similar applications such as Photoshop and Sketch, mainly because of its amazing collaboration capabilities, where a project may be worked on by more than one person, in real time!

  • Figma tools and interface
  • Apple Watch project
  • Collaboration in Figma
  • Components in Figma
  • Exporting graphics
  • Optimising vectors

Greg Rog - “My work is all about design, coding and education. For over 10 years I’ve been a professional designer, design lead and UX consultant for companies such as Microsoft or Google. I work closely with Adobe as Community Professional. I also run a software house and a training facility, speak on design conferences and more. I’m curious, passionate and I love sharing knowledge.”

Sorry, you don’t have access to the project files.

Why don’t you subscribe and get full access throughout the site?

Figma is for everyone, who want to effectively edit graphic assets and create user interfaces. It’s very friendly, free and most importantly, browser environment. Figma does not require subscription and what it offers is great for both individuals and design teams. You will benefit from Figmas’ features both as a beginner and professional UI designer.

Reviews (2)

Learn Figma for UI Design

Welcome to UI revolution

During the course you will see all the tools and working techniques of Figma. The interface and tools available in Figma may be intuitive and user friendly, but it’s always good to use some reliable schemes and efficiency–improving techniques.

Apple Watch project

We are going to focus on the design of a few practical examples of interfaces made with Figma, and discover the potential of vector tools, artboards, and more! Then, we are going to design an additional version of the app we have already worked on during the Sketch course - the intelligent home app – for Apple Watch!

Figma Collaboration functionality

Figma is often compared to Sketch, but with the addition of great collaborative functions for UI/UX designers. It is possible to undertake real – time cooperation with several team members on one project and even see the changes implemented, live in the browser! This provides an opportunity for an ongoing discussion and remote, constructive feedback. Moreover, you may also make use of Libraries, where your team members will have access to all the design elements you have prepared beforehand! A change in one library element, eg. Style Guide, results in an update applied to all the projects.

Collaboration in Figma
Components and Exporting assets in Figma

Components in Figma

With Figma, any element you choose can become a Component, instances of which might appear in various other parts of the project, or even in a Library. If you edit the original component, all its instances will automatically get updated, as well. It makes designing much more efficient!

Exporting graphics

With Figma, you will easily export graphic assets to web spplications and mobile devices. In our lessons you will learn how to optimize vectors and bitmaps, and later export them to a website or a mobile app, using optimal extensions.

Handoff and Prototyping

One of the latest features of Figma is developer handoff as well as creating rapid prototypes from the static screens. Those new features all add up to make Figma one of the most interesting tools to follow and learn as an UI/UX desiner!

Handoff and prototyping with Figma
Gain access to all courses from $12/mo