Web content in Microsoft Mesh, powered by WebView

Sean Kerawala

December 14th, 20230 3

Microsoft Mesh, generally available in January, provides a built-for-business toolkit that accelerates the creation of 3D multi-user experiences for PC and VR. These experiences can be even better when you bring everyday apps and information from the web into your 3D worlds. Imagine bringing your distributed workforce together in an immersive space to review dashboards, discuss presentation slides, decorate spaces with brand images, play online games, or walk through interactive exhibits – all by using content used on the web, daily.

The WebSlate component of the Mesh toolkit provides a secure, streamlined way to add and interact with web content by bringing the power of WebView2 technology to environment creators. With WebSlate, you can add a URL to a screen placed anywhere in a virtual Mesh environment and experience it across multiple users during an event. As an avatar in an immersive space, you can view, click, and discuss web content just as you would in a traditional web browser but with co-presence—right on your PC or in your Meta Quest headset.

Imagine using WebSlate in Mesh events for…

Livestream watch parties with your team
Displaying social media feeds and leaderboards that excite and engage your audience
Creating interactive exhibits out of existing web apps
Drawing and ideating on a virtual whiteboard
Personalizing a Mesh environment with your brand design assets and content
Competing in online games

How does it work?

WebSlate leverages WebView2 to let users interact with apps at runtime. Windows WebView2 and Android WebView components help render content at runtime from URLs attached to the WebSlate prefab in the Mesh toolkit. The Mesh environment you create in Unity with the Mesh toolkit can then be experienced in the Mesh application with input, audio, and synchronization across multiple users if the web app allows it.

For those seeking more robust web content experiences in Mesh outside of the base WebSlate prefab, other Mesh toolkit features like scripting can be used to configure triggers that show content when prompted by the user or to bring offline HTML content from local web apps into Mesh.

With web content in Mesh, we’re empowering developers to create web-powered UI’s and expose endpoints that communicate with Mesh through two-way messaging.

To add web content to a Mesh environment, create a new Unity project or start with an existing one, then add the Mesh toolkit package. Once the toolkit has been added, drag and drop the WebSlate prefab into your scene and update the URL in Unity’s Inspector panel to your desired webapp. Position the WebSlate in the scene where you wish, then preview the content using Mesh Emulation mode in Unity, enabling you to test interaction as end users will experience the web content in the Mesh app.

What can WebSlate do?

Secure content navigation: By default, WebSlate prevents unintended hyperlink navigations.
Multi-slate experience: Multiple WebSlates can be added to a Mesh environment
Multi-user visibility: Content can be seen by multiple users if the web app permits it
Scriptable: Scripts can be used to connect WebSlate to buttons that refresh content and toggle pages, or view local HTML files
Testable, measurable, and runtime performant: Works with the Mesh Emulator and Content Performance Analyzer in the Mesh toolkit and suspends/resumes based on user visibility at runtime.
Visual customization: Image quality can be adjusted to suit viewing from various distances by using slates of different sizes.
Input & audio built-in: End user web navigation and interaction with apps and videos “just work” in Mesh with no extra effort required.

Introducing web content into immersive spaces in Mesh helps developers easily surface commonly used apps and websites into user experiences. WebSlate helps elevate engagement and boost connections by keeping people immersed in familiar content.