Getting familiar with the Framer interface - Basis — A clean starter template

IEP Playbook | Modules

01.

Framer Basics

Getting familiar with the Framer interface

The anatomy of a Framer project

Interacting with layers

Thinking in frames

Absolute positioning

Stacks and relative positioning

02.

Layout & Sizing

Sizing to fill and fit content

Stacks vs grids

Fixed and sticky positioning

Fixed, relative, and viewport sizing

Min and max sizing

Adding images, videos, and text

03.

Content & Styling

Using the insert panel

Importing from Figma and the web

Text properties

Link and color styles

04.

Components & Responsive

Light and dark mode themes

Intro to components

Using layout templates

What is responsive design?

Practice: designing fluid layouts

05.

Publish & Grow

Practice: creating breakpoints

SEO and accessibility

Site and page settings

Choosing the right plan

Publishing and connecting a domain

Analytics in Framer

Next

Getting familiar with the Framer interface

Tour the canvas, panels, and toolbar so you know exactly where everything lives.

What you’ll learn in this lesson

Tour the canvas, panels, and toolbar so you know exactly where everything lives. In this lesson you’ll follow along inside Framer, see it applied on a real project, and finish with a short exercise before moving on.

Recources

PDF.pdf