Building Multiuser Spaces

Jump to:

Step 1: Getting started with multiuser

Step 2: Creating a meeting space

Step 3: Decorating your meeting space

Adding hotspots

Adding furniture & other objects

Adding camera/screen sharing mediaboards

Showing dial-in details

Embedding other content

Adding Sitting Hotspots

Step 4: Control and collaboration tools

Step 5: Inviting participants to the meeting

Step 1: Getting started with multiuser

Hey there, welcome to your first lesson on how to get up and running with multiuser meeting spaces!

The goal of this guide is to help you build a simple room for a 1-on-1 meeting that will show you the basics of how the Dashboard is used. Once you’ve completed this crash course (in about 24 minutes) you’ll have the knowledge you need to get started building more elaborate meeting spaces.

Here is a preview of the Meeting Space you’re about to build.

Step 2: Creating a meeting space

What exactly is a Space? A space is a customized 3D location, and this section will tell you how to create one.

The first thing you’ll see after going to the Dashboard and logging in will be your spaces, which will most likely only contain a “Getting started” space.

At the top of the screen, you’ll see links to help you move between the main areas of the dashboard. For now, we want to focus on creating spaces; Worlds and Scenarios will be discussed at a later stage.

So, let’s create a Space to turn into a 3D location that our meeting participants can visit; you can start by clicking on the “Create space” card on the left of the Getting started space. If you cannot see that card, be sure you are in the correct area of the Dashboard by clicking on the “Spaces” link at top (it is within the menu if you are on mobile). Or, if you’re feeling a bit lazy, you can just click here: direct link to create a space

In this page, you will be able to choose between a variety of templates, as well as setting a name for your space and deciding if it will be multi-user (which we definitely want, seeing this will be a space for meetings!)

To proceed, follow these steps:

  1. Select a template (for this tutorial we will use the “Office” template)
  2. Scroll down to write a name
  3. Make sure the “Virtual meeting room” toggle is on (blue)
  4. Click on the green “Create Space” button

Let’s now move on to visiting the space and learning the basics of 3D editing

Step 3: Decorating your meeting space

First things first: you need to launch your Space from the Dashboard in order to enter the 3D editor. If you’re following along, then you probably already have the Spaces page open. If not, click here to do so now. Once you’re there, simply click on the space we just created and it will launch in your browser.

Adding hotspots

Hotspots are special objects on which users can click in order to teleport there – we will add a few of them so that we can move around the space while decorating it.

It’s also possible to teleport to a certain position by clicking/tapping and holding (until a blue circle appears). This is called “free teleport” and is the main mode of movement, but adding hotspots is always useful because it allows quickly jumping to predetermined spots

To start editing the scene, click on the pencil button at the top right, which opens the “Edit menu”, and select “Start editing”

Now click on the “Add hotspot” button in the edit menu

A blue hotspot will be created in front of you. If you hover over it, you will see a few controls appear:

  • The spheres at the sides allow you to rotate the item (the “point” of the hotspot indicates the direction where the user will be facing when clicking it)
  • The crossed arrows button allows you to exit “move mode”
  • The cog button opens the object’s properties
  • Clicking and dragging anywhere on the object that is not one of these “special” spots will allow you to move it around

Let’s create 4 hotspots and put one in each corner of the room.

While in edit mode, you might notice an orange hotspot. That is the “spawn” hotspot, and is where users start. It can be moved around like other hotspots, so let’s place it close to the wall between the door and the opposite side

Adding furniture & other objects

We can move around the room better now, but it’s still a bit empty – we should add some items.

3D editing within LearnBrite is very powerful, but for now we’ll limit ourselves to 4 options:

  • Red: exit edit mode
  • Blue: Add 3D items and other content
  • Green: the add hotspots (this is the one we just used)
  • Purple: Add mediaboards

You can rotate the camera by clicking and holding the right mouse button and moving it around

We will start with a rug: in the edit menu, select “Add content”, which will open the content browser. In there,

  1. Type “rug butterflies” in the search box
  2. Select the “LearnBrite” filter
  3. Click on the result to add it to the 3D scene

Now the rug is in the room, and you’ll see a blue box surrounding it. Like with hotspots, there are a few possible options:

  1. The corner cubes allow you to scale the object
  2. The spheres at the sides allow you to rotate the item
  3. The crossed arrows button allows you to exit “move mode”
  4. The cog button opens the object’s properties
  5. Clicking and dragging anywhere on the object that is not one of these “special” spots will allow you to move it around

Normally, making an item larger would be a simple matter of clicking and dragging on one of the corner cubes, but in this case we want to change a few more properties so we’ll edit everything at once – hover over the rug and click on the cog icon.

The object’s properties will appear, and here are the values to change (when you’re done, remember to click “Save item” at the bottom!) :

If the popup is too high for your screen and you don’t see the Save button, remember you can scroll down to see it!

Property

Value

Notes

position

{"x":0.34,"y":0.001,"z":-0.071}

scale

{"x":1,"y":1,"z":0.8}

castShadow

true

Make the rug cast a shadow on the floor

receiveShadow

true

Allow other objects to cast a shadow on the rug

freeTeleportTarget

true

Allow users to click-and-hold on the rug to free-teleport on it

sceneryStatic

true

“Lock” the object and prevent further edits to it

Note that you can still change the settings of an item locked with “sceneryStatic” from the edit menu

Now let’s add some more items – we will want a table and a few chairs, and we can add them in the same way by looking for “chair” and “table” in the content browser (Edit menu → Add content). Here is the final result after placing them

