The 8th Wall team has been on a mission to supercharge your development by providing you with a complete set of tools to create WebAR content. Our cloud-based integrated development environment, the Cloud Editor, was built from the ground up for reality content development and it is now the predominant way our developers create 3D, AR and VR web applications. We designed the Cloud Editor to give developers superpowers and today we are unlocking a new power by making our biggest update since its launch with the introduction of 8th Wall Modules. 

8th Wall Modules is a comprehensive package manager and configurator built exclusively for the Cloud Editor that allows you to save and reuse components (code, assets, files) across projects in your Workspace. We know that reusing code or other elements in your projects is already a core part of your development workflow. Modules is an integrated solution that enables you to create a library of resources that can be shared and used by your entire team directly within the Cloud Editor. This new feature provides developers with everything they need to create, edit, deploy and import modules into their projects including a module editor, a robust versioning system and the ability to create a visual interface for modules to make project changes without code.

8th Wall Modules aims to increase the efficiency and speed of your WebAR and WebVR development. Using modules, you can free up your time to focus on the unique challenges within a project, get to launch faster, and develop more projects with 8th Wall. The  module resource library you will create for your Workspace will upskill your full-time and freelance team members and increase the consistency and quality of your work. You can also enable cross-functional team members to make project changes without touching the underlying code by adding a visual interface to modules. Finally, the Public Modules created by 8th Wall will help you discover what more you can do with the 8th Wall platform and help you to easily add popular components and new features to your projects.

Find and import modules to accelerate your development 

Reusing assets, files and code is a typical part of the development process. With 8th Wall Modules, we are making this part of the workflow even more efficient by integrating it as part of the Cloud Editor. You and your team can now find and import modules across the projects in your Workspace.  

You can browse and import modules directly from within the Cloud Editor. All of the modules created by you, your team or by 8th Wall, can be accessed using the new “Modules” area in the left-hand menu of the Cloud Editor. The Modules library displays all available modules which you can also search for by keyword. Selecting a module will display its ReadMe, if provided, which can be used to understand how to integrate the specific module into your project code. All modules can be easily added to your project with one click of the “Import” button. Once added, you can begin to customize and integrate the module into your project. 

Make project changes without coding using a module's visual interface 

Modules also provides a way to make project changes without the need to code. A visual configurator can be added to any module to control different options as toggles, string values and more, making it easy to access and extend the code inside your project without directly making code changes.

Adding a visual configurator to your module can help with rapid prototyping and debugging. Values changed using the module visual configurator can instantly be previewed without the need to save and build your code. As such, you can design a visual configurator that can assist in live testing of your project to speed up the development cycle, such as A/B testing a user flow with just a tap of a button or toggling a debug menu on or off. The module visual configurator can also be designed to provide a valuable no-code interface for designers, marketing managers and other members of your team to make changes to your project without accessing the underlying code. This can be useful for elements such as fonts, colors, logos or other marketing parameters such as price points and copy.  

Developers can create parameters that are editable for their modules by using the module config builder. The module will subscribe to the parameters you make available which will dynamically change based on user input. The module config builder automatically starts with one parameter group available. Parameter groups can be used for logical divisions of parameters which are then expressed and grouped visually when using your module in a project. You can easily add, rename or re-order parameters using the config builder to design a visual configurator that is unique to your module.   

Create modules for your entire team to use

8th Wall Modules provides you with tools to create and edit modules both in and outside of a project. You can create modules to componentize code, assets or files, especially for elements you use on a regular basis such as a custom loading screen, third-party analytics or branding. Modules can also be created with a visual configurator to provide an interface to make changes to the project without touching the underlying code.

Developers can create modules outside of a project by accessing the new “Modules” area when logged into 8thwall.com. The “Create Module” button will open the module editor to start developing, including a prompt to add metadata such as a module title and cover image, which will aid with discovery of this module when it is added to your library. While all modules are created using the Cloud Editor, module development is slightly different from project development as they cannot run on their own. As such modules can only be previewed when imported and run from within a project. 

Modules can also be created and edited from within a project by accessing the “Modules” area in the left-hand menu of the Cloud Editor. Developing a module in a project has the advantage of previewing the module in action as you are developing it. This flow also encourages aspects of your project to be componentized into a module so that they can be used by you and your team in future development efforts. To turn your module into a powerful resource for your team, you can add a visual configurator using the module config builder and include a ReadMe in your modules file directory. The ReadMe can be formatted using markdown and can include assets like pictures and video to provide further instruction on its use.

Deploy module updates automatically using version control 

One of the key benefits of modules is the ability to deploy changes made to your module across all of the projects which make use of it. As projects which make use of modules will rely on these components to function, we have spent a considerable amount of effort to provide the right version control tools for module releases and updates. This includes giving module owners the ability to set the version type for their release and module users the ability to choose which version type they wish to subscribe to for automatic updates. This versioning functionality allows non-breaking module updates to be deployed in projects automatically. 

When publishing a module update, you will be prompted to choose whether the update is a bug fix, new feature, or major release. “Bug Fix” is used for refactored code and fixes for existing issues, “New Features” indicates there has been non-breaking functionality added to your module, and a “Major Release” is meant for breaking changes. Module users can opt to have their projects subscribed to module “Bug Fixes” or “New Features” which will automatically update the module when a new version is available. Projects with modules do not receive automatic updates for “Major Releases” but developers can elect to use a major release in their project by making this change manually. 

In addition to selecting a version type, developers can also mark the version of their module as a pre-release. Users who use this type of module will not receive automatic updates but instead will have to import it manually by selecting the "Pre-release" version in the pinning target. Pre-release modules give developers early access to a module to get early feedback to help refine this resource before it is officially released. 

Build a resource library to give your team superpowers 

With 8th Wall Modules, you and your team can create a valuable resource library of reusable components which are unique to your Workspace. This library can be accessed by all members of your Workspace, including new members, making modules a great way to ramp up new developers who have joined your team. This library can also help increase the consistency and quality of your projects, especially for common elements which you find yourself using across the content you develop with 8th Wall. Your team can find all of the modules available to your Workspace in the new “Modules” tab on your Workspace page when you log in to 8thwall.com or directly within the Cloud Editor.  

In addition to building your own module library, you will also have access to a growing library of 8th Wall created modules. 8th Wall modules are designed to help you quickly add valuable features and key elements to your projects. At launch, our “Public Modules” include our Payments Module, which adds an access pass to your content using our Payments API and a module for Niantic Lightship Maps, which adds an easy-to-use and customizable real-world map to your experience. You can access all of the Public Modules directly from within your project by accessing the Modules area in the Cloud Editor menu. 

8th Wall Modules is another big step in our continued commitment to make the Cloud Editor a powerful development tool to create AR and VR web applications. 8th Wall Modules are available now to all 8th Wall developers. Developers can begin creating their own Workspace modules or access the growing Public Modules library from 8th Wall directly within the Cloud Editor. New developers can get started with 8th Wall by signing up for a 14-day free trial.

We can’t wait to see what you create! 

- - - -

🙌  A big thank you to our developer community for providing us with helpful feedback on our product. We’re continuing to develop and iterate our product using the valuable input that you provide us