Table of Contents

Learn all time-saving tricks in Pano2VR by dragging and dropping.

In the menu bar, you'll find more tools and shortcuts. The menu bar also changes for the Skin Editor.

Use the Toolbar at the top of the main project window to show or hide panels.

The Properties panel is where individual settings are set for the input image or video, the project, and for each of the Viewer Modes.

The center of Pano2VR contains the interactive panorama. Here you can view and interact with the panorama and use the Viewer Modes to add patches, hotspots, sounds, images, videos, and lens flares.

The Tour Browser holds and organizes all the panoramas in a tour. Each panorama is represented by a thumbnail image.

The Tour Map is used to not only add location information to nodes and to view node location, but it is also a place to link nodes together to create a tour using maps and floor plans.

The Output panel is where you choose output formats for your project. There is also a button to open the Gnome Cloud Browsers.

The Google Street View panel provides a way to easily upload a tour or single panoramas to Google Street View.

Use the Animation Editor to create self-playing interactive panoramas and 360º panoramic videos and to export animated 2D videos.

The History panel shows you a list of all the actions you've done. Plus, you can go back in history by clicking up the list (similar to Photoshop).

The Overview panel gives you an overview of the entire project.

The List View panel is handy for when you want to see all the elements that have been added in an easy-to-read list view.

The Viewer Settings show viewing options for the Viewer.

A skin, as a whole, is a graphical element (interface) that is layered over the panorama and can include images, maps, buttons, text, and sounds.

The Gnome Cloud is a service we provide that you can use to host your projects. Use the Browser to view projects and data associated with them.

Pano2VR has a modular interface which allows for custom layouts.

Pano2VR's user preferences/settings can be found in the Menubar. Choose File > Settings on Windows and Linux; and Pano2VR > Preferences on Mac OS.

The term, default view, is used to describe the initial view of a panorama when it is opened.

Panoramas should always be level. Otherwise, when we spin them, they will be very disorienting. When leveling, make sure the horizon is straight and that vertical lines are straight up and down.

Adding User Data is a crucial step in the workflow, especially for organization. Information added here, like Title, Description, and Copyright can be used in the skin and the HTML template.

If location data was not captured to the image while shooting, then you can add coordinates using the Tour Map.

After you have brought your images into Pano2VR, you can choose to convert them into a different format for faster loading with tiled TIFFs for gigapixel images and large projects, or to convert to a different image type, or even to convert the image to cube faces.

Tags provide a way to group nodes and filter them in the Tour Browser and to build menus in the Skin Editor.

Nodes in the Tour Browser can be filtered by tag, text, and distance.

Pano2VR will alert you about missing files (assets) in a project so they can be relocated and reconnected to the project.

Point Hotspots are points of interactivity of varying types in a VR tour and are added directly to the panorama in the Viewer.

Tooltips are the bit of text that appears when a mouse enters an element or area that uses them. They are widely used for node type hotspots and show the title of the next node or as information pop-up texts. They can also be used to simply show information.

Point Hotspots can be used to direct a user to an external URL (any file or webpage that exists outside of the project). The most basic of these is to link to a webpage/website.

Hotspots can be used to pop up images and to show information boxes. When Info and Image hotspots are added to a project, they can use a different skin graphic to represent them.

This process adds an *Info* type point hotspot that will pop up information text with a title and description. An icon for the text box can also be added. The hotspot and the info icon in the skin are connected via a hotspot template and a Skin-ID.

A video hotspot in conjunction with the Skin Editor can be used to pop up videos from a URL, Vimeo or YouTube and an external file.

Use a Point Hotspot to open a PDF file inside the project.

Learn how to create an animated point hotspot in the Skin Editor using a skin variable with a Timer.

Animate Point Hotspots to track objects in a video panorama.

Each hotspot can have its own image. The custom hotspot image can be added in the skin to affect all hotspots using hotspot templates. Or you can add a custom image to individual hotspots.

Learn how to create multiple states with a Mouse Over effect. We do this by converting an image patch into a point hotspot.

Point Hotspots are interactive points in a virtual tour that link panoramas, open websites, PDFs, videos, and informational texts. This article covers all the properties of a point hotspots.

Polygon hotspots require you to draw a shape as opposed to creating a single point of interactivity.

Polygon hotspots can be used to direct a user to an external URL (any file or webpage that exists outside of the project). The most basic of these is to link to a webpage/website.

Learn how to use Polygon Hotspots to link nodes.

Here you'll find the properties for the polygon hotspots which are found in the Properties panel once a hotspot is added or selected.

Use the Image Mode to pin images to the panorama. Here, you’ll find explanations of the Image properties.

Learn how to pin images to the panorama with correct distortion.

Use Sound Mode to add directional and static audio to your project. Here, you'll find explanations of the Sounds Mode properties.

Use the Sound Mode to add directional and static sounds to your project.

Audio can be tricky on the web due to the varying support of formats and how browsers handle audio playback. Read on to learn more about using audio in your projects.

The video mode will allow you to pin videos to your panoramas.

Use the Video Mode to pin video to a panorama.

Learn how to pin a web element. In this example we pin a Wikipedia page to a tour node.

Use the Web Element to pin web content to the panorama, like a YouTube video or web pages.

When you add a lens flare to your project, the Properties panel will open showing all the settings for lens flares.

Alternative audio files can be converted from within the Sound Mode's properties.

An alternative video file can be converted from within the Video Mode's properties.

Learn how to add a map to a virtual tour.

Learn how to add a floor plan to a tour.

Custom map tiles can be added in the Tour Map. These maps can then be used in the skin using the Map Element.

