3D embed publishing settings

Feature availability

publish_settings_header_sep23.png

When you publish a 3D model from the BioDigital Human web app, the model is packaged in what we call the Human Viewer, or simply the Viewer. The Viewer lets end users load and interact with your published model in a browser or application—without logging in—and is designed to support most typical user experiences.

You can also customize the Viewer’s appearance and functionality before sharing your published model. The publishing settings let you control how the model loads, how users interact with it, and which information and tools are available to them.

Learn more about each group of publishing settings below:

 

Viewer Size

Available settings:

Responsive vs. Fixed

Default: Responsive with Standard Aspect Ratio (4:3)

This setting controls whether the size of your 3D model is responsive or fixed when embedded into a webpage.

  • Responsive (default): The width of the Viewer automatically adjusts to the size of the screen or container in which it is embedded. This allows the Viewer to adapt to different devices and screen sizes while maintaining the selected aspect ratio, and it gives the user full access to all of the available exploration tools regardless of the device they are currently using.

    When you embed a responsive Viewer, the default aspect ratio is 4:3, but you can select a different aspect ratio to better fit your page layout. Learn more about aspect ratios and additional customization options in Working with responsive 3D embeds.
    viewer_size_responsive_nov22.png
  • Fixed: The width and height of the Viewer remain the same regardless of the size of the screen or the container in which it is embedded. Depending on where your embedded model is accessed, this may cause parts of the 3D model or important tools to fall outside the visible area on smaller screens. We therefore recommend using this option with caution.

    When you embed a fixed Viewer, you need to specify the width and height in pixels. The default dimensions are 700 x 550 pixels, and the minimum dimensions are 300 x 400 pixels.
    viewer_size_fixed_nov22.png

 

Loading Experience

Available settings:

Load 3D model automatically

Default: Enabled

This setting controls how and when the 3D model will load—automatically or on demand:

  • When this setting is enabled (the box is checked), the model loads right away—whether the Viewer is opened in a standalone page or embedded in a webpage. 
  • When this setting is disabled (the box is unchecked), a 2D image appears in place of the 3D model when the page loads, and the end user needs to click or tap a button to load the model. In other words, the user loads it "on demand." On-demand loading can improve overall page performance, so we disabling this setting if you plan to embed multiple models in a single page, or if the surrounding page contains a large quantity of other media that are competing for browser memory. Compare this option to the default setting below.
  • Load 3D automatically enabled

  • Load 3D automatically disabled

 

Rotate 3D model on load

Default: Disabled

Tip: A lower value slows down the rotation, while a higher value speeds it up.

 

Launch tutorial on load

Default: Disabled

When this setting is enabled, a short 3D interaction tutorial launches the first time the user loads the model. The tutorial teaches users how to interact with the model in 3D, including how to rotate, zoom, pan, and explore the anatomy.

viewer-tutorial_jan23.png

The tutorial guides users through the following:

  • When the tutorial first launches, users can choose between either a) mouse, trackpad, or keyboard and b) touchscreen to customize the tutorial to their device.
  • At each step, the Viewer detects when the action has been completed successfully and provides feedback. On desktop devices, the tutorial also provides tips for performing actions using keyboard shortcuts.
    viewer-tutorial_tip_jan23.png

Whether or not you enable this setting when you publish, this tutorial is available at all times in More Options > Help, unless Help has been disabled in your Tools settings.

3D navigation tutorial_help_sep23.png

Note: When enabled, the tutorial appears only once per device. Users will not see it again unless they clear their cookies and site data or switch to another device.

 

3D interaction prompt

Default: Do not show prompt

When this setting is enabled, a "prompt" of your choice appears over the 3D model when it first loads, encouraging users to interact with the model. 

Available prompts include:

  • Show button: Displays a translucent black button with the message Interact in 3D. The button turns blue when the user hovers over the Viewer.
    3D interaction prompt_button.gif
  • Show animated hand: Displays an animated hand with the message Interact in 3D, prompting users to tap the screen. This option is recommended for mobile-only or mobile-first integrations.

    3D interaction prompt_hand.gif

  • Show play button: Displays a black-and-white play button labeled 3D. The button turns blue when the user hovers over the Viewer. This option also displays the model's loading progress in place of the default loading indicator.
    3D interaction prompt_play button.gif
  • Show summary: Displays the title of the model, tour, or quiz along with a button whose call to action depends on the type of content:

    • For single-chapter models, the button says Interact in 3D.
    • For tours (models with multiple chapters), the button says Begin Interactive Tour, along with the number of chapters.
    • For quizzes either a) saved as Quiz Only in Studio or b) saved as Quiz Optional in Studio and published in Assessment mode, the button says Take Quiz. (Learn more in Understanding 3D quiz visibility modes.)

    Regardless of the content type, the button turns blue when you hover over the Viewer.
    3D interaction prompt_summary.gif

 

