A mathematically defined curve used in vector graphics and animation, controlled by anchor points and handles that determine its shape. Understanding bezier curves helps create smooth, natural-feeling animations and custom easing functions. Framer’s animation curves use bezier mathematics to control the acceleration and deceleration of motion.

A layout system that divides space into rows and columns, creating alignment and structure for content placement. Grid systems ensure visual consistency and make responsive design more predictable. Framer supports CSS Grid concepts through layout tools that adapt columns and gaps across breakpoints.

The relative size of elements in relation to each other and the overall design, establishing hierarchy and emphasis. Scale creates visual drama—dramatically larger elements command attention while smaller ones recede. Consider how scale relationships change across breakpoints in responsive designs.

Evidence of others’ positive experiences—testimonials, reviews, user counts, client logos—that builds trust with visitors. Social proof leverages psychological tendencies to follow others’ behavior. Display social proof prominently, especially near conversion points.

A quote or endorsement from a satisfied customer providing social proof and building trust with potential customers. Effective testimonials are specific, relatable, and include identifying details like names and companies. Display testimonials prominently near decision points.

The path a user takes through your website to accomplish a goal, from entry to completion. Mapping user flows reveals friction points and optimization opportunities. Design flows that minimize steps while providing necessary information at each stage.