Digital Bacon

Introduction

Digital Bacon is an application to create beautiful immersive 3D websites that run on your phone, computer, and VR headset. Some parts of constructing a 3D virtual world may be unfamiliar to you, so this guide hopes to make understanding these new concepts a little easier

Getting Started

Getting started is easy, just go to https://digitalbacon.io/app and click on the start button!

Moving Around

Moving around varies depending on what type of device you are on. Please see the appropriate section for your device

Computer
Mobile / Tablet
VR Headset

Joystick controls are specific to your left or right hand. You can swap them under Editor Settings in the menu

Visual Editing

Visual Editing varies depending on if you are on a VR headset or not. Please see the appropriate section for your device

Computer / Mobile / Tablet

To begin editing assets on your device, bring your mouse over the object you want to edit and click on it (or just tap on it for mobile + tablet users)

Now the editing pane should appear on the left and the asset should have the transformation widget attached to it. See the following table for what you can do with each of the editing options

Place Clicking on the surface of any asset in the scene will place the active asset there. Afterwards, the editing mode will reset to the most recent one
Move Clicking on different parts of the transformation widget and then dragging the mouse will move the asset in the following ways
  • The red, green, and blue arrows move the asset along the x, y, and z axes respectively
  • The squares between the arrows let you move it along both axes at the same time
  • The center of the widget allows you to move the asset up/down/left/right relative to the screen
Rotate Clicking on different parts of the transformation widget and then dragging the mouse will rotate the asset in the following ways
  • The red, green, and blue circles rotate the asset along the x, y, and z axes respectively
  • The outer circle rotate the asset around the direction the screen is facing
Scale Clicking on different parts of the transformation widget and then dragging the mouse will scale the asset in the following ways
  • The red, green, and blue cubes scale the asset along the x, y, and z axes respectively
  • The squares between the cubes let you scale it along both axes at the same time
  • The center of the widget allows you to scale the whole asset at the same time
Clone Creates a copy of the active asset and places it slightly farther towards the screen and right side
Delete Deletes the active asset
Close Closes the Visual Editing Pane
VR Headset

