Skip to main content

Widget Tutorials

Hands-on walkthroughs for building custom widgets in the Widget Creator. Each one is self-contained and you can copy the code straight in.

  1. Build your first widget — from an empty widget to one on your overlay. You'll write a template, add a configurable property, preview it, build it, and place it. Start here.
  2. React to live events — make a widget respond to your stream: declare a binding, handle a follow, and test it with the simulator before you're live.
  3. Publish to the Workshop — add catalogue art and a description, build, publish, and share your widget by code so others can install it.
tip

You don't need to be a strong programmer to follow these. The Widget Creator has live preview and a simulator, so you can change a line, watch what happens, and learn by poking at it.

Before you start, it helps to skim The Widget Creator so the editor layout makes sense.