In order to use Google Maps in the Tour Map, or to add Place IDs for Street View, or to add a Google Map in the skin, you will need a Google Maps API key. Google requires this key for anyone wishing to use/embed their Maps JavaScript API (Google Maps).

Each map has different settings. Learn about them below.

The properties for a floor plan added to the Tour Map.

To upload a tour to Google Street View from Pano2VR, open the Google Street View Panel and connect your Google account. You'll then have access to all your images and tours. Here's the basic workflow for uploading a small tour to Google Street View.

If a tour includes multiple levels of a building, you can publish all levels to Google Street View and Google will link them with an elevator control.

A container is an invisible element that allows you to group elements together in the tree or in the editor.

The rectangle element can be drawn to any size. Use it as a button or as a screen tint. Or even as a fix to create active areas in 3D distorted hotspot images.

Text Box are for adding text to the skin. You can use basic HTML tags to format the text, or use CSS.

The image element is used to add images to the skin. Once you click on the Canvas, you'll be instructed to selected an image.

The button element provides multiple states of a button. Each state can have a different image which provides visual indications of interaction.

Click the *Add Scalable Vector Graphics* button in the Toolbar and then click in the Editor to choose a SVG file. Or, just drag the SVG in to the editor.

Lottie files are small animations designed to work on all devices. Use them for buttons and hotspots.

Use the PDF element to embed PDF documents in the skin.

Use the external image to add images that need to be loaded externally rather than embedded in to the skin. This is especially useful if you have a lot of thumbnails in a tour and are not using the Node Image element.

Use the Node Image Element to easily add thumbnail images from the current tour. This is especially useful for creating galleries or buttons from the images. Use this in conjunction with the Cloner to build a tour menu or gallery. Click in the canvas to add an image. A placeholder will appear. Go to the Node Image settings to choose the node.

A scroll area is a container that will add scrollbars around an element or group of elements, if necessary. It can also be used to clip content.

The cloner is a useful tool that creates lists for building menus. The cloner is used to create thumbnails of nodes within a tour, creating a thumbnail menu. The cloner is also used to create a multi-level menu, a multilingual menu, a menu of all hotspots, or a menu of all floor plans.

The timer is a container that is useful for timing actions in the skin. For example, you can use a timer to hide a Welcome Screen (or splash screen) after 5 seconds.

A hotspot template lets you add a custom image to a point hotspot.

Node Markers are used to show elements depending on the currently active panorama, or node, in a virtual tour.

Maps and Floor Plans can be easily added to the skin by selecting the Map Element in the Toolbar and clicking in the Canvas to add.

Use this to add videos to your skin. You can use local files, URLs or YouTube and Vimeo IDs.

Seekbars can be used to seek or move backwards and forwards in time for background sounds, all pinned sounds and videos of the project, as well as skin sounds and skin videos, and even 360° video panoramas (except embedded YouTube and Vimeo videos).

The code element is used to apply Javascript to the skin.

Use the Skin Editor to create and design interactive overlays.

Components are predefined skin elements that can be saved to the Components Toolbox and then reused in skins and shared.

In the actions section of the Actions/Modifiers tab in the Skin Editor, you'll find a column called Sources with a pop-up menu. These sources represent the triggers that cause the actions.

Actions or a set of directions can be applied to any element added to the skin to create interactivity.

Use modifiers to affect a skin element's behavior. Open the Modifiers panel and double-click in the table or click the plus sign to the right to open the Modifier Settings.

Here you'll find a few examples of common actions. You can assign actions to any element in the skin editor.

Action filters let you define conditions for the execution of actions assigned to an element.

Triggers are start of events for a condition of a logic block.

You can use logic blocks to create a responsive skin (where the skin elements scale to the player's width). This will require a logic block with multiple expressions.

Learn to use a logic block to hide elements when the player is active (when interacting with the panorama or skin). You use a timer that has a logic block by default.

Auto Tags are added to each input panorama automatically. Learn how to address these tags in the skin.

Learn how to add Google Fonts to your project.

Fonts can be embedded in Pano2VR’s skin. This means that the fonts are served locally, rather than fetching them from third-party servers like Google Fonts.

Learn how to create animated icons for point hotspots. This particular animated icon will consist of to rotating bars hinged at the center.

Learn how to use a couple of text boxes to create a 2-state button.

Learn how to create a custom image popup with a text box that expands to fit the amount of text.

The Web Output Properties open in the Properties panel. This is where you'll find options to use an Animation for auto-rotation, to choose a transition, and to enable VR.

The Garden Gnome Package (GGPKG) is a package format for offline viewing and for content management systems to easily embed your projects into websites.

The Gnome Cloud is a service we provide that you can use to host your projects. Upload a project to the cloud from the Web Output.

Pano2VR projects can be viewed in a head mounted display or VR headset through WebXR, Cardboard, or VRTourviewer.

Once you've created the animation in the Animation Editor, you can then output it by choosing the Animation output from the Output Panel. Below are all the output settings for Animation.

The Little Planet image is a stereographic projection that, that when manipulated in a way, resembles a photo of a tiny planet. Learn how to make one below.

Pano2VR allows you to create a thumbnail image from your panoramic image. To do this, choose Transformation from the Output panel.

Use Transformation to re-project the panorama to create a thumbnail preview image or an image for print.

The normal HTML template is the default template that Pano2VR will output when outputting an web output. Use the template settings to quickly configure it.

Edit this Garden Gnome Package HTML template to create a custom GGPKG output or select for Droplet use.

The integrated web server default settings are set to be used when viewing the output within an HTML page. It was included to allow local viewing of the web output (something most browsers do not allow for security reasons).