Black Friday sale! Get 30% OFF with code "BF2024"
New & improved 2.0 version
The definitive Framer course to go from a beginner to a Pro
Learn to turn your designs into functional websites with Framer and increase your earning potential as a designer.
30-day money back guarantee
"If you're just starting with Framer, this course is a game-changer. The instructor breaks down everything in simple terms & doesn't stop at the basics. You get to practice with real projects, which really helps solidify your learning. This course is a gem for beginners!"
"If you're just starting with Framer, this course is a game-changer. The instructor breaks down everything in simple terms & doesn't stop at the basics. You get to practice with real projects, which really helps solidify your learning. This course is a gem for beginners!"
"If you're just starting with Framer, this course is a game-changer. The instructor breaks down everything in simple terms & doesn't stop at the basics. You get to practice with real projects, which really helps solidify your learning. This course is a gem for beginners!"
Predrag Rovcanin
Lead Designer at Vix Nova agency
Why students love this course
Here are just a few reasons why students choose our course
Always updating material
We keep up with the pace of Framer's development by releasing new videos every month. Of course, you get access to all new updates.
Easy-to-consume videos
We will not bore you with hour-long videos that will put you to sleep. We kept all of our videos short to make it easy to consume.
Great for any level
Whether you are a complete beginner, or have some experience building sites with Framer, you will learn useful skills in this course.
Self-paced material
Everybody learns differently. Some students finish the course in a week, others take a month. You can learn at the pace that works best for you.
Real-world projects
In this course we will not be building some gimmicky site that looks cool. We will build out a real website that has been used by real businesses.
All-in-one course
This is an all-in-one course that will help you master Framer. We'll take you step-by-step so that you can implement the concepts with ease.
In this course you'll master…
Fundamentals of working with Framer
We'll start with giving you a breakdown of the fundamental concepts in Framer. You'll learn about sizing, positioning, layouts, text styles, color styles, working with images, icons, and even create your first component. This foundational knowledge will set you up for success in the later modules.
Fundamentals of working with Framer
We'll start with giving you a breakdown of the fundamental concepts in Framer. You'll learn about sizing, positioning, layouts, text styles, color styles, working with images, icons, and even create your first component. This foundational knowledge will set you up for success in the later modules.
Fundamentals of working with Framer
We'll start with giving you a breakdown of the fundamental concepts in Framer. You'll learn about sizing, positioning, layouts, text styles, color styles, working with images, icons, and even create your first component. This foundational knowledge will set you up for success in the later modules.
Responsive design & development
We will approach each design element with responsiveness in mind, so that our website looks great on all screen sizes. You'll learn how to design each section and each element responsively (pun intended) so that you don't have to make many changes on tablet & mobile breakpoints.
Responsive design & development
We will approach each design element with responsiveness in mind, so that our website looks great on all screen sizes. You'll learn how to design each section and each element responsively (pun intended) so that you don't have to make many changes on tablet & mobile breakpoints.
Responsive design & development
We will approach each design element with responsiveness in mind, so that our website looks great on all screen sizes. You'll learn how to design each section and each element responsively (pun intended) so that you don't have to make many changes on tablet & mobile breakpoints.
Working with components
Components will be our best friends throughout the course. They'll help us speed up our design process and give us flexibiliy with making any changes. We'll create 30+ components in this course and you'll learn how to work with components of various difficulty. By the end of the course, you'll become a master at working with components.
Working with components
Components will be our best friends throughout the course. They'll help us speed up our design process and give us flexibiliy with making any changes. We'll create 30+ components in this course and you'll learn how to work with components of various difficulty. By the end of the course, you'll become a master at working with components.
Working with components
Components will be our best friends throughout the course. They'll help us speed up our design process and give us flexibiliy with making any changes. We'll create 30+ components in this course and you'll learn how to work with components of various difficulty. By the end of the course, you'll become a master at working with components.
Managing content at scale with CMS
On top of components, you'll learn how to manage your site content at scale with Framer's power Content Management System (CMS). We'll create CMS collections of various complexity, learn how to import & export data with CVSs. You'll also learn how to set limits, conditional views, and CMS references.
Managing content at scale with CMS
On top of components, you'll learn how to manage your site content at scale with Framer's power Content Management System (CMS). We'll create CMS collections of various complexity, learn how to import & export data with CVSs. You'll also learn how to set limits, conditional views, and CMS references.
Managing content at scale with CMS
On top of components, you'll learn how to manage your site content at scale with Framer's power Content Management System (CMS). We'll create CMS collections of various complexity, learn how to import & export data with CVSs. You'll also learn how to set limits, conditional views, and CMS references.
Collecting data with custom forms
We'll create a custom form from scratch using Framer's native form builder. We'll customize every field, desing loading and success states, and connect the form to email and Google sheets for easy data management. By the end of the course, you'll be able to create forms of any difficulty.
Collecting data with custom forms
We'll create a custom form from scratch using Framer's native form builder. We'll customize every field, desing loading and success states, and connect the form to email and Google sheets for easy data management. By the end of the course, you'll be able to create forms of any difficulty.
Collecting data with custom forms
We'll create a custom form from scratch using Framer's native form builder. We'll customize every field, desing loading and success states, and connect the form to email and Google sheets for easy data management. By the end of the course, you'll be able to create forms of any difficulty.
3D transforms
We'll also dive into 3D transforms. We'll start off with a quick intro and then turn our testimonial cards into 3D cards that flip on hover on desktop breakpoint and on click on mobile breakpoint. By the end of the course, you'll be able to work with 3D effects with ease.
3D transforms
We'll also dive into 3D transforms. We'll start off with a quick intro and then turn our testimonial cards into 3D cards that flip on hover on desktop breakpoint and on click on mobile breakpoint. By the end of the course, you'll be able to work with 3D effects with ease.
3D transforms
We'll also dive into 3D transforms. We'll start off with a quick intro and then turn our testimonial cards into 3D cards that flip on hover on desktop breakpoint and on click on mobile breakpoint. By the end of the course, you'll be able to work with 3D effects with ease.
Advanced interactions & animations
We'll bring our site to life with animations and effects. This will be the most exciting part of the course. You'll learn how to work with appear, scroll, loop, drag, hover, press, scroll transform, and scroll speed effects. We'll also dive into text effects & page-level effects. By the end of the course, you'll know how to work with all effects in Framer.
Advanced interactions & animations
We'll bring our site to life with animations and effects. This will be the most exciting part of the course. You'll learn how to work with appear, scroll, loop, drag, hover, press, scroll transform, and scroll speed effects. We'll also dive into text effects & page-level effects. By the end of the course, you'll know how to work with all effects in Framer.
Advanced interactions & animations
We'll bring our site to life with animations and effects. This will be the most exciting part of the course. You'll learn how to work with appear, scroll, loop, drag, hover, press, scroll transform, and scroll speed effects. We'll also dive into text effects & page-level effects. By the end of the course, you'll know how to work with all effects in Framer.
SEO & analytics
We'll finalize our site development by making sure all SEO parameters & settings are set correctly. You'll learn how to set titles, meta descriptions, images, and how to add custom domains. We'll also go over Framer analytics & how to connect your site to Google Analytics.
SEO & analytics
We'll finalize our site development by making sure all SEO parameters & settings are set correctly. You'll learn how to set titles, meta descriptions, images, and how to add custom domains. We'll also go over Framer analytics & how to connect your site to Google Analytics.
SEO & analytics
We'll finalize our site development by making sure all SEO parameters & settings are set correctly. You'll learn how to set titles, meta descriptions, images, and how to add custom domains. We'll also go over Framer analytics & how to connect your site to Google Analytics.
What students say about the course
Some kind words from course graduates
"The course is perfect for those looking to finally get a grip with Framer and learn the fundamentals.I personally LOVED the teaching style! It was more casual and easy to follow along which was important for me since the goal was to finish it through to the end. The value you get for a course at this price really is a no-brainer 💯"
Mark Mograph
Motion designer
"The course starts with foundational concepts and progresses to more advanced topics. It provides hands-on practice with guidance from the instructor, who explains concepts in an easily understandable manner. I gained a lot of value from this course, enabling me to build my website rapidly and effectively. I highly recommend this course!"
Avis Williams
UX/UI Designer at Green Collab
"If you're just starting with Framer, this course is a game-changer. It doesn't stop at the basics. It takes you all the way to connecting your site with Google Analytics, a must-have skill. The instructor breaks down everything in simple terms. You get to practice with real projects, which really helps solidify your learning. This course is a gem for beginners!"
Predrag Rovcanin
Lead Designer at Vix Nova
"The course took my UI/UX design skills to the next level. The hands-on approach with practical exercises allowed me to apply what I learned in real-world projects, giving me the confidence to use Framer effectively.I highly recommend this Framer course to anyone looking to enhance their design capabilities and create stunning, interactive websites!"
Miguel Tapia
Analyst at Gallo
The course was absolutely amazing & I learned so much in the process
Russ Hunneman
Founder of Tres Commas
"The course is perfect for those looking to finally get a grip with Framer and learn the fundamentals.I personally LOVED the teaching style! It was more casual and easy to follow along which was important for me since the goal was to finish it through to the end. The value you get for a course at this price really is a no-brainer 💯"
Mark Mograph
Motion designer
"The course starts with foundational concepts and progresses to more advanced topics. It provides hands-on practice with guidance from the instructor, who explains concepts in an easily understandable manner. I gained a lot of value from this course, enabling me to build my website rapidly and effectively. I highly recommend this course!"
Avis Williams
UX/UI Designer at Green Collab
"If you're just starting with Framer, this course is a game-changer. It doesn't stop at the basics. It takes you all the way to connecting your site with Google Analytics, a must-have skill. The instructor breaks down everything in simple terms. You get to practice with real projects, which really helps solidify your learning. This course is a gem for beginners!"
Predrag Rovcanin
Lead Designer at Vix Nova
"The course took my UI/UX design skills to the next level. The hands-on approach with practical exercises allowed me to apply what I learned in real-world projects, giving me the confidence to use Framer effectively.I highly recommend this Framer course to anyone looking to enhance their design capabilities and create stunning, interactive websites!"
Miguel Tapia
Analyst at Gallo
The course was absolutely amazing & I learned so much in the process
Russ Hunneman
Founder of Tres Commas
Course Curriculum
Detailed course curriculum which covers everything we will learn during the course.
Homepage & Components
Components module overview
2:34
Free
Setting up our project & first font styles
9:14
Free
Defining all font styles
10:48
Free
Setting color styles
10:27
Hero section
13:54
Working with logos in Framer
6:27
Validation section & ticker component
9:30
Feature highlights section
16:24
Features section: designing the section
15:08
Features section: turning into components
8:30
Process: Designing the section
14:15
Process: Adding interactivity
7:12
Vertically rotating card: design
11:07
Vertically rotating cards: interactivity
11:21
Featured testimonial
11:51
FAQ: designing cards
13:21
FAQ: making card interactive
7:37
Blogs & CMS
Blogs & CMS Module overview
1:10
Free
Setting up our first CMS collection
8:11
Designing blog post page
7:58
CSV importing & exporting
3:13
CMS references
12:11
Conditional views
3:36
Creating our Blog card
11:24
Connecting components to CMS
6:40
CMS filtering & limits
8:39
Adding a Back button
6:08
Legal page with Previous & Next buttons
11:43
Animations & Effects
Animations & Effects Module overview
0:57
Free
Header Appear effect
8:43
Hero circle scroll transform effect
7:31
3D scroll transforms
6:53
Scroll speed effect
3:30
Scroll animation for Navbar
2:35
Appear animation with a delay
6:09
Feature section - Effects on component level
5:45
Loop, Drag, Hover & Press effects
10:37
Text effects
5:49
Page effects
6:53
Buttons hover effect
8:09
Homepage & Components
Components module overview
2:34
Free
Setting up our project & first font styles
9:14
Free
Defining all font styles
10:48
Free
Setting color styles
10:27
Hero section
13:54
Working with logos in Framer
6:27
Validation section & ticker component
9:30
Feature highlights section
16:24
Features section: designing the section
15:08
Features section: turning into components
8:30
Process: Designing the section
14:15
Process: Adding interactivity
7:12
Vertically rotating card: design
11:07
Vertically rotating cards: interactivity
11:21
Featured testimonial
11:51
FAQ: designing cards
13:21
FAQ: making card interactive
7:37
Blogs & CMS
Blogs & CMS Module overview
1:10
Free
Setting up our first CMS collection
8:11
Designing blog post page
7:58
CSV importing & exporting
3:13
CMS references
12:11
Conditional views
3:36
Creating our Blog card
11:24
Connecting components to CMS
6:40
CMS filtering & limits
8:39
Adding a Back button
6:08
Legal page with Previous & Next buttons
11:43
Animations & Effects
Animations & Effects Module overview
0:57
Free
Header Appear effect
8:43
Hero circle scroll transform effect
7:31
3D scroll transforms
6:53
Scroll speed effect
3:30
Scroll animation for Navbar
2:35
Appear animation with a delay
6:09
Feature section - Effects on component level
5:45
Loop, Drag, Hover & Press effects
10:37
Text effects
5:49
Page effects
6:53
Buttons hover effect
8:09
Homepage & Components
Components module overview
2:34
Free
Setting up our project & first font styles
9:14
Free
Defining all font styles
10:48
Free
Setting color styles
10:27
Hero section
13:54
Working with logos in Framer
6:27
Validation section & ticker component
9:30
Feature highlights section
16:24
Features section: designing the section
15:08
Features section: turning into components
8:30
Process: Designing the section
14:15
Process: Adding interactivity
7:12
Vertically rotating card: design
11:07
Vertically rotating cards: interactivity
11:21
Featured testimonial
11:51
FAQ: designing cards
13:21
FAQ: making card interactive
7:37
Blogs & CMS
Blogs & CMS Module overview
1:10
Free
Setting up our first CMS collection
8:11
Designing blog post page
7:58
CSV importing & exporting
3:13
CMS references
12:11
Conditional views
3:36
Creating our Blog card
11:24
Connecting components to CMS
6:40
CMS filtering & limits
8:39
Adding a Back button
6:08
Legal page with Previous & Next buttons
11:43
Animations & Effects
Animations & Effects Module overview
0:57
Free
Header Appear effect
8:43
Hero circle scroll transform effect
7:31
3D scroll transforms
6:53
Scroll speed effect
3:30
Scroll animation for Navbar
2:35
Appear animation with a delay
6:09
Feature section - Effects on component level
5:45
Loop, Drag, Hover & Press effects
10:37
Text effects
5:49
Page effects
6:53
Buttons hover effect
8:09
Course Pricing
Enroll today to get the best pricing. All future course updates are included in your membership.
Course
Get access to the entire curriculum & learn at your own pace
$99
one-time fee
What's included:
90+ video lessons
90+ video lessons
90+ video lessons
10+ hours of content
10+ hours of content
10+ hours of content
Lifetime access
Lifetime access
Lifetime access
All future updates
All future updates
All future updates
Course + Coaching
Get access to the curriculum and 2 separate 1:1 sessions with the instructor
$399
one-time fee
What's included:
90+ video lessons
90+ video lessons
90+ video lessons
10+ hours of content
10+ hours of content
10+ hours of content
Lifetime access
Lifetime access
Lifetime access
All future updates
All future updates
All future updates
Two 40-min 1:1 sessions with instructor
Two 40-min 1:1 sessions with instructor
Two 40-min 1:1 sessions with instructor
Both plans are eligible to 100% money-back guarantee within the first 30 days. For the Course + Coaching plan, the instructor hours should be unused in order to get a refund.
Hi 👋 I'm Firdavs - your instructor for the course
I'm an official Framer expert, partner, and the founder of framer.ing templates. I've spent over 1,000 hours building Framer templates and websites for clients. Along the way, I learned all the intricacies of working with the platform and I'm excited to share all of my learnings with you. This course is 1,000+ hours of Framer experience condensed into 10. You'll learn a ton about building with Framer in this course, and if you are satisfied - I'm happy to give the money back.