Announcing the New PlayCanvas Asset Store

The PlayCanvas Asset Store is the first place that users tend to go to find content for their projects. This is especially true for new users who want to get started as quickly as possible. Up until now, the Store has not been particularly easy to use and the content has not changed in quite a long time. In short, a complete overhaul and refresh has been long overdue. So today, we are incredibly excited to announce a major upgrade for the PlayCanvas Asset Store!

First up, check out a little example of building a city scene using content taken from the Asset Store. A skybox, a pack of 3D city block meshes and a camera control script are imported and the city is built via drag and drop. And not one single line of code is needed!

Now, let’s examine some of the key highlights that make the new Asset Store so special.

Built Right In To The Editor

It should be possible to grab assets quickly, right from within the Editor itself. Why should you have to open a new tab and go hunting around the web? So to keep things as convenient as possible, the ASSET STORE button (in the Editor’s Assets Panel) now opens a nicely designed, responsive Asset Store panel.

One really cool benefit of selecting assets from within the Editor is that the currently selected Asset folder is known. This means you have compete control over where your imported assets will be saved.

Preview Store Assets Before Import

Sometimes, an asset thumbnail just isn’t sufficient to tell if a particular asset is what you want.

Our new Store allows you to select a Store Item and preview it in an appropriate viewer (glTF Viewer for 3D models, Texture Viewer for textures and cubemaps).

Find What You Want Quickly

As the number of store items continues to grow, it’s going to be incredibly important for you to be able to narrow down your assets searches. As a result, the new Store comes with powerful searching, sorting and filtering capabilities.

You can filter by asset type, search asset names and descriptions and then order search results on a host of criteria.

Fresh New Content

Recently, the Asset Store content was, let’s just say, beginning to show its age. We are now in a world of HDR skyboxes, PBR materials and high polygon meshes. So it made sense to erase old store items and refresh the Store with better, more modern content. We have selected a broad variety of Creative Commons assets from fantastic content sources such as kenney.nl, HDRi Haven, Sketchfab and Khronos’ glTF Sample Models.

If you would have any suggestions for content you would like to be added to the Store, please do let us know!

The Future

There’s still so much we want to do with the new Asset Store! But here are some things we have in mind:

  1. More Content. The important thing to say about today’s update is that it delivers the core infrastructure on which we can iterate. It is now exceptionally easy for us to populate the store with more content. So, in the near term, you can expect to see the range of content expand quite rapidly.
  2. Third Party Stores. Now that we have a solid foundation in place for the Store, we have the ability to host third party stores within the same UI and maximize your choice.
  3. More Asset Types. Today’s launch offers models, fonts, textures, skyboxes and scripts. Next, we want to add audio assets and template assets (AKA prefabs). Template assets in particular are very exciting because you would be able to import fully interactive, visual entities into your projects (such as a drivable vehicle or a controllable character).

What would you like to see us add to the Asset Store next? Let us know on the forum.

Happy creating, friends!

PlayCanvas Releases glTF Viewer 2.0

Today, we are excited to announce the 2.0 release of our glTF viewer.

glTF (or Graphics Language Transmission Format) has become ubiquitous since its introduction in 2015. With support for advanced shading techniques, it is particularly important for graphics intensive applications like product configurators/visualizers. 

With so many companies now relying on glTF to transmit graphics data over the web, it is critical that high quality tools are available to work with the format. This led us to develop v2.0 of our popular glTF viewer.

Let’s take a closer look at what’s new.

Improved glTF Specification Support

The glTF format is managed by the Khronos Group and defines a base specification along with a variety of extensions. The first version of the viewer support 100% of the base spec plus the following extensions:

  • KHR_draco_mesh_compression
  • KHR_lights_punctual
  • KHR_materials_clearcoat
  • KHR_materials_unlit
  • KHR_mesh_quantization
  • KHR_texture_basisu
  • KHR_texture_transform

The new and improved viewer released today adds support for:

  • KHR_materials_emissive_strength
  • KHR_materials_ior
  • KHR_materials_sheen
  • KHR_materials_specular
  • KHR_materials_transmission
  • KHR_materials_variants
  • KHR_materials_volume

These extensions provide developers with the ability to achieve exciting new graphical effects. 

Let’s take a look at three of them.

Advanced Refraction