Anatomy Labels

Available settings:

Show label when anatomy is selected

Default: Enabled

When this setting is enabled, selecting any part of the model will trigger a label to appear. This label—called an anatomy label—identifies the structure by name, be it an anatomical structure, a component of a structure, a microscopic unit such as a cell, or an inanimate object such as a device.

When this setting is disabled, selecting part of the model will only highlight it; no label will appear.

  • When anatomy labels are enabled and Studio labels are also present:

    anatomy labels_enabled_with studio labels_sep26.png

    When anatomy labels are enabled but Studio labels are not present:

    anatomy labels_enabled_sep26.png

  • When anatomy labels are disabled:

    anatomy labels_disabled_sep26.png

 

Show "info icon" for description

Default: Enabled

Note: Requires Show label when anatomy is selected to be enabled.

When this setting is enabled, an    info icon appears in the anatomy label when a structure is selected. Selecting the icon displays a detailed description of the structure in either the label or a pop-up window, depending on the size of the 3D embed.

When this setting is disabled, the info icon does not appear in the anatomy label.

  • Info icon enabled:

    anatomy labels_info icon_enabled_sep26.png

    Info icon enabled, with description expanded:

    anatomy labels_info icon_expanded_sep26.png

  • Info icon disabled

    anatomy labels_info icon_disabled_sep26.png

Many anatomical structures in the BioDigital Human come with custom descriptions written by BioDigital's anatomy experts. However, if a BioDigital description is unavailable for a given structure, a fallback description from Wikipedia will be displayed instead.

If you are a member of a team, your administrator(s) can opt to change your team's fallback description source from Wikipedia to the NCI Thesaurus, or NCIT. This setting can be adjusted on the Team page under Manage > Settings.
anatomy_description_fallback_jan22.png

 

Show "audio icon" for pronunciations

Default: Enabled

Note: Requires Show label when anatomy is selected to be enabled.

When this setting is enabled, an    audio icon appears in the anatomy label when a structure is selected. Selecting the icon plays an audio pronunciation of the structure's name.

When this setting is disabled, the audio icon does not appear in the anatomy label.

  • Audio icon enabled:

    anatomy labels_audio icon_enabled_sep26.png

  • Audio icon disabled:

    anatomy labels_audio icon_disabled_sep26.png

 

Information Panel

Available settings:

Show Information Panel

Default: Enabled

When this setting is enabled, the Information Panel displays the information and complementary media associated with each chapter of your 3D model or tour. When available, the Information Panel may include:

  • Chapter title
  • Chapter description
  • Chapter list
  • Labels
  • 2D images
  • Videos
  • Animated GIFs
  • Legend

The Information Panel can appear in one of two layouts, depending on the width and aspect ratio of the Viewer:

  • Column (≥960 pixels wide): The Information Panel appears as a column on the left side of the Viewer and displays available information and media for the current chapter. When a multi-chapter tour is opened in the column layout, the chapter list appears to the left of the Information Panel.
    info panel_media_chapter list_jan25.png
  • Button/Drawer (<960 pixels wide): The Information Panel is closed by default and can be opened by selecting the    info icon at the top of the Viewer. It then appears as a drawer at the bottom of the Viewer.
    info panel button_sep23.gif
    When a multi-chapter tour is opened in the button/drawer layout, the chapter list is instead available as a drop-down from the floating chapter navigation menu in the upper-left corner of the Viewer.
    chapter list_floating nav_wide_jan25.png

Note: If a given chapter does not contain a description or complementary media, the Information Panel will not appear.

 

Show label list in Information Panel

Default: Enabled

When this setting is enabled, a Labels section in the Information Panel, containing a list of all labels present in the current chapter. 

Selecting a label from the list allows users to quickly navigate to key learning points on the model. Depending on how the label was configured, selecting a label may simply select the corresponding label on the model, or it may trigger additional actions assigned to the label in Studio. (See Create and manage labels in Human Studio to learn more.)

info panel_label list_jan25.png

Note: Note: The label list includes only labels that are present in the current chapter and appear on the model at all times, such as labels added and edited in Studio. Anatomy labels that appear when a structure is selected are not included in this list; these are available in the Anatomy Search tool, when enabled in your Tool settings.

 

Media Controls

Available settings:

 

Show audio controls when available

Default: Enabled

When this setting is enabled, two audio controls appear at the top of the Information Panel when audio is available for the current chapter:    Play from Beginning and    Unmute or    Mute.

Audio is muted:

audio muted_sep23.png

Audio is unmuted (playing):

audio unmuted_sep23.png

