Figma→Video AI workflow

Light Mode Launch in the Jam Mobile App

Today we launched Light Mode 🔆 in the Jam mobile app! Was excited to launch it and wanted to make a nice graphic to show everyone using the app what's new. I made it with Figma + AI tools (Claude + Veo3 Flow):

Steps to Create Your Own App Screen Animations Using AI:

  1. Export a Figma Frame: Start by exporting a Figma frame of the app.
  2. Upload to Claude: Upload the Figma frame to Claude, provide a prompt for what you want to accomplish.
  3. Use Veo3 Flow: Upload that frame and prompt to Veo3 Flow's Frame to Video tool.
  4. Final Touch: Done! Light Mode, on! 🔆

This was the prompt used (thanks Claude):

Create a premium iOS app launch animation that transforms these product stills into a cinematic reveal. The animation should be elegant with sophisticated 3D camera work and lighting.

Visual Treatment:

- Phones float weightlessly in 3D space with gentle rotation and subtle parallax depth
- Dramatic lighting shifts from soft ambient to focused spotlighting on key moments
- Premium materials: subtle reflections on glass, soft drop shadows, elegant glows around active elements
- Smooth easing curves throughout (ease-in-out, no linear motion)

Camera & Movement:

- Graceful orbital camera movement around the interfaces
- Shallow depth of field that guides focus
- Cinematic framing with negative space
- Seamless transition between the two app states

Constraints:

- DO NOT add new UI elements - only animate existing interface components
- Maintain authentic app functionality and visual hierarchy

Tone:

- Sophisticated, premium, worthy of a keynote reveal.

Dealing with Bugs

Dealing with bugs is 💩, but not with Jam.

Capture bugs fast, in a format that thousands of developers love.