Quick tour of the design editor

A short walkthrough of the full Shaders workflow, from designing on the infinite canvas to exporting code.

What's covered

  • Exploring the design editor and the infinite canvas
  • Creating and comparing several variations of a shader
  • Previewing designs at different screen sizes
  • Editing shaders with drag-and-drop controls
  • Customizing components and their effects
  • Building responsive versions for desktop and mobile
  • Exporting code for your project

Key concept

The editor is built for iteration. Try several ideas side by side, check them at each screen size, and export code when one works.