For Developers

What’s new with the Lumin Web Platform

Last week, we announced a series of exciting news around our business, our operating system, and our developer tools. As we look towards 2020, we’re finding more ways to empower developers of all backgrounds to start creating a future powered by spatial computing. With that, here are some exciting new updates to our Lumin Web Platform.

What is the Lumin Web Platform?

The Magic Leap Lumin Web Platform lets you create interactive spatial computing experiences using HTML and JavaScript. With simple HTML tags, some inline attributes, and CSS styling, you can render 3D content that pops off the page. Now, you can pull content out of a website and place it in your physical environment. The Lumin Web Platform lets creators use the Lumin APIs for web development. These tools include Prismatic—a JavaScript library that lets you add 3D assets. Once published to the web, you can view and interact with them using Helio, the web browser on Magic Leap devices.

Prismatic Is Now Open Source

Magic Leap’s Prismatic 3D web markup library is now open source under the Apache 2.0 license. Developers can fork the library, file issues, and collaborate on helping us to further develop it.

Prismatic is a declarative JS library for creating 3D content for the Helio browser. Using simple HTML tags with inline attributes and CSS styling, you can easily render 3D content that pops off the page, and you can grab and place into your environment.

Our hope is that all device browsers and the XR community begin incorporating this library in their platforms and freely leverage this powerful spatial markup language to help the world build the next generation of the spatial web across XR devices.

The end result is a win for web developers everywhere. Since Prismatic is basically new HTML tags with support of common GLTF and FBX models (images), it’s easier to use than WebXR technologies. In fact, Prismatic is compatible with over 3 million 3D models provided by Sketchfab allowing you to make your website come alive. You can also browse Sketchfab models via Helio on a Magic Leap device. Your images and models can enter the real world with a couple of lines of code. This is perfect for retail websites, as well as business modeling intranet sites, or even consumer gaming websites.

Prismatic documentation can be found online.

Magic Leap x Glitch

image1

We’ve also collaborated with Glitch and their platform that makes it easier than ever to create, share, collaborate, and remix Magic Leap Helio web content, including WebXR and new Prismatic 2.0 samples.

Magic Leap and Glitch are a match made in Web Development heaven. There’s no better way to share and remix flying whales and anti-gravity astronauts than Glitch’s cloud-based platform. Last week we released two Glitch projects as part of our Helio Starter Kit: “Hello, Prismatic” and “Hello, WebXR”. These starter projects provide just what you need to get started with two of Helio’s most powerful and easy to use solutions.

Today, we released our Detached CSS Glitch. This allows you to use CSS to detach HTML elements from the page. In this Glitch, we create a simple spinning cube that when viewed through Helio, is detached from the page and spins in 3D space. Check it out here.

In “Hello, Prismatic” we’ll show you how to setup a basic Prismatic project, install the library, and display and animate a Robot model. This project is designed to be remixed so you can plug-in and animate your own models.

In “Hello, WebXR” we take a deeper dive into the new, cutting-edge standard for creating immersive web-based XR experiences on Magic Leap. We’ll be working with WebXR and Three.js to create a giant animated Jellyfish that floats in your space.

WebXR Is Now Officially Supported

W3C’s WebXR working group has been hard at work drafting the new standards for WebXR. WebXR allows for landscape and immersive AR and VR applications to run in web browsers across XR devices (PC, VR, AR, and mobile).].

Magic Leap is proud to join the list of WebXR supported devices to support landscape and immersive experiences running on Helio, our Lumin Web Platform. This update allows web developers to write browser-based applications that can run on Magic Leap and other XR Devices. This support also allows enterprises to link to modern WebXR applications directly from their websites and/or intranet sites - no app store required.

What else came out in LuminOS 0.98

  • (Beta) Developers can now rotate the page to flat so users can place it on a table.
  • (Beta) Developers can now spatialize web pages by setting 3D CSS transforms on any div or element. This will eventually replace the <quads> tag in Prismatic.
  • WebXR: Support for the core API as ratified by W3C.
  • (Beta) WebXR: Support for Magicleap’s PCF API until anchors are ratified.
  • Prismatic 2.0
    • A major optimization of the Prismatic JS library.
    • Faster model loading.
    • Models scroll with the page.
    • Models can be extracted with raycast. Users no longer have to be interacting with the parent element on the page to extract them.
    • Model instancing.
    • Developers can now use the <stage> tag to specify how much space their experience takes up. This replaces the unbounded volume api which will be deprecated.

What’s next?

In the coming weeks and months we’ll release new samples showing exciting new features in the Helio Spatial Web Platform, including detached CSS, page rotation, and more advanced Prismatic and WebXR samples. Stay tuned.

Related content

Get the latest news and updates

Sign up to receive offers, promotions and other marketing emails from Magic Leap. You can opt out of them at any time.

Sign up to receive offers, promotions and other marketing emails from Magic Leap. You can opt out of them at any time.