Ever found the out-of-the-box Microsoft Teams backgrounds to be too generic for your brand? Want a more custom-themed Teams background for your brand? Don’t fret. This blog will guide you exactly on how to do that. Our workflow combines Canva and Scene Studio editor to easily create custom-branded together mode Teams backgrounds in a matter of hours.

The design process comprises of 5 steps as listed below:

1. Designing the MS Teams backgrounds
2. Exporting images to be imported to scene studio
3. Arranging the people placeholders
4. Publishing the Teams Background in Microsoft Teams App
5. Testing the Teams Background in Microsoft Teams App

We start by first designing the background of the environment in Canva. Our designs are generally inspired by futuristic, space exploration, and modern technology themes. There are many free elements you can use, as well as the pro-ones in case you have a paid subscription to Canva. I love to play around with lighting to create different moods. Here’s an example of our latest “Penthara HQ” Microsoft Teams background. I’ve also mentioned the keywords I used for searching these elements on Canva.
In this scene -

1. The background image is a readily available image from Canva

Keywords for Background Image: Futuristic City, Sci-fi

2. The little spaceships were separate elements that I’ve repeatedly used in the background while varying their size in perspective to the image. Keywords for Spaceships: Spaceship, Sci-Fi, UFO
3. The suspended glass board signs are also separate elements available in Canva. To add our branding, I’ve added text box with company messaging on one glass banner on the right and our company’s logo on the one on the left.

Keywords for Transparent Banner: Transparent Glass

Fonts Used:

1. 1. Big Shoulders Display (Heading)
   2. HK Modular (Bullet Points)

4. For creating a single seat, choose an element with flat top surface. If the color of the element doesn’t match the overall theme, you can adjust it by using the tool bar on the top. Navigate to Edit Image -> Adjust.

Keywords for Seat element: Podium, Blue, 3D shape

5. Then add details and lighting to enhance the look as shown in the video below.
6. After that replicate the seats, arrange them in a row and group them. We repeat the same process for any further rows that we make.

7. We manage the z-index of the rows by using the moving the seats to the back or to the front. The second row is behind the first one and the third row with two seats only is behind the third row. To access the option to move elements to the back or front, follow these steps:

• Go to “Position” option in the tool ribbon bar.
• A side panel will open on the left.
• Adjust the z-index of elements by using the “Forward”, “Backward”, “To front” or “To back” options.
• An alternate way to achieve the same is to change the order of elements by rearranging the order of layers in the layers tab of the side panel via drag and drop.

8. Then add details and lighting to enhance the look.

Keywords for lighting between seats: Light Glow
Keywords for light rays coming from the top: Light Ray, Spotlight

And we have now successfully completed the designing part of the background. Now we move on to the making and testing part of this task.

1. First, download the image from Canva in 1920 x 1080 px resolution.
2. The total size limit for a scene in scene studio editor , so optimize these PNGs for a lighter file.
3. If you have Canva Pro Subscription, you can select the “Compress File” option while downloading the file.

The scenes for the Teams Backgrounds are made in a platform provided by Microsoft called the scenes editor. Here’s a link to read more about it - Custom Together Mode Scenes - Teams | Microsoft Docs.

Now to begin, go to Scenes Editor - Teams Developer Portal. Then

1. Click on “Create a new scene” from the options in the ribbon menu and select “Blank Scene”.
2. Start by inserting the environment background.
3. Click on “Add images” in the right panel and choose your background.
4. Lock the image so that we don’t accidentally move it while arranging other elements.

5. After you’ve placed the background, Click on the “participants button” on the right panel. Enter the number of participants you want to fill in this scene.

6. Go ahead place them.

Note: Make sure that you scale the placeholders to above 150% otherwise, when in use, people will look really tiny in together mode.

7. First set the scale percentage for the placeholders on the edge.
8. Then accordingly adjust the scaling of the rest of the placeholders in the row.

Note: It’s okay for the placeholders to overlap with each other. Microsoft Teams manages to automatically centre people on its own during calls. Change to just points. Remove storytelling.

9. Finally select the “mirror participants” option in the settings menu on the right side-panel.

1. Name your custom background and save it.
2. After saving, click on “View in teams” on the top right corner of your screen.
3. Follow the on-screen prompts to successfully publish your background in teams.

Once that is done and dusted do the following steps –

1. Create a dummy MS Teams meeting on your calendar.

2. Join the meeting and navigate to the together mode.
3. Click on “Change the scene” option on the bottom left corner of your screen.
4. Select your custom together mode background which should be visible in the pop up menu.

5. Click Apply.

The scene gets published as an app to your organization’s teams application. For that, you will have to export all the data and code pertaining to this scene as a ZIP folder. To do that, follow these steps:

1. Click on the downwards-pointing chevron on the right side of the save button.
2. A dropdown menu opens up with two options – share and export.

3. Click on export.
4. The scene gets downloaded as a ZIP folder.

Other team members can upload this zip file to scene editor from their accounts and add this background to their teams by following the steps mentioned in “Publishing the Background to Microsoft Teams App”.

Note: In this mode of publishing teams background, the option to apply this background will only be visible to those who publish it to their teams individually. It won’t be commonly visible to your entire organization.

Additionally, you can also publish this background as an app in your organization’s teams so that it’s commonly available for everyone to apply. This will require technical assistance from your IT team.

1. Custom Together Mode Scenes - Teams | Microsoft Learn
2. Teams Together Mode | Microsoft Teams
3. Create a custom scene in Microsoft Teams meetings - Microsoft Support