I authored Instacart’s Motion Guidelines — the foundational motion language system that defines how the brand moves across every touchpoint, from logo end cards to in-app interactions. The system covers animation principles, timing rules, logo motion, typography builds, lower thirds, transitions, and Instacart+ — and serves as the canonical reference for motion across the entire organization.

We use the full carrot app icon to build equity into our new logo by bridging our past with the future. The full carrot drops below the ground line to land on our new logo.

Extensibility — our arrow can be used to show our offering. It’s always in context with a half circle.

Our symbol activates graphic transitions. The arrow pulls up the carrot root while it scales up to wipe the full screen.

Body copy fades on over a duration of approximately fifteen frames.

Our typography pulls up from the baseline like a farm-fresh carrot picked from the earth. Offset by four frames.

We use interactions to build equity into our new logo. Users first register the full carrot, then discover the more digitally efficient carrot growing from the ground.

The logo can be expressed in full (wordmark + carrot) or as just the carrot. Example usage: video openings, end cards, interstitials.

Can be used to introduce key words and establish a call to action or key features. Example usage: end card CTAs, initial branding moments within a video.

Title cards introduce content and establish section hierarchy. Example usage: opening frame for a presentation, initial branding moment within a video.

Lower thirds provide additional information to what is being displayed on screen. Example usage: introducing an individual or job title, giving context of visual subject matter.

Transitions are visual methods used to travel from one state of content to another. Example usage: moving from a title card to a live action shot, adding visual interest to animation.

A call to action instructs the audience to act immediately. Example usage: end frame element that prompts action or promotes an offer.

We use a custom speed graph whenever the Carrot Click version of the logo animation is introduced. The IN point begins with an increasing speed accelerating, followed by a decreasing speed decelerating into an Easy Ease OUT point. The IN & OUT keyframes are spaced 6 frames apart from the midpoint of the animation.

Type builds at an intentional cadence influenced by the content. Sentences are split across multiple cards. Example usage: videos and assets using the Bento framework.

Anticipation is used to visually prepare and connect one scene to the next. Subtle exit and entrance movements are linked.

End cards deliver closing branding, messaging, and calls to action.

The logo can be expressed in full (wordmark + plus) or as just the plus. Example usage: video openings, end cards, interstitials.