FUNDAMENTALS

Section 1

00: INTRODUCTION

Welcome to the program!

Meet Your Mentor

01: BUILDING BLOCKS

Key concepts & terminology

Terminology Cheat Sheet

Intro to the Framer Editor

Sizing

Layout

Positioning

Properties Panel

Assets & Styles

Building Sections

Building Your First Hero

Build Your Own Hero Section

Breakpoints

Check-in: How did you go?

02: COMPONENTS

Overview of components

Variants

Variables

Create your own button component

Building a Responsive Navbar Component

Build a Responsive Navbar

Page Templates

Components Quiz

Demo: Interactive Pricing Cards

Exercise: Interactive Pricing Cards

03: CMS

Introduction to the CMS

CMS Terms Glossary

Importing Content into the CMS

References & Multi-References

Collection Detail Pages

Collection Lists

Build a Collection Detail Page

Adding Search

Conditions & Transforms

CMS Mastery Quiz

04: EFFECTS

Intro to Effects

Intro to Basic Effects

Scroll Effects

Text Effects

Demo – Creating a Parallax Effect in Framer

From Static to Animated: Animating a Landing Page

05: UTILITY

Forms

Ticker effects

Carousels & Slideshows

Using Video in Framer

Icons

Vectors

Utilizing Plugins

Database of Plugins

Utilizing AI

Lottie Animations

Spline Animations

3D Transforms

Exports

3D Hover Effects

06: SEO & SITE SETTINGS

Understanding site settings

Metatags & SEO

Framer SEO Setup Checklist

Transferring Site Ownership

Analytics

Publishing your site

07: LIVE BUILD

First site: Part 1

First site: Part 2

First site: Part 3

First site: Part 4

First site: Part 5

First site: Part 6

08: WHAT'S NEXT

Assessment 01: Your First Site

Fundamentals Quiz

INTERMEDIATE

Section 2

09: ADVANCED COMPONENTS

Interactions & Events

Animating Components

Creating logic with components

Intermediate Components Quiz

10: ADVANCED ANIMATION

Demo: Animated Navbar on Load

Scroll Sections

Page Transitions

Horizontal Scroll Animations

11: ADVANCED UTILITY

How to Add Custom Cursors in Framer

CMS Tables

Overlays

Bento Grids

Code Components & Overrides

Localization

❌Advanced Analytics

12: INTERMEDIATE SITE BUILD

Assessment 2: Intermediate Live Build

Intermediate Site: Part 1

Intermediate Site: Part 2

Intermediate Site: Part 3

13: WHAT'S NEXT?

Intermediate Quiz

ADVANCED

Section 3

14: WORKING WITH CLIENTS

Client Workflow

Client Handoff & Scope

15: MAKING MONEY WITH FRAMER

Selling Framer to Clients

Finding Framer Clients

Pricing Framer Sites

Framer Project Retainers

Creator Program

Framer Expert Program

16: ECOMMERCE

Review Your Framer Intermediate Build

Ecommerce Site | Syncing Shopify & Framer

Ecommerce Site | Home Page

Ecommerce Site | Detail Page

Final Exercise: Debug a Framer Project

17: WHAT'S NEXT

Final Reflection & Certificate Unlock