Virtual content

Documentation

It is our mission to make Vulp as user-friendly as possible for our valued customers, both during the implementation phase and for the end user. While we strive for intuitive use, we understand that a comprehensive manual can be invaluable, especially when you want to make the most of the extensive features that our 3D configurator has to offer.

For in-depth and detailed explanations, we invite you to consult our extensive documentation at https://docs.vulp.studio.

Basic Integration

We aspire to be the ‘YouTube’ for virtual products, aiming to make Vulp accessible to a wide audience, ranging from end-users to owners of webshops and websites. To facilitate this, we provide a directly implementable script from our CMS:

Automatically filled values in the sample code include customer name (customerId), product name (modelId), and language (lang).

Parameters

Shape the 3D configurator fully by adding parameters to the URL.

We categorize parameters into different sections:

  1. Style of virtual product
  2. Appearance of the Vulp viewer
  3. Camera settings
  4. Buttons and overlays
  5. Animations

Style of virtual product

Vulp offers a wide range of features to present your product catalog. Through parameters in the Vulp script, you can easily change colors and materials, and even add new colors.

Colors example

Also, adjust the lighting of the product, including reflection, illumination, and shadow, through parameters in the URL.

Appearance of Vulp viewer

Give the 3D configurator the appearance you desire. Turn buttons on and off, and customize the background color. Configure buttons to match the style of your website, including text color, background color, and border.

Customize viewer example

Adjust texts, set your own Augmented Reality message per product, and select the desired language via the URL of the Vulp iframe.

Additional product information

Vulp is perfectly suited to provide detailed information about a product, whether on a landing page or in a webshop. Through textual hotspots, you can highlight unique selling points with text and images. Want to emphasize the technical aspects of your product? Use the layers function to clearly display all dimensions in 3D. Activate the layers through parameters.

Layers Example

Camera settings

Adjust the position of the camera relative to the 3D model. Whether the model is free-standing or against a wall, you determine what the viewer can see through camera constraints in terms of rotation, zoom, and the camera’s starting point.

Animations

Vulp is an interactive 3D configurator. In addition to the ability to manipulate camera movements to view the 3D product from all angles or place it in your own environment with Augmented Reality, you can also apply animations to the 3D model itself. Think of movements to view the inside in an ’exploded view’ or realistic movements of your product. Almost anything is possible. With Vulp, you create your own interactive 3D animation. There are various ways these animations can be activated, via buttons, interaction with the 3D product, or automatically. Specify through parameters what the animation should do.

Animation Example

We continue to work on the development of our 3D configurator, constantly adding new features to make the 3D viewer suitable for e-commerce, landing pages, or interactive work descriptions. For a detailed description of all our features, we refer to our documentation website: https://docs.vulp.studio.

Available parameters

Parameter Description
Model styling
color Sets the default color of the product
color-<group> Sets the default color of a ‘color-group’ of the product
shadow-intensity Sets the intensity of the floor shadow
Configurator styling
background-color Sets the color of the background
menu-color Sets the color of the menu buttons
menu-fill-color Sets the color of the background of the menu buttons
menu-stroke-color Sets the color of the border of the menu buttons
menu-icon-color Sets the color of the icon in the menu buttons
hotspot-color Sets the color of information hotspots
tooltip-background-color Sets the background color of the ’tooltips’
tooltip-text-color Sets the text color of the ’tooltips’
Camera
auto-rotate Determine whether the product should rotate automatically
camera-orbit Sets the starting position of the camera
camera-target Sets the center point of the camera rotation
ar-placement Determine whether the virtual product is on the wall or on the floor
min-camera-orbit Set restrictions on camera movement
max-camera-orbit Set restrictions on camera movement
disable-zoom Determine whether you can zoom in/out or not.
disable-tap Determine whether you can tap to move the camera’s rotation center
ar-scale Determine whether you can scale the product in Augmented Reality
Buttons and overlays
menu Turn off the entire menu
color-button Turn off the color button(s)
overlay-button Turn off the overlay button
hotspot-button Turn off the information hotspot button
title Turn off the title/product name
hotspots Determine if hotspots are visible or not on opening
Animation
autoplay Determine if an animation should start automatically when opening Vulp

Contact us

info@vulp.studio

Foxmountain

+31 (0)617 375 018
De Stater 20
5737RV Lieshout
The Netherlands
X (Twitter) LinkedIn