Skip to content
Orbit Docs

Design canvas to web prototype

← Learning Atlas · Path 14 of 22

6 ordered steps, from Figma to Retool.

Design and creative toolsNo-code / low-code platforms

  1. Step 1: Figma

    Figma starts the path because most collaborative product design begins with shared screens, components, and visual decisions.

  2. Step 2: Spline

    Spline adds 3D and interactive visual work, expanding the learner's idea of what can move from design into a web experience.

  3. Step 3: Framer

    Framer matters after Spline because it turns design assets and interactions into a publishable prototype surface.

  4. Step 4: Webflow

    Webflow shifts the journey from prototype feel toward production-like visual site building without hand coding every page.

  5. Step 5: Bubble

    Bubble comes next because it adds application logic and data workflows beyond Webflow's site-first strengths.

  6. Step 6: Retool

    Retool closes the path by showing a more operations-focused low-code endpoint for internal tools rather than public marketing pages.