Skip to content

Guide · Agent skill

How to use the 3D Virtual Tour agent skill (3d-virtual-tour)

Updated · written with AI from the project's own documentation and checked against our catalogue data

The 3d-virtual-tour skill gives an AI coding agent detailed guidance for building interactive walkthroughs of 3D spaces such as buildings, showrooms, museums and real-estate listings, usually with Three.js. After reading this guide you will know what the skill changes, how to install it, how to ask for it in plain language, and what you still need a developer to build. The skill provides implementation instructions, not a finished tour.

3D Virtual Tour BuilderMengTo/Skills · MIT

Quick start

  1. 1Download the ZIP. Get the 3d-virtual-tour ZIP from the directory page. It contains agents/openai.yaml, REFERENCES.md and SKILL.md.
  2. 2Unzip into the skills folder. Unzip the files into ~/.claude/skills/ for all projects, or into a project's .claude/skills/ folder for one project.
  3. 3Or upload it in the Claude apps. In the Claude apps, open Settings, then Capabilities, then Skills, and upload the skill there.
  4. 4Describe your space. Ask for a tour in plain language, naming the building or room types, your renderer such as Three.js, and the navigation you need.
  5. 5Review and test the result. Run the generated tour in a browser, complete the route forward and back, and check the camera for wall or doorframe clipping.

What the skill makes the agent do

Once installed, the agent follows the skill's guidance when you ask for a virtual tour. It helps plan a guided camera route, room lists and floor-plan navigation, orbit inspection of a model, and smooth transitions between modes. The guidance also covers avoiding camera clipping through walls and keeping navigation controls accessible.

The skill organises a tour into four navigation modes: guided tour, room destination, inspect, and free walk. Free walk is added only when you request it or the project requires it. Orbit controls alone do not make an interior walkable.

  • Guided tour: an authored route with scroll, play/pause or previous/next stops
  • Room destination: room list, hotspot or floor plan selection
  • Inspect: bounded orbit controller with drag, pinch, zoom and return
  • Free walk: first-person controller with collision, only when requested

Install the skill from the ZIP or the Claude apps

Download the ZIP for the skill from the directory page. The skill's folder contains agents/openai.yaml, REFERENCES.md and SKILL.md. Unzip it into one of two locations depending on how you want it available.

To make the skill available to all your projects, unzip it into ~/.claude/skills/. To make it available only inside one project, unzip it into that project's .claude/skills/ folder. If you use the Claude apps instead, upload the skill under Settings, then Capabilities, then Skills.

  • Personal: ~/.claude/skills/
  • Single project: .claude/skills/ inside the project folder
  • Claude apps: Settings → Capabilities → Skills

Trigger the skill with natural requests

You do not need special syntax. Describe the space and what the viewer should do in it. The skill's description covers architectural walkthroughs, real-estate tours, museums, showrooms and explorable spaces built with Three.js or a similar renderer, so requests that name one of these are the clearest triggers.

Be specific about the renderer and the source material. The skill assumes a 3D renderer such as Three.js and a web project that can load 3D assets. If you only have panoramic photos, say so, because the skill recommends linked panorama viewpoints rather than implied geometric depth.

  • Plan a guided walkthrough of a three-floor office building using Three.js
  • Add a room list and floor-plan links to my existing showroom viewer
  • Make an orbit inspection mode for a product model that returns to the guided tour
  • Review my camera path for clipping through doorframes

Check the requirements and safety notes

The skill needs Three.js or a similar 3D renderer and a web project capable of loading 3D assets. According to the listing, it runs no scripts and makes no network requests. It is a set of written instructions for the agent, so it does not install packages or fetch files on its own.

The output is implementation work. A developer needs to build it, run it and check it, especially camera paths, collision clearance and touch behaviour on real devices. Read the generated code as you would any other code before you deploy it.

  • Renderer: Three.js or similar
  • Project: a web app that can load 3D assets
  • Scripts run by the skill: none listed
  • Network use by the skill: none listed

Tips for better results

Give the agent your existing scene details: coordinate system, scale, floor elevations, door openings and the asset-loading path. The skill asks the agent to inspect these first and to preserve existing architecture and interactions, so the more it knows, the fewer assumptions it makes.

Plan for accessibility and verification from the start. The skill asks for keyboard-accessible room lists, labelled hotspots, visible focus and a visible Return button to leave inspection. Its verification checklist includes completing the route forward and back.

  • Name the rooms and stop order you need before asking for the route
  • Ask for a clear world-to-plan transform if you have a floor plan
  • Request reduced-motion behaviour and touch handling explicitly
  • Test the full route in both directions after changes

What people use it for

  • Architectural walkthrough of a building with a guided camera route and floor-plan links to each room
  • Real-estate listing with room cards, orbit inspection of the property model and a return to the guided tour
  • Museum or showroom tour where room labels, hotspots and a chapter rail stay in sync
  • Planning how a 3D space should be navigated before a developer starts implementation

Frequently asked questions

How do I install the 3d-virtual-tour skill?

Download the ZIP from the directory page and unzip it into ~/.claude/skills/ for all projects, or into a project's .claude/skills/ folder for one project. If you use the Claude apps, upload it under Settings, then Capabilities, then Skills.

Is the 3d-virtual-tour skill free?

The listing states the skill is licensed under MIT. Check the licence file in the download for the full terms before you use it in a commercial project.

What do I need to use this skill?

You need Three.js or a similar 3D renderer and a web project that can load 3D assets. The skill is written for that setup and does not provide a finished tour on its own.

Does the skill run scripts or use the network?

According to the listing, the skill runs no scripts and uses no network. It contains written guidance for the agent, so you still need to review any code the agent produces.

Can I use it to make a tour without coding?

Not on its own. The output is implementation work that a developer needs to build, run and check. Non-technical users wanting a finished tour without code should look for a hosted tour product instead.

Should I use this skill for a simple 360-degree photo viewer?

No. The skill recommends linked panorama viewpoints for panorama-only sources rather than building a full 3D tour. A simple panorama viewer is a better fit for that case.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

Use this skill if you are a front-end developer or a design team building architectural walkthroughs, real-estate 3D tours or museum viewers in Three.js and want detailed guidance on routes, room navigation, orbit inspection and accessibility. Skip it if you only need a 360-degree photo viewer, want a finished tour without coding, or are building a free-walk game or a product that needs real collision.

Download the skill