The volume, transmission and ior glTF extensions can simulate how light is refracted through transparent materials. This leverages PlayCanvas’ grab pass functionality to ‘grab’ and sample the back-buffer.

Realistic Rendering of Fabrics

glTF’s sheen extension enables developers to faithfully reproduce materials with the appearance of certain fabrics. This is incredibly important for production visualization (home furnishings, apparel, vehicle interiors and so on).

Material Variants

Most product configurators allow the user to modify the appearance of a product. For example, a specific style of chair might be upholstered in various fabrics in various colors. Or a pair of shoes might be available in a number of different designs/patterns/colors.

The PlayCanvas viewer now detects any material variants in the loaded scene and permits their selection in the interface.

Rendering Enhancements

The new viewer introduces a couple of interesting features if you care about rendering fidelity. 

First up is a ‘High Quality Rendering’ mode (which is a toggle in the Camera control panel). 

Enabling this feature activates supersampling which is a type of antialiasing that aims to eliminate jagged edges along polygons. It progressively re-renders the scene many times when the camera stops, slightly offsetting and then compositing the rendered image over previous frames. 

You can see both in action below, deliberately reduced in resolution to show the effect:

Also new is sharper reflections for smooth reflective surfaces. The viewer will now use the full resolution skybox cubemap in the engine’s image-based lighting pipeline which looks crisp and far more realistic.

Interface Redesign

Initially, all information and controls for the viewer appeared in the leftmost panel. Viewer 2.0 has been completely redesigned to more intelligently group specific areas of functionality. The leftmost panel remains but now just shows scene info and a tree view showing the loaded scene hierarchy.

Buttons to control viewer settings can now be found at the bottom of the 3D view. These buttons open options for camera, lighting and debug rendering (plus a fullscreen toggle).

If you load a scene that contains animation, animation controls will automatically appear:

The controls allow you to scrub through an animation, select playback speed and even choose which animation clip to play should the file contain more than one.

Lastly, there is also now a button bottom right to download a rendered PNG of the 3D view.

Open Source

PlayCanvas is fully committed to an open source strategy and our glTF viewer is therefore made available to you on GitHub. It is a TypeScript application built on PlayCanvas PCUI front-end framework and, of course, the PlayCanvas Engine runtime.

These open source projects have been years in the making and would not have been possible without the amazing OSS community. So why not explore our various GitHub repositories and consider making some contributions of your own. We also appreciate feature requests and bug reports, so don’t be shy!

We hope you find the new and improved glTF viewer useful for your projects. Stay tuned for further updates to it in the coming months!

Import full model hierarchy into PlayCanvas

The PlayCanvas team are very excited to fully release the Import Hierarchy pipeline feature in the PlayCanvas Editor!

With this feature enabled, any imported FBX will create a Template asset which contains the full node hierarchy as entities representing sub-models of the model. This gives users greater flexibility in manipulating mesh instances in the model directly in the Editor.

Render assets will also be created that can be used with the Render Component and allow users to add an individual mesh instance of a model in the scene.

For example, an imported car FBX model would create several Render assets, doors, wheels, wipers etc. The wheel assets can be used independently from the rest of the car model to create a tire wall.

With the model hierarchy being editable in the Editor, this opens a number of uses that weren’t possible before:

  • Attach other Entities and/or models as part of another model’s hierarchy such as adding a helmet to a character’s head.
  • Move/Rotate/Scale sub-models directly in the Editor such as moving/adding/removing chairs around a house model.
  • Use the Render assets elsewhere in the scene for decoration or customization.
  • Add components and/or scripts to individual nodes such as attaching particle effects to animated parts.

However, please note that while the Model Component is compatible with both the Animation and Anim (State Graph) Component, the Render Component/Import Hierarchy feature is only compatible with the Anim (State Graph) Component.

Going forward, we will be marking the Model and Animation Components as ‘legacy’ but if you have an existing project using these components, please do not worry. None of the existing functionality is being removed and you will not be forced to update projects to the new pipeline for continued development. Although no new features will be added to the Model Component, the PlayCanvas team will continue to fix bugs with the existing pipeline until our next major version (2.0.0) of the engine at the earliest.

You can even mix both pipelines in the same project if you wish to take advantage of the features in the new pipeline in an existing project. However, please bear in mind that this can add complexity to the project code.

The Import Hierarchy asset task will be enabled by default for newly created projects. If you would like to use this feature in your existing project, please consult User Manual for details.

Useful Links