Adding camera/screen sharing mediaboards

Mediaboards allow you to embed content from outside the platform in the 3D space, and are an important addition to meetings.

First, we will add four mediaboards that allow users in the space to share their camera or screen. To do so:

  1. Open the edit menu
  2. Click on “Add mediaboard”
  3. Switch to the “Share screen” section
  4. Click on “Screen share”

A mediaboard with a dark green background has been added to the space.

From now, any user that is a Presenter or Editor (see User Roles) will be able to click on it to share their screen or camera.

Since we’re organizing a 1-on-1 meeting, it might be useful to add a few more in case multiple screens need to be shared. A quick way to do so is to clone the existing mediaboard thrice, which will create three copies with the same properties as the original. An object can be cloned by opening its properties with the cog icon, and then clicking on “Clone item” at the bottom.

Add 3 more mediaboards and place them in a grid on one of the walls

Showing dial-in details

An important aspect of meetings is offering fallbacks so that users can participate even if there are technical difficulties, for example if they don’t have a stable internet connection. For this purpose, the platform offers a way to show dial-in details on a mediaboard, which can be added in a similar process to the screen share ones:

  1. Open the edit menu
  2. Click on “Add mediaboard”
  3. Switch to the “Share screen” section
  4. Click on “Dial-in details”

A mediaboard will appear with a “rendering” image – the platform is taking a snapshot of the dial-in details for this space so that it can be shown directly within the 3D environment, and will appear in 10 seconds or so. The mediaboard itself is already operative however, and will show dial-in details when clicked on, which can then be used by those in the 3D environment if needed or communicated to external parties. You can place this mediaboard by the side of the door.

Embedding other content

One of the main purposes of mediaboards is to embed all sorts of external content – we will add a YouTube video, which can be done from the edit menu, selecting “Add mediaboard” once again.

There are a number of options, but if you’re unsure about what to use you can simply leave the default, “URL” (as a rule of thumb, 90% of the time the default selection is the way to go).

Paste https://www.youtube.com/watch?v=l0q7nweJ8i8 in the input box, then click “Create”

The mediaboard will appear in the 3D environment soon after, and it can be positioned, scaled and rotated like other 3D objects. As a matter of fact, it’s a bit small for a presentation, so drag on the cubes at the corners to make it bigger, then place it on the wall opposite to the dial-in details.

Adding Sitting Hotspots

Wouldn’t it be nice to have a seat? Hotspots can be set to “stand” or “chair”, allowing you to stand or sit depending on the needs of your scene.

The first thing to do is lock each of the chairs (and the table) in place with sceneryStatic. You cannot make hotspots static so it’s easier to set the chairs up, lock them in place and then add in the hotspots.

After the chairs and table have been locked in, grab the two hotspots at their sides and place them slightly in front of them.

To make them “sitting” hotspots, open their settings and set the posture field to “chair”. We also suggest setting the “y” of position to 0.1 (these chairs are taller than normal, so the avatar will be sunk in them if the hotspot is kept at floor level)

Try them out to make sure that everything is working as you expect, and congratulate yourself on building your first fully-functional multiuser space!

Step 4: Control and collaboration tools

We’re in the home stretch! We will now go over a brief tour of the main multiuser features.

At the bottom of the screen there are some options for communication:

  1. A “gestures” menu, which allows selecting from a few different animations
  2. A text input to send chat messages
  3. “Send chat message” button (also triggered by pressing enter on the keyboard)
  4. “Join conference call” button
  5. “Share camera” button
  6. “Share screen” button

At the top of the screen, towards the right, you can click on the “more” button (three vertical dots) and click on “Participants” to open the participants’ menu, which allows fine-grained interactions like kicking users, teleporting them across spaces, sending messages to them, etc.

A full guide is available here. Many of these options are also available by clicking or tapping on another player’s avatar. 

From the same menu it’s also possible to access the Q&A functionality.

Finally, clicking on the LearnBrite logo/hamburger menu at the top left allows accessing additional features

 

  1. “Announcements”: special with a special styling that only Editors/Presenters can send
  2. “Polls”: a guide for which can be found here
  3. “Profile”: a window allowing you to fill in your profile details (name and organization will show within the 3D environment in the nameplate above your avatar)
  4. “Contacts”: a window to see your accepted and pending contact requests

Step 5: Inviting participants to the meeting

We’ve made it to the end! Now you have a functional micro-learning Scenario that’s ready for people to experience, and by building it you have the basics of using the platform under your belt too!

The only thing that’s left is to learn how to invite people to your space, which can be done from either the 3D environment (see “How do I… → Invite other users to a space/world from the 3D environment?”)

Or through the Dashboard (see “How do I… → Invite other users to a space/world from Dashboard?”)

And that’s it!

Hopefully you’ve enjoyed your first foray into the world of LearnBrite enough to keep building new and exciting Scenarios to take your meetings to the next level. If you ever have any questions, feel free to reach out to support ([email protected]) or to explore more of the training library for help on specific features. Don’t hesitate to get in touch, as we can help you find your way very quickly if you’re stuck, and it also gives us valuable feedback on what we can improve for you, our user!

So, what’s next? Well, go ahead and start building your own spaces! Or if you’d like to set up some micro-learning scenarios, be sure to check out the Micro-learning Module Quick Start Series.

How useful was this article?

Click on a star to rate it!

We are sorry that this article was not useful for you!

Let us improve this article!

Tell us how we can improve this article?