Due to browser security restrictions, your chapter's audio may initially be muted, and users will need to select Unmute to hear the audio. To bypass this step, we recommend enabling a 3D interaction prompt. Once the user clicks or taps the interaction prompt, the audio can begin playing unmuted.

Warning: If this setting is disabled, users will not have a way to play or pause audio in the model, even when audio is available.

 

Animation controls

Default: Show all (play/pause button & scrubber)

This setting controls which media controls appear in the lower-right corner of the Viewer when a chapter contains animated elements. You can choose from the following options:

  • Show all (play/pause button & scrubber) (default): Displays the play/pause button and scrubber, allowing users to explore an animation at their own pace. This option is recommended for animations that illustrate a process.

    Minimized (default):
    media controls_all_collapsed_sep23.png
    Expanded:
    media controls_all_expanded_sep23.png
  • Only show play/pause button: Displays only the play/pause button, reducing visual clutter when users do not need to explore the animation in depth.
    media controls_play-pause_sep23.png
  • Do not show: Hides the animation controls, preventing users from controlling the animation. This option is not recommended in most situations.

 

Tools

Available settings:

Upper left:

Bottom right:

 

Selection tools (select, hide, fade)

Default: Enabled

When this setting is enabled, an option called Selection tools will appear in the toolbar in the upper-left corner of the Viewer. All of these tools are enabled by default but can be individually disabled as desired.

The Selection tools option enables users to choose between three selection modes:

  • Select (default): Highlights the selected structure so you can see it more clearly, as well as learn its name, read a description, and hear how it is pronounced (as long as the associated Anatomy Labels settings are enabled).
  • Hide: Hides the selected structure from view, allowing you to see underlying structures. 
  • Fade: Makes the selected structure transparent without hiding it, allowing you to see underlying structures and understand their relationship to the faded structure.

selection tools_sep23.png

Anatomy search

Default: Enabled

The Anatomy Search tool enables you to search for and browse a comprehensive list of anatomical structures included in the current 3D model.

The Anatomy Search panel offers two viewing options:

  • List (default): In List view, results are returned in a flat list, which is helpful for quickly finding specific anatomical structures in the model by name or keyword. Once you find the structure you are looking for, you can perform advanced actions, such as zooming to it, isolating it, or applying a fade effect to everything else in the model to better understand its spatial relationship to other structures.
  • Tree: In Tree view, search results are organized into anatomical systems or thematic groupings. You can also browse the entire set of anatomical structures in the model, and click the arrows to expand and explore sub-groupings and individual structures. As in the List view, you can perform advanced actions on any anatomical structure to study it further. Learn more in What is the Anatomy Tree?

Large GIF (1014x628).gif

 

Draw

Default: Enabled

The Draw tool allows users to draw on and add text to a 2D snapshot of the 3D model to pinpoint key anatomical structures or concepts. Learn more in Using the Draw tool.
draw tool_jul23.png

 

Help

Default: Enabled

When this setting is enabled, a Help menu is available in the toolbar in the upper-left corner of the 3D canvas. To access the Help menu, users can click the    three dots in the toolbar in the upper-left corner of the Viewer. 

The Help menu provides access to the following educational resources to help users make the most of their experience in the Viewer:

  • Getting Started Video
  • 3D Navigation Tutorial
  • Keyboard Shortcuts

help menu_sep23.png

 

Undo, redo, reset

Default: Enabled

When this setting is enabled, the Undo/Redo/Reset toolbar allows users to undo and redo actions taken in the 3D model and reset the model to its original view.

Although enabled by default, the Undo/Redo/Reset toolbar remains hidden until the model has been modified. Once the model is modified, the toolbar appears at the top of the 3D scene so users can easily undo their changes.

undo-redo-reset_sep23.png

 

3D navigation controls

Default: Enabled

When this setting is enabled, the 3D navigation controls toolbar appears in the lower-right corner of the Viewer. It contains four controls for navigating and adjusting the model in 3D space:

  • Recenter 3D Model
  • Change to Pan Mode / Change to Rotate Mode
  • Zoom In
  • Zoom Out

By default, all controls except Recenter 3D Model are minimized. To expand the toolbar and access the other controls, click or tap the arrow at the top.
 

Minimized (default): 

3D controls_collapsed_sep23.png

Expanded:

3D controls_expanded_sep23.png

 

Fullscreen

Default: Enabled

When this setting is enabled, an Enter Fullscreen button appears in the lower-right corner of the Viewer. Selecting this option expands the Viewer to fill the screen, providing a larger, more immersive experience.
fullscreen_sep23.png

When fullscreen mode is disabled, the Enter Fullscreen button is replaced by an Open in New Tab option, which opens the model in a new browser tab.

Note: Fullscreen mode is supported on all devices and browsers except iPhone browsers. For embedded models, make sure your published embed code includes allowFullScreen="true" or allowfullscreen