Academy

Academy

Framer Fundamentals

In the Framer Fundamentals Course, we’ll build on your existing design skills to help you quickly go live in Framer. Perfect for designers transitioning from Figma or Sketch.

Start course

Start course

Framer Fundamentals

In the Framer Fundamentals Course, we’ll build on your existing design skills to help you quickly go live in Framer. Perfect for designers transitioning from Figma or Sketch.

Start course

Chapter 1

Welcome to Framer

Interacting with Layers in Framer

1:10

The Anatomy of a Framer Project

5:38

Getting familiar with the Framer interface

5:16

Chapter 1

Welcome to Framer

Interacting with Layers in Framer

1:10

The Anatomy of a Framer Project

5:38

Getting familiar with the Framer interface

5:16

Chapter 1

Welcome to Framer

Interacting with Layers in Framer

1:10

The Anatomy of a Framer Project

5:38

Getting familiar with the Framer interface

5:16

Chapter 2

Layout 101

Min and Max Sizing in Framer

8:26

Relative, Fixed, and Viewport Sizing in Framer

7:05

Fixed and Sticky Positioning in Framer

4:09

Stacks vs Grids in Framer

7:45

Sizing to Fill and Fit Content in Framer

7:37

Stacks and Relative Positioning in Framer

8:05

Absolute Positioning in Framer

7:39

Thinking in Frames

3:53

Chapter 2

Layout 101

Min and Max Sizing in Framer

8:26

Relative, Fixed, and Viewport Sizing in Framer

7:05

Fixed and Sticky Positioning in Framer

4:09

Stacks vs Grids in Framer

7:45

Sizing to Fill and Fit Content in Framer

7:37

Stacks and Relative Positioning in Framer

8:05

Absolute Positioning in Framer

7:39

Thinking in Frames

3:53

Chapter 2

Layout 101

Min and Max Sizing in Framer

8:26

Relative, Fixed, and Viewport Sizing in Framer

7:05

Fixed and Sticky Positioning in Framer

4:09

Stacks vs Grids in Framer

7:45

Sizing to Fill and Fit Content in Framer

7:37

Stacks and Relative Positioning in Framer

8:05

Absolute Positioning in Framer

7:39

Thinking in Frames

3:53

Chapter 3

Adding Content to the Canvas

Adding Links in Framer

10:30

Importing from Figma and the Web to Framer

12:55

Using the Insert Panel in Framer

5:13

Adding Images, Video, and Text in Framer

6:08

Chapter 3

Adding Content to the Canvas

Adding Links in Framer

10:30

Importing from Figma and the Web to Framer

12:55

Using the Insert Panel in Framer

5:13

Adding Images, Video, and Text in Framer

6:08

Chapter 3

Adding Content to the Canvas

Adding Links in Framer

10:30

Importing from Figma and the Web to Framer

12:55

Using the Insert Panel in Framer

5:13

Adding Images, Video, and Text in Framer

6:08

Chapter 4

Layer Properties and Style

Using Layout Templates in Framer

12:22

Intro to Components in Framer

16:57

Creating Light and Dark Themes in Framer

6:30

Text Styles in Framer

7:06

Link and Color Styles in Framer

9:36

Text Properties in Framer

12:36

Styling Frames in Framer

10:47

Chapter 4

Layer Properties and Style

Using Layout Templates in Framer

12:22

Intro to Components in Framer

16:57

Creating Light and Dark Themes in Framer

6:30

Text Styles in Framer

7:06

Link and Color Styles in Framer

9:36

Text Properties in Framer

12:36

Styling Frames in Framer

10:47

Chapter 4

Layer Properties and Style

Using Layout Templates in Framer

12:22

Intro to Components in Framer

16:57

Creating Light and Dark Themes in Framer

6:30

Text Styles in Framer

7:06

Link and Color Styles in Framer

9:36

Text Properties in Framer

12:36

Styling Frames in Framer

10:47

Chapter 5

Responsive Design 101

Workshop: Creating Breakpoints in Framer

19:02

Workshop: Designing fluid layouts in Framer

22:30

What is responsive design?

1:26

Chapter 5

Responsive Design 101

Workshop: Creating Breakpoints in Framer

19:02

Workshop: Designing fluid layouts in Framer

22:30

What is responsive design?

1:26

Chapter 5

Responsive Design 101

Workshop: Creating Breakpoints in Framer

19:02

Workshop: Designing fluid layouts in Framer

22:30

What is responsive design?

1:26

Chapter 6

Preparing to Publish

Optimizing your Framer site for search engines and accessibility

10:22

Tracking visitors with Framer’s built-in Analytics

2:45

Chapter 6

Preparing to Publish

Optimizing your Framer site for search engines and accessibility

10:22

Tracking visitors with Framer’s built-in Analytics

2:45

Chapter 6

Preparing to Publish

Optimizing your Framer site for search engines and accessibility

10:22

Tracking visitors with Framer’s built-in Analytics

2:45