CurveLab starting points.

Step 1

Launch CurveLab

Open the browser editor from Home. This is the fastest path into the current CurveLab workspace at app.curvelab.app.

Step 2

Generate editable keyframes

Prompt AI with the object, motion goal, duration, and feel you want. Treat the result as an editable first draft.

Step 3

Import website text

Paste a URL, preview the page, select a heading or paragraph, and bring it into CurveLab as native editable text.

Step 4

Create a responsive variant

Create a size-aware motion state for a layout that changes between desktop and mobile, then preview the behavior before handoff.

AI Keyframes

Describe the motion you want and let CurveLab draft the animation beats.

• Best for turning a static design idea into a first animation pass.
• Include the subject, direction, timing, and emotional feel in the prompt.
• Review the result as editable motion, not a final black box.

Responsive Variants

Design responsive motion states for different sizes without rebuilding the scene.

• Use when a desktop motion path does not translate cleanly to smaller screens.
• Create variants for meaningful layout shifts, not every tiny breakpoint.
• Preview size-specific behavior before exporting or handing off.

Motion Triggers

Connect interactions, scroll positions, and states to animation timelines.

• Use triggers for interaction-driven animation instead of fixed playback only.
• Map each trigger to a clear state change, scroll position, or user action.
• Keep trigger names readable so the handoff stays understandable.

HTML Import

Import live website text into CurveLab as editable motion-ready text.

• Paste a URL and preview the page before importing.
• Click headings or paragraphs to convert them into native text layers.
• Preserve responsive sizing and line wrapping for production export.

Animate a landing hero

Start with the main object, create the entrance movement, tune easing, then add a secondary detail so the hero feels intentional.

• Choose one primary motion idea before adding supporting animation.
• Keep the first pass short enough to preview repeatedly.
• Use easing changes before adding extra keyframes.

Build triggered motion

Create a named trigger, connect it to a timeline state, then test the transition from the default state and back.

• Name triggers after user intent, such as Hover Reveal or Scroll Intro.
• Keep triggered motion reversible when the UI state can reverse.
• Document the expected trigger in the exported handoff notes.

From HTML to motion

Import website text, animate the key elements, then verify responsive behavior before export.

• Choose the heading or paragraph that needs motion.
• Animate the native text layer first.
• Check mobile and desktop variants before sharing.

Example gallery

Reusable starter scenes for hero reveals, product cards, scrolling moments, and state changes.

Video walkthroughs

Short walkthroughs for AI keyframes, HTML Import, responsive variants, trigger setup, and export handoff.

Interactive onboarding

A guided in-app checklist can come later once the browser editor owns more first-run state.