Robotic simulations on the web: education, dissemination and competition organization

5 May 2022

Installing a complete development environment for robot simulation may be a tedious task: it might involve installing dependencies to run specific deep learning libraries, or certain versions of Python, or plugins to have access to certain features. Although this kind of effort is acceptable for a researcher, it might not be something a reviewer or fellow researcher will easily do to check the work done by a colleague. In order to provide a solution to this issue, in the context of the OpenDR project Cyberbotics aims to make Webots simulations both available and interactive on the web.

Although it was already possible, to an extent, to have simulations on the web, one of the major limitations of the previous approach was that the old web 3D visualizer relied on the three.js library, which although functional, it suffered from a number of visual bugs and discrepancies compared to the rendering produced by the Webots Rendering ENgine (WREN). Instead of trying to match the ‘three.js’ based renderer with the desktop one, WREN was instead ported to WebAssembly, solving the issues at the root.

Comparison between desktop rendering (left), old engine based on three.js (middle) and new engine based on WebAssembly (right).

With the fidelity of the rendering on the web matching what can be achieved with the desktop version of Webots, it was then possible to expand and improve the tools and backbone that allows for simulations to run on the web.

In this context, currently three tools are available on the web:


Scene showing Spot by Boston Dynamics along with sliders to see the range of its joints.

Generally speaking, scenes are static, and are typically used to showcase a new robot or environment. The main advantage of a scene is that it can be interactive. Contrary to for instance an image, in a Scene you can change the point of view, zoom in and out or use sliders to highlight the location of the joints and their limits. In the context of a competition, participants would also be able to assemble their robot based on a predefined library of components and view the rendering of the resulting robot directly in the browser, without having to install anything on their machine.

This and other scenes are available here:


Example of animation:

Contrary to Scenes, Animations are 3D recordings. Their purpose is mainly as a dissemination tool to showcase the achievements of a research effort, for instance a novel swarm algorithm, or the robustness of a self-driving approach recently published.  An alternative use-case for animations is in the context of international competitions and benchmarks. Given a task, participants can develop their algorithms on their local machines and when they are satisfied, they can upload them so that their solution can be tested against a benchmark task or other competitors. Based on the result of the simulation, it then becomes possible to automatically generate an animation of the match and update the scoreboard accordingly. Both the task of running the match and the generation of the animations can be automated, hence allowing the organization of large international competitions with a small overhead for the organizers. An example of this was RoboCup, an international robot soccer organizer which, due to the pandemic, moved to a Webots-based simulated competition. An example of one of the matches is available here.

Like scenes, animations can be interacted with, but since they are effectively a pre-recording the result cannot be altered in any way, this is where web simulations come into play.

Web Simulations

The purpose of web simulations is to rely on the strengths of the simulator while making its usage more accessible. Web Simulations shine particularly in education, as they don’t require the installation of the software by the students which, instead, can program the robot controllers directly in the browser and see the result immediately. 

Editor and simulation on the web for a benchmarking task.

Web simulations can also be a powerful dissemination tool and their advantage compared to Animations is that they are dynamic, allowing users to alter the behavior and see the effect of these changes, resulting in a deeper level of interaction.

For instance, let’s consider this web simulation, based on the paper by John A. Nyakatura et al.

When the simulation is loaded, press ‘w’ to open the robot window and press play to run the simulation. By changing the walking frequency and the height parameter, for instance, one can observe how these affect the locomotion of the bio-inspired robot.

With these tools, the objective is to provide to OpenDR partners and other researchers alike what they need to disseminate their results and achievements and, also, as a way for the OpenDR toolkit to be discovered, to demonstrate its potential and expose it to an audience as wide as possible.

Authored by: Daniel Dias and CYB team

Cyberbotics Ltd, Switzerland