There are different "Hand Tools" that change the way in which you can visually edit assets. These tools can be chosen from within the Menu. See the following table for what each tool allows

  • Grabbing it using the Grip button
  • Pointing towards it and pressing down on the trigger
  • Edit When using the edit tool you can
    • Grab assets to move and rotate them
    • Grab assets with both hands to scale them up or down
    Copy / Paste With this tool you can
    • Copy an asset with the left controller by either grabbing it or pointing at it and then pressing down the trigger
    • Paste the asset wherever the preview is by pressing the grip of the right hand
    • If your right controller is pointing towards the surface of another asset, you can paste it on that surface by pressing down on the right hand's trigger
    Delete Delete an asset with either hand by
    Translate Assets grabbed with the grip button can be moved around without affecting their rotation
    Rotate Assets grabbed with the grip button can be rotated without affecting their position
    Scale Assets grabbed with the grip button can be scaled up/down by moving that hand farther/closer to the asset's location

    The Menu

    Computer, Mobile, and Tablet users can pull up the menu by pressing the menu button at the top right corner of the screen

    VR Users can pull up the menu by using the primary button on either controller. You can grab the menu to move it around and interact with menu items by pointing at them and pressing down on the trigger

    The Menu can be broken down into the following five sections

    Hand Tools

    Specific for VR Headset Users. Please see section above for what each tool does

    Library

    Where you can edit all of the assets in your website. For more information on how you can configure different asset types through the menu, see the relevant sections for Models, Images, Shapes, Lights, Materials, Textures, Text, Audio, Video, Components, Systems, and Other Assets

    Settings

    In this section you can change the background (skybox) of your website, the settings your website's users will have, your own settings while editing your website, and update your avatar

    Project File

    Where you can save / load your project file to your device or Google Drive. You can also start a new project without any assets besides ambient lighting

    Connect with Peers

    This section allows you to host/join multi-user experiences and visit or edit websites with your friends

    Models

    All models have the following parameters that can be edited in the menu

    Visually Edit

    Checkbox

    Enables visual editing for the asset

    Position

    Numbers

    Location of the asset along the x, y, and z axes

    Rotation

    Numbers

    Orientation of the asset represented as Euler Angles

    Scale

    Numbers

    How much the asset is stretched along the x, y , and z axes

    Render Order

    Number

    The order in which assets are rendered. Useful when trying to prevent transparent assets from hiding behind one another (learn more)

    Images

    All images have the following parameters that can be edited in the menu

    Visually Edit

    Checkbox

    Enables visual editing for the asset

    Double Sided

    Checkbox

    If checked, the image will be visible from both sides, otherwise just one

    Position

    Numbers

    Location of the asset along the x, y, and z axes

    Rotation

    Numbers

    Orientation of the asset represented as Euler Angles

    Scale

    Numbers

    How much the asset is stretched along the x, y , and z axes

    Render Order

    Number

    The order in which assets are rendered. Useful when trying to prevent transparent assets from hiding behind one another (learn more)

    Shapes

    Digital Bacon provides the following list of shapes you can add to your website

    Click on any of these links to jump straight to the shape you're interested in

    Box
    Visually Edit

    Checkbox

    Enables visual editing for the asset

    Material

    Material Selection

    Selects the material used for the shape. The material affects the shape's color and appearance. For more details on what they can do, see the Materials section below

    Width

    Number

    Length of the box along its x-axis

    Height

    Number

    Length of the box along its y-axis

    Depth

    Number

    Length of the box along its z-axis

    Width Segments

    Number

    How many segments the width of the box is made up of. This affects the wireframe of the box which has implications for certain Material properties

    Height Segments

    Number

    How many segments the height of the box is made up of. This affects the wireframe of the box which has implications for certain Material properties

    Depth Segments

    Number

    How many segments the depth of the box is made up of. This affects the wireframe of the box which has implications for certain Material properties

    Position

    Numbers

    Location of the asset along the x, y, and z axes

    Rotation

    Numbers

    Orientation of the asset represented as Euler Angles

    Scale

    Numbers

    How much the asset is stretched along the x, y , and z axes

    Render Order

    Number

    The order in which assets are rendered. Useful when trying to prevent transparent assets from hiding behind one another (learn more)

    Circle
    Visually Edit

    Checkbox

    Enables visual editing for the asset

    Material

    Material Selection

    Selects the material used for the shape. The material affects the shape's color and appearance. For more details on what they can do, see the Materials section below

    Radius

    Number

    The length from the center of the circle to its edge

    Sides

    Number

    How many sides make up the edge of the circle

    Degrees

    Number

    How many degrees of the circle are visible

    Position

    Numbers

    Location of the asset along the x, y, and z axes

    Rotation

    Numbers

    Orientation of the asset represented as Euler Angles

    Scale

    Numbers

    How much the asset is stretched along the x, y , and z axes

    Render Order

    Number

    The order in which assets are rendered. Useful when trying to prevent transparent assets from hiding behind one another (learn more)

    Cone
    Visually Edit

    Checkbox

    Enables visual editing for the asset

    Material

    Material Selection

    Selects the material used for the shape. The material affects the shape's color and appearance. For more details on what they can do, see the Materials section below

    Height

    Number

    How tall the cone is

    Radius

    Number

    The length from the center of the cone's circular base to its edge

    Sides

    Number

    How many sides make up the edge of the cone's circular base

    Height Segments

    Number

    How many segments the height of the cone is made up of. This affects the wireframe of the cone which has implications for certain Material properties

    Degrees

    Number

    How many degrees of the cone are visible

    Open Ended

    Checkbox

    Removes the circular base of the cone if checked

    Position

    Numbers

    Location of the asset along the x, y, and z axes

    Rotation

    Numbers

    Orientation of the asset represented as Euler Angles

    Scale

    Numbers

    How much the asset is stretched along the x, y , and z axes

    Render Order

    Number

    The order in which assets are rendered. Useful when trying to prevent transparent assets from hiding behind one another (learn more)

    Cylinder
    Visually Edit

    Checkbox

    Enables visual editing for the asset

    Material

    Material Selection

    Selects the material used for the shape. The material affects the shape's color and appearance. For more details on what they can do, see the Materials section below

    Height

    Number

    How tall the cylinder is

    Top Radius

    Number

    The length from the center of the cylinder's top circular face to its edge

    Bottom Radius

    Number

    The length from the center of the cylinder's bottom circular face to its edge

    Sides

    Number

    How many sides make up the cylinder's curved surface

    Height Segments

    Number

    How many segments the height of the cylinder is made up of. This affects the wireframe of the cylinder which has implications for certain Material properties

    Degrees

    Number

    How many degrees of the cylinder are visible

    Open Ended

    Checkbox

    Removes both circular ends of the cylinder if checked

    Position

    Numbers

    Location of the asset along the x, y, and z axes

    Rotation

    Numbers

    Orientation of the asset represented as Euler Angles

    Scale

    Numbers

    How much the asset is stretched along the x, y , and z axes

    Render Order

    Number

    The order in which assets are rendered. Useful when trying to prevent transparent assets from hiding behind one another (learn more)

    Plane
    Visually Edit

    Checkbox

    Enables visual editing for the asset

    Material

    Material Selection

    Selects the material used for the shape. The material affects the shape's color and appearance. For more details on what they can do, see the Materials section below

    Width

    Number

    Length of the plane along its x-axis

    Height

    Number

    Length of the plane along its y-axis

    Width Segments

    Number

    How many segments the width of the plane is made up of. This affects the wireframe of the plane which has implications for certain Material properties

    Height Segments

    Number

    How many segments the height of the plane is made up of. This affects the wireframe of the plane which has implications for certain Material properties

    Position

    Numbers

    Location of the asset along the x, y, and z axes

    Rotation

    Numbers

    Orientation of the asset represented as Euler Angles

    Scale

    Numbers

    How much the asset is stretched along the x, y , and z axes

    Render Order

    Number

    The order in which assets are rendered. Useful when trying to prevent transparent assets from hiding behind one another (learn more)

    Ring
    Visually Edit

    Checkbox

    Enables visual editing for the asset

    Material

    Material Selection

    Selects the material used for the shape. The material affects the shape's color and appearance. For more details on what they can do, see the Materials section below

    Inner Radius

    Number

    The length from the center of the ring to its inner edge

    Outer Radius

    Number

    The length from the center of the ring to its outer edge

    Sides

    Number

    How many sides make up each edge of the ring

    Radius Segments

    Number

    How many segments there are between the inner and outer radius of the ring. This affects the wireframe of the ring which has implications for certain Material properties

    Degrees

    Number

    How many degrees of the ring are visible

    Position

    Numbers

    Location of the asset along the x, y, and z axes

    Rotation

    Numbers

    Orientation of the asset represented as Euler Angles

    Scale

    Numbers

    How much the asset is stretched along the x, y , and z axes

    Render Order

    Number

    The order in which assets are rendered. Useful when trying to prevent transparent assets from hiding behind one another (learn more)

    Sphere
    Visually Edit

    Checkbox

    Enables visual editing for the asset

    Material

    Material Selection

    Selects the material used for the shape. The material affects the shape's color and appearance. For more details on what they can do, see the Materials section below

    Radius

    Number

    The length from the center of the sphere to its edge

    Horizontal Sides

    Number

    How many sides make up the surface of the sphere horizontally

    Vertical Sides

    Number

    How many sides make up the surface of the sphere vertically

    Horizontal Degrees

    Number

    How many degrees of the sphere are visible horizontally

    Vertical Degrees

    Number

    How many degrees of the sphere are visible vertically

    Position

    Numbers

    Location of the asset along the x, y, and z axes

    Rotation

    Numbers

    Orientation of the asset represented as Euler Angles

    Scale

    Numbers

    How much the asset is stretched along the x, y , and z axes

    Render Order

    Number

    The order in which assets are rendered. Useful when trying to prevent transparent assets from hiding behind one another (learn more)

    Torus
    Visually Edit

    Checkbox

    Enables visual editing for the asset

    Material

    Material Selection

    Selects the material used for the shape. The material affects the shape's color and appearance. For more details on what they can do, see the Materials section below

    Radius

    Number

    The length from the center of the torus to center of the tube

    Tube Radius

    Number

    The length from the tube's center to its edge

    Radial Sides

    Number

    How many sides make up the torus (2 would turn the torus into a ring)

    Tubular Sides

    Number

    How many sides make up the edge of the torus

    Degrees

    Number

    How many degrees of the torus are visible

    Position

    Numbers

    Location of the asset along the x, y, and z axes

    Rotation

    Numbers

    Orientation of the asset represented as Euler Angles

    Scale

    Numbers

    How much the asset is stretched along the x, y , and z axes

    Render Order

    Number

    The order in which assets are rendered. Useful when trying to prevent transparent assets from hiding behind one another (learn more)

    Lights

    Digital Bacon provides the following list of lights you can add to your website. Lights that have visual editing enabled have a visual marker while editing your website. These markers will not appear when you host your website

    Click on any of these links to jump straight to the type of light you're interested in

    Ambient

    Ambient lighting will illuminate all assets equally without any sense of directional light

    Visually Edit

    Checkbox

    Enables visual editing for the asset

    Color

    Color Selection

    Sets the color for the lighting

    Intensity

    Number

    How intense the lighting is

    Position

    Numbers

    Only affects visual marker

    Location of the asset along the x, y, and z axes

    Rotation

    Numbers

    Only affects visual marker

    Orientation of the asset represented as Euler Angles

    Scale

    Numbers

    Only affects visual marker

    How much the asset is stretched along the x, y , and z axes

    Basic

    Basic lighting acts like a lightbulb emitting light in all directions originating from its location

    Visually Edit

    Checkbox

    Enables visual editing for the asset

    Color

    Color Selection

    Sets the color for the lighting

    Intensity

    Number

    How intense the lighting is

    Distance

    Number

    The maximum range of the lighting. If set to 0, there will be no limit

    Decay

    Number

    The amount the light dims along the distance of the light

    Position

    Numbers

    Location of the asset along the x, y, and z axes

    Rotation

    Numbers

    Only affects visual marker

    Orientation of the asset represented as Euler Angles

    Scale

    Numbers

    Only affects visual marker

    How much the asset is stretched along the x, y , and z axes

    Materials

    Materials set the color and appearance of any asset that applies them

    Click on any of these links to jump straight to the material you're interested in

    Basic

    A Basic material provides a coloring that is not affected by lights. This makes it so shapes that use this material have no discernable corners/edges and appear flat

    Color

    Color Selection

    Sets the color of the material

    Texture Map

    Texture Selection

    Optional

    Selects the texture that will be used to apply additional coloring on the material. If a non-white color has been selected for the material, the appearance will look like a blend between the texture and that color

    Display

    Sides

    Selects what sides of the material are visible. If Front or Back Side is selected, the opposite side will be see through

    Transparent

    Checkbox

    Enables transparency for the material. If a texture map that uses a png with transparency is selected, that transparency will be appied to this material. Additionally transparency can be added to the whole material using the opacity field or just in certain places by using an Alpha Map

    Opacity

    Number

    How opaque the whole material is. 1 is fully opaque and 0 is invisible. Must have Transparent checked to have any effect

    Alpha Map

    Texture Selection

    Optional

    Selects the texture that will be used to determine the transparency of the material. Black areas will make the material fully transparent while white colors will make it fully opaque. All other colors are treated as grayscale and set the transparency based on its closeness to black/white

    Wireframe

    Checkbox

    If checked, will only display the wireframe of the asset the material is applied to

    Environment Map

    Texture Selection

    Optional

    Selects the texture that will be used to display a reflection off the material. If set, "Color & Environment Blend", "Reflectivity", and "Refraction Ratio" will all affect the appearance of the environment map

    Color & Environment Blend

    Blends

    Determines how the surface's color is combined with the environment map. If Mix is chosen, Reflectivity is used to blend between the two colors

    Reflectivity

    Number

    How much the environment map affects the surface to create a reflection. 0 means it has no reflection and 1 means it is fully reflective

    Refraction Ratio

    Number

    The ratio of the Index of Refraction (IOR) of air divided by the IOR of the material. Only has an affect when the environment map texture has a Mapping set to Refraction

    Standard

    A material that can create metalic/rough looking surfaces. This material is more graphically accurate at the expense of being less efficient for the computer to run

    Color

    Color Selection

    Sets the color of the material

    Texture Map

    Texture Selection

    Optional

    Selects the texture that will be used to apply additional coloring on the material. If a non-white color has been selected for the material, the appearance will look like a blend between the texture and that color

    Display

    Sides

    Selects what sides of the material are visible. If Front or Back Side is selected, the opposite side will be see through

    Transparent

    Checkbox

    Enables transparency for the material. If a texture map that uses a png with transparency is selected, that transparency will be appied to this material. Additionally transparency can be added to the whole material using the opacity field or just in certain places by using an Alpha Map

    Opacity

    Number

    How opaque the whole material is. 1 is fully opaque and 0 is invisible. Must have Transparent checked to have any effect

    Alpha Map

    Texture Selection

    Optional

    Selects the texture that will be used to determine the transparency of the material. Black areas will make the material fully transparent while white colors will make it fully opaque. All other colors are treated as grayscale and set the transparency based on its closeness to black/white

    Wireframe

    Checkbox

    If checked, will only display the wireframe of the asset the material is applied to

    Bump Map

    Texture Selection

    Optional

    Selects the texture that will be used to simulate depth in the material with respect to lighting. The actual shape of the asset is unaffected

    Bump Scale

    Number

    How much the bump map affects the material

    Displacement Map

    Texture Selection

    Optional

    Selects the texture that displaces the assets vertices. This affects the actual shape of the asset

    Displacement Scale

    Number

    How much the displacement map affects the material

    Displacement Bias

    Number

    The offset of the displacement map

    Emissive Color

    Color Selection

    Sets the emissive color of the material. This is the color that is emitted (glows) from the material without lighting

    Emissive Map

    Texture Selection

    Optional

    Selects the texture that will be used to apply additional emissive coloring on the material. If a non-white color has been selected for the material emissive color, the emissive appearance will look like a blend between the texture and that color

    Emissive Intensity

    Number

    Intensity of the emissive lighting

    Environment Map

    Texture Selection

    Optional

    Selects the texture that will be used to display a reflection off the material. If set, "Environment Intensity" will all affect the appearance of the environment map

    Environment Intensity

    Number

    Intensity of the environment map

    Metalness

    Number

    How much the material looks like a metal. 0 will give a non-metallic appearance like for stone and wood, while 1 will give a very metallic look

    Metalness Map

    Texture Selection

    Optional

    Selects the texture that will be used to affect the metalness of the material. Areas that have the blue channel of the image being higher will appear more metal-like than areas without blue

    Normal Map

    Texture Selection

    Optional

    Selects the texture that will be used to augment the colors of the material with respect to the direction the surface faces

    Normal Type

    Normal Spaces

    If set to Tangent, the color of any portion of the surface is determined by the direction that surface faces. If set to Object, the color of the whole material is determined by the direction the asset itself faces. Material color can still be augmented by the Normal Map for both Normal Types

    Roughness

    Number

    How rough the material appears. 0 gives a smooth mirror reflection while 1 would give it a fully diffused appearance

    Roughness Map

    Texture Selection

    Optional

    Selects the texture that will be used to affect the roughness of the material. Areas that have the green channel of the image being higher will appear more rough than areas without green

    Toon

    A material that gives off a cartoon appearance

    Color

    Color Selection

    Sets the color of the material

    Texture Map

    Texture Selection

    Optional

    Selects the texture that will be used to apply additional coloring on the material. If a non-white color has been selected for the material, the appearance will look like a blend between the texture and that color

    Display

    Sides

    Selects what sides of the material are visible. If Front or Back Side is selected, the opposite side will be see through

    Transparent

    Checkbox

    Enables transparency for the material. If a texture map that uses a png with transparency is selected, that transparency will be appied to this material. Additionally transparency can be added to the whole material using the opacity field or just in certain places by using an Alpha Map

    Opacity

    Number

    How opaque the whole material is. 1 is fully opaque and 0 is invisible. Must have Transparent checked to have any effect

    Alpha Map

    Texture Selection

    Optional

    Selects the texture that will be used to determine the transparency of the material. Black areas will make the material fully transparent while white colors will make it fully opaque. All other colors are treated as grayscale and set the transparency based on its closeness to black/white

    Wireframe

    Checkbox

    If checked, will only display the wireframe of the asset the material is applied to

    Bump Map

    Texture Selection

    Optional

    Selects the texture that will be used to simulate depth in the material with respect to lighting. The actual shape of the asset is unaffected

    Bump Scale

    Number

    How much the bump map affects the material

    Displacement Map

    Texture Selection

    Optional

    Selects the texture that displaces the assets vertices. This affects the actual shape of the asset

    Displacement Scale

    Number

    How much the displacement map affects the material

    Displacement Bias

    Number

    The offset of the displacement map

    Emissive Color

    Color Selection

    Sets the emissive color of the material. This is the color that is emitted (glows) from the material without lighting

    Emissive Map

    Texture Selection

    Optional

    Selects the texture that will be used to apply additional emissive coloring on the material. If a non-white color has been selected for the material emissive color, the emissive appearance will look like a blend between the texture and that color

    Emissive Intensity

    Number

    Intensity of the emissive lighting

    Normal Map

    Texture Selection

    Optional

    Selects the texture that will be used to augment the colors of the material with respect to the direction the surface faces

    Normal Type

    Normal Spaces

    If set to Tangent, the color of any portion of the surface is determined by the direction that surface faces. If set to Object, the color of the whole material is determined by the direction the asset itself faces. Material color can still be augmented by the Normal Map for both Normal Types

    Textures

    Textures are images that have been configured for use by materials to alter their look and appearance

    Click on any of these links to jump straight to the type of texture you're interested in

    Basic

    A Basic Texture is comprised of a single image with parameters to repeat the image both vertically and horizontally if desired

    Image

    Image Selection

    Optional

    Selects the image that will be used for the texture. If left blank, it will default to being all black

    Horizontal Wrapping

    Wrapping Type

    Determines if the texture is repeated horizontally, and if the repetition is mirrored or not

    Vertical Wrapping

    Wrapping Type

    Determines if the texture is repeated vertically, and if the repetition is mirrored or not

    Horizontal Repeat

    Number

    How many times the image is repeated within the texture. If greater than 1 and Horizontal Wrapping is set to "Clamp", then the left and right edges of the image will stretch until the end of the texture in those directions

    Vertical Repeat

    Number

    How many times the image is repeated within the texture. If greater than 1 and Vertical Wrapping is set to "Clamp", then the top and bottom edges of the image will stretch until the end of the texture in those directions

    Horizontal Offset

    Number

    How much a single repetition of the image is offset towards the left

    Vertical Offset

    Number

    How much a single repetition of the image is offset towards t he bottom

    Cube

    A Cube Texture is a series of 6 images that map to the surface of a cube. Used for defining environment maps

    Images

    Image Selection

    Optional

    Selects the images that will be used for the texture. All images must be the same size and type. If left blank or any images do not have the same size + type of the others, it will default to being all black

    Wrapping

    Mapping

    Determines whether the Cube Texture is used as a reflection map or refraction map

    Text

    Digital Bacon provides two ways to add text, by itself or as an overlay with a background

    Click on any of these links to jump straight to the type of text you're interested in

    Plain

    A Plain Text asset is just text floating in 3D space with no background

    Visually Edit

    Checkbox

    Enables visual editing for the asset

    Text

    Text

    The text you want rendered

    Font Size

    Number

    The size of the font

    Max Width

    Number

    The maximum width the text can take up before wrapping to a new line

    Font Color

    Color Selection

    Sets the color for the font

    Text Align

    Text Align

    Determines the horizontal alignment of the text. Only relevant if text spans more than 1 line

    Position

    Numbers

    Location of the asset along the x, y, and z axes

    Rotation

    Numbers

    Orientation of the asset represented as Euler Angles

    Scale

    Numbers

    How much the asset is stretched along the x, y , and z axes

    Render Order

    Number

    The order in which assets are rendered. Useful when trying to prevent transparent assets from hiding behind one another (learn more)

    Overlay

    An Overlay Text asset is comprised of text overlayed on top of a background

    Visually Edit

    Checkbox

    Enables visual editing for the asset

    Text

    Text

    The text you want rendered

    Font Size

    Number

    The size of the font

    Width

    Number

    The width of the background

    Height

    Number

    The height of the background

    Font Color

    Color Selection

    Sets the color for the font

    Background Color

    Color Selection

    Sets the color for the background

    Background Opacity

    Number

    How opaque the background is. 1 is fully opaque and 0 is invisible

    Border Radius

    Number

    Determines the roundedness of the background's corners

    Padding

    Number

    The minimum amount of space between the background's edges and the text

    Justify Content

    Justify Content

    Determines the vertical alignment of the text within the background

    Text Align

    Text Align

    Determines the horizontal alignment of the text. Only relevant if text spans more than 1 line

    Position

    Numbers

    Location of the asset along the x, y, and z axes

    Rotation

    Numbers

    Orientation of the asset represented as Euler Angles

    Scale

    Numbers

    How much the asset is stretched along the x, y , and z axes

    Render Order

    Number

    The order in which assets are rendered. Useful when trying to prevent transparent assets from hiding behind one another (learn more)

    Audio

    All audio have the following parameters that can be edited in the menu

    Visually Edit

    Checkbox

    Enables visual editing for the asset

    Preview Audio

    Checkbox

    Allows you to play the audio while in the Editor

    Auto Play

    Checkbox

    If checked, the audio will start playing automatically when the user clicks starts in the Digital Bacon website

    Cone Inner Angle

    Number

    The angle (0-360 degrees) of a cone in which the audio does not reduce. 360 degrees would make this a non-directional audio source as audio would travel in all directions equally

    Cone Outer Angle

    Number

    The angle of a cone inside of which the audio reduces by a constant value, defined by Cone Outer Angle. Audio will not reduce within the Cone Inner Angle

    Cone Outer Gain

    Number

    The factor by which volume gets reduced outside of the Cone Outer Angle. 0 means nothing can be heard outside of the cone while 1 means there is no reduction

    Distance Model

    Distance Models

    The method in which volume decreases as a user gets farther from the audio source. Options are linear, inverse, and eponential

    Loop

    Checkbox

    Whether the audio should play on repeat or not

    Max Rolloff Distance

    Number

    The maximum distance from the audio source in which the volume gets reduced by distance. A user farther than this distance will not experience any volume reduction

    Min Rolloff Distance

    Number

    The distance in which volume reduction starts taking place using the Distance Model and Rolloff Factor. A user closer than this distance will not experience any volume reduction

    Rolloff Factor

    Number

    How quickly the volume is reduced as the user moves farther away from the audio source. Typical range for linear distance is 0-1 and 0-∞ for the other distance models

    Volume

    Number

    How loud the audio source is

    Play Event

    Event

    Audio will start playing whenever this event is triggered

    Pause Event

    Event

    Audio will pause whenever this event is triggered

    Stop Event

    Event

    Audio will stop whenever this event is triggered

    Position

    Numbers

    Location of the asset along the x, y, and z axes

    Rotation

    Numbers

    Orientation of the asset represented as Euler Angles

    Scale

    Numbers

    How much the asset is stretched along the x, y , and z axes

    Video

    All audio have the following parameters that can be edited in the menu

    Visually Edit

    Checkbox

    Enables visual editing for the asset

    Preview Video

    Checkbox

    Allows you to play the video while in the Editor

    Display

    Sides

    Selects what sides of the material are visible. If Front or Back Side is selected, the opposite side will be see through

    Auto Play

    Checkbox

    If checked, the video will start playing automatically when the user clicks starts in the Digital Bacon website

    Loop

    Checkbox

    Whether the video should play on repeat or not

    Play Event

    Event

    Audio will start playing whenever this event is triggered

    Pause Event

    Event

    Audio will pause whenever this event is triggered

    Stop Event

    Event

    Audio will stop whenever this event is triggered

    Position

    Numbers

    Location of the asset along the x, y, and z axes

    Rotation

    Numbers

    Orientation of the asset represented as Euler Angles

    Scale

    Numbers

    How much the asset is stretched along the x, y , and z axes

    Components

    Components are essentially labels that can be attached to other assets to let Systems know to alter their behavior. For example, attaching a Grabbable Component to an asset will notify the Grabbable System to add functionality to the asset so that users may pick it up and down in the live site. There are many more components than what you'll see in Digital Bacon by default. Check out our list of plugins to find some you might find useful

    Publish Component

    Allows you to specify what events should be published for various actions on an asset like clicking, grabbing, and touching

    Event

    Event

    The event that will be published by the actions specified below

    Pointer Action

    Interactable Action

    The action done by mouse, touch screen tap, or XR target ray on an asset that should trigger the event

    Grip Action

    Interactable Action

    The action done by XR controller grip button or hand tracking grab gesture on an asset that should trigger the event

    Touch Action

    Touch Interactable Action

    The action done by XR controller or hand touching an asset that should trigger the event

    Systems

    Systems can alter the behavior of Assets with components that pertain to that System. Going off the previous example, if you were to omit the Grabbable System then users would not be able to pick up objects in your live website. There are many more systems than what you'll see in Digital Bacon by default. Check out our list of plugins to find some you might find useful

    Publish System

    Enables publishing events when assets with a Publish Component are interacted with

    Other Assets

    Digital Bacon allows other custom assets to be included in the project that don't fit in the other categories. These are plugins that can be included just like Components and Systems that can be found online. In the coming months we hope to provide a platform for users to be able to find and use additional assets easily