Prototyping with Framer
Noah Levin · @nlevin
June 4th, 2015
Follow along at nlevin.com/whitespace
Noah Levin · @nlevin
June 4th, 2015
Follow along at nlevin.com/whitespace
layerName.animate properties: # Positioning x: 0, y: 0, opacity: 0.5, rotationX: 250, # Size scale: 1.5, width: 500, height: 800, # Filters blur: 100, invert: 100, brightness: 150, contrast: -50, hueRotate: 150, saturate: 50 # Shadows shadowX: 10 shadowBlur: 16
# Curve types curve: "linear" "bezier-curve" "spring" curveOptions: # For linear and bezier "ease-in", "ease-out", "ease-in-out", [.4,0,.2,1] # For springs. Shorthand: spring(tension,friction,velocity) tension: 900 friction: 25 velocity: 30 # For Bezier's and Linear time: 1 # in seconds delay: 0 # in seconds repeat: 0
spring(tension, friction, velocity)