HERO HELP

Preview in the Browser

  1. Preview in the browser to see effects, animations and interactivity in action
  2. You need at least one Hero Scene to preview
  3. Preview your composition in the browser by clicking Preview in the Hero plugin panel
  4. Copy and paste the provided URL to a browser of your choice

Previewing your Hero compositions

Seeing your interactions and animations in action is important in the creative process. Hero outputs production-ready code that can be run in any web browser (e.g. Firefox or Chrome).

Before preview

During preview and export only Hero Scenes will be processed. Hero Scenes are basically regular XD artboards with Hero superpowers (effects, animations and/or scrtips). So make sure you have at least converted one artboard to a Hero Scene before hitting preview.

Learn more about Hero Scenes.

How to preview in Hero

Clicking Preview in the Hero panel starts the preview.

The first time you hit Preview the preview URL will be shown. Copy this URL and open it in a web browser. Now you should see the fully animated and interactive preview of your composition.

You only have set up the URL in the browser once per session. Once set up clicking Preview refreshes the browser automatically.

If you want to access the URL again you click the Preview URL button in the Hero panel.