loomgui.com ↗

Mock mode

Mock mode lets you work on UI without entering Unity Play mode. It is ideal for layout, animation, visual states, and designer review.

Why use mock mode

  • Vite reloads quickly.
  • Scenarios make hard-to-reach UI states easy to reproduce.
  • Frontend developers can work without opening Unity.
  • Designers can review flows in a browser.

Configure mocks

Your UI app calls bootBridge during startup. When there is no live Loom connection, provide mock state and action implementations:

bootBridge({
  mock: {
    state: {
      currentScreen: 'MainMenu',
      playerName: 'Avery',
    },
    actions: {
      startGame: async () => {
        console.log('mock startGame');
      },
    },
  },
});

Keep mock state close to the real bridge shape. Regenerate types after changing the C# bridge so mocks stay honest.

Add scenarios

Use scenarios for common UI states:

bootBridge({
  mock: {
    scenarios: {
      'Main menu': { currentScreen: 'MainMenu' },
      'Combat HUD': { currentScreen: 'Hud', health: 42 },
      'Paused': { currentScreen: 'Pause' },
    },
  },
});

Scenarios should describe product states, not implementation details. Good scenario names are the same words a designer or QA tester would use.

When to switch back to Unity

Use Play mode when you need real gameplay data, real actions, scene changes, input integration, or player-build behavior. Mock mode is for speed; Unity is the source of truth.