Getting Started - Figma Advanced
Questions
Oops! You need to be a member to join in.
Feel free to browse but if you'd like to jump into the conversation you'll need to join our awesome student community.
Explore 30+ Essential and Advanced courses in Figma, Photoshop, Illustrator, Lightroom, Premiere Pro, Webflow, and more. Enjoy self paced learning, personalized support, earn certificates, and exciting community challenges.
Student Gallery
Be the first to share something.
Course info
Overview
Course length: 9+ hours.
Try Figma for free by clicking here.
Requirements:
Who this course is for:
- UX/UI adventurers who already have a basic understanding of Figma.
- Self-taught Figma enthusiasts yearning for structured guidance.
- Graduates of my Figma Essentials Course, hungry for more knowledge and skills.
- Visionaries who have developed their own unique Figma approach but crave exploration of the vast universe of tools, updates, and time-saving techniques.
AI & Interaction Design
- First Draft & Add Interactions Using AI
- Suggest Auto Layout, Replace Content, Duplicate & Rename Layers (AI)
- AI Add Interactions Automatically
Layout & Auto Layout Mastery
- Working with Complex Layouts
- Nested & Responsive Auto Layouts
- Auto Layout Grids
- Grid vs Constraints vs Auto Layout — Which One to Use and When?
- How to Add Rows and Column Grids to One Layout
- How to Create & Update Layout Guide Styles for Columns & Rows
- How to Overlap & Stack Using Auto Layout
- Ignore Auto Layout to Absolute Spacing
- Minimum & Maximum Width/Heights
- How to Wrap Auto Layout Objects
Components, Variables & Variants
- Using Variants
- Multi-Dimensional Variants
- Variable – Light and Dark Modes
- Cart Totals Using Number Variables
- Conditions in Variables
- Boolean Variables
- Overlay Popups
- Spacing with Number Variables
- Boolean Component Properties
- Form Fields with Component Properties
- Instance Swap Inside a Component
- Organizing Components
Design Techniques & Visual Effects
- Liquid Glass Effect
- Texture, Noise & Effect
- Progressive Blur Effect
- Saving Effect Styles & Clearing Unused Styles
- Houdini Text
- Spring Animation & Overlays
- Masking Images Using AI Remove Background
- Spillover Masks
- Mask Images with Text
- Colour Layer Blending Modes
- Curving Text
- Vertical Trim
- Truncation
Animation & Interactions
- Custom Easing
- Animation Inside Variants
- Sticky Scroll Position Search Bars
- Horizontal Scrolling/Swipe
- Automatic Scroll Down to Anchor Point
- Interactive Components
Video & Media
- Working with Video
- Play/Pause Video Controls
- Video to Play on Hover
Typography & Color Systems
- Advanced Color Tricks
- Change/Replace Colors
- Color Themes for Light and Dark
- What is Good Spacing for Web & App Design
Accessibility
- Making Your Designs Accessible
Drawing & Vector Tools
- Advanced Drawing Tips and Tricks
- Variable Width Tool & Simplify Stroke
Workflow, Collaboration & Handoff
- Workflow Tips & Tricks
- Advanced Copy, Paste, and Selection Tricks
- Frame Tips and Tricks
- Sections
- Layer Zen in Figma
- Advanced Search
- Bulk Rename Layers
- How to Use Dev Mode
- Document a Component in a Design System
- Version History
- Slice Tool
- Team Libraries
- Refactoring Components
- Forum support from me and the rest of the BYOL crew.
- All the techniques used by UX professionals
- 107 videos of detailed Figma Advanced Content.
Daniel Scott
Founder of Bring Your Own Laptop & Chief Instructor
I discovered the world of design as an art student when I stumbled upon a lab full of green & blue iMac G3’s. My initial curiosity around using the computer to create ‘art’ developed into a full-blown passion, eventually leading me to become a digital designer and founder of Bring Your Own Laptop.
Sharing and teaching are a huge part of who I am. As a certified Adobe instructor, I've had the honor of winning multiple Adobe teaching awards at their annual MAX conference. I see Bring Your Own Laptop as the supportive community I wished for when I was first starting out and intimidated by design. Through teaching, I hope to bring others along for the ride and empower my students to bring their stories, labors of love, and art into the world.
True to my Kiwi roots, I've lived in many places, and currently, I reside in Ireland with my wife and kids.
Certificates
We’re awarding certificates for this course!
Check out the How to earn your certificate video for instructions on how to earn yours and click the available certificate levels below for more information.
Downloads & Exercise files
Download Files
Please confirm you would like to download this file, some files can be large. You maybe want to consider downloading on wifi rather than mobile data.
Large file sizes may also take a while to download depending on your internet speed.
Name:
Size:
Transcript
Alright, you made it in welcome.
Congratulations. You made a good choice.
Uh, the first thing you're gonna do is download the
exercise files for this course.
Okay. There'll be a link on this page to download those.
Inside of there will be a shortcut sheet.
Um, I'll go through them in the course,
but there'll be a sheet with them on there as well
where you can print off and circle the ones you really like
and add the ones that I've missed.
Stick it next to your computer. Look all awesome.
I speak fast, I think I speak fast.
Um, so you can slow me down.
There's a cog down in the corner here where you can click it
and set the speed that I talk at.
You can either put me in super slow drunk mode or UNK mode
or leave me like this up to you.
Figma is new-ish and just changing all the time.
They love to move things around.
So if, uh, the, you are in the course
and you're like, Hmm, this is not named the same,
but it looks the same, it's probably the same.
Or if it's moved, you might have to have a look around
to see where it's slightly gone or renamed.
Look in their comments. I might have left a comment.
If it's easy. If it's a big change, I'll go
and rerecord the course.
But there are changes all the time.
Figman like to do that to us.
Can you do this course with a free version?
You can for a bit. Um, a lot
of the course you can do on the free version.
That's no problem. There will be some paid,
um, parts that we'll look at.
So if you don't have that, you can just follow along
and you might end up deciding I need the paid version.
Um, but yes, it's not a waste of time doing this
with the free version of Figma.
Um, I'm gonna do mine on a Mac, uh,
with the downloaded software.
You can do it on PC in the browser.
It all looks and works the same.
Um, some of you will be coming on from the uh,
Figma Essentials course and some
of you will be jumping straight to this course
'cause you're ready for it.
The people coming on from the older course.
Well the older course, the first course,
the essentials course, you will find
that there's a tiny bit of overlap.
It's when we get to kind of trickier things
where we're gonna push it further.
Um, things like auto layouts, we'll just cover quickly
what an auto out does
and how it functions, which you've already done.
Okay. Just like a little recap
before we go off and push it even further.
So there's a couple of times we
were like, have we done this?
You've done a little bit of it, but we're gonna take it
further in this course and I want everyone
to be kinda like starting at the right
start, if you know what I mean.
Uh, in this course there's a couple of level ones
and level twos like auto allowed.
There's a level one, level two.
The reason I do it to break them up so that we don't go mad
and spending the whole chunk
of course looking at this one function.
Okay. Components or a variable or something. Okay.
So I've kind of done a level one where we do all the,
probably gonna use a lot type stuff.
We'll take a break, do some other things so
that we don't go crazy,
but also find bump into some reasons why.
Oh, this would be good if we could do more with
that earlier thing.
We learned. Surprise level two, um, where we go through it
and um, just kind of like expand on it.
So you see a few level ones and twos in this course.
That's what they're for there.
Just split them up so we're not doing grad board
with the same thing, but also so that we get a chance
to work with it and find the reason why we'd look
to go even further with these
Features. Lastly, uh,
you can follow me at Figma.
Okay, there's community. Go to figma.com/at BYL.
Okay, and you don't have to, but follow me there.
Uh, that's where I'll post
the finished files from this course.
Okay. If you're just starting, yeah,
there'll be the finished files on the course.
You can have poke around the things that I made.
It's not particularly organized,
but it's sometimes handy to see the files
that I've been working on.
And you can take a look at them too.
All right, that is it my friends. No more talking.
Let's get making. We'll see you in the next video, won't we?