TourBuilder

A visual authoring tool for <VideoTour> manifests — upload a floorplan, click to place rooms, wire up doorways, and export a real, validated tour.json instead of hand-writing one.

SlugTitleStart room

Floorplan

Drag and drop files here, or click to browseSingle file · image/*

Media pool (0 files)

Drag and drop files here, or click to browseMultiple files supported · video/*,image/*

Export

Slug is required.
Title is required.
Add at least one room (click the floorplan to place one).
Start room must be set to one of the tour's rooms.

{
  "slug": "",
  "title": "",
  "startRoom": "",
  "rooms": []
}

Usage

import { TourBuilder } from "@/components/TourBuilder";

// Starts from a blank tour; pass initialTour to touch up an existing one.
<TourBuilder />

// The exported tour.json is the exact shape <VideoTour> consumes:
// import { VideoTour } from "@/components/VideoTour";
// <VideoTour manifest={tour} />