Into the world of Chrome Experiments
Tags: javascript, webdev, experiments
Published: 2019-02-23 17:44:02

**This post is taken from [my blog](https://areknawo.com), so be sure to check it out for more up-to-date content 😉**

I have written about how great current web development tools, libraries, frameworks etc. are right now many, many times in my previous posts. I've also talked about growing users demands for **better UI**, **animation**, **experiences** and all that stuff. So, I might have repeated myself some times by now, but IMHO it's just such a **great time to be a web developer**! What's more, I can assure you that the future looks even brighter! 🤯 With web on-going, rapid development, there are more **tools**, **APIs**, **functionalities**, and ideas available every day. And, in this article, I would like to showcase you what the future holds, or rather, what's possible with currently accessible tools! With that said, let's push the limits and explore some best of the best **web experiments**! Enjoy! 🚀

# A word on Google dominance

Before we jump into all this awesome, futuristic stuff, let's first explore some background behind all this. More specifically I would like to talk a bit about the origin of these mentioned web experiments. These are more specifically known as **Chrome Experiments** or even more generally - [**Experiments with Google**](https://experiments.withgoogle.com/). Which brings us to, naturally, **Google**. 🙂

![img](https://areknawo.com/content/images/2019/02/Screenshot-from-2019-02-21-21-00-35.png)

So, at the time of writing this post, **Google Chrome** is the most wide-used web browser on the market. Having control over [**more than half**](http://gs.statcounter.com/browser-market-share) of the entire web browsers market, there's no doubt about its dominance. You might like it or not, but that's a fact. 🤔 If you think this kind of monopoly isn't good, then I can comfort you with only one more fact - it's not as bad as it was back in the IE times (90%+ market shares). 😅 And if you'd dig even deeper, you would find even more interesting stuff. Chrome is based on open-source project **Chromium**, which, besides Chrome itself, powers many other browsers, like **Opera**, for example. So, adding this up, Chromium-based browsers can have as much as 70% - 80% or more of market shares. And, with some rumors about Microsoft's Edge browser going to migrate to Chromium too, this number will most likely continue to grow.

With this data, we can clearly see, that the web browsers market is currently heading into Chromium-based **standardization**. I don't really know what to think about this all. On one hand, Chromium is implementing the latest features really fast and it's an open-source project. But on the other hand, most of its contributions and control over this project is in Google's hands, so that means that the web is so, too. And yet having a kind-of standard, without caring about cross-browser compatibility would be great, but... Yeah, I'll leave this for you to decide. 😉 It's not the topic of this post anyway...

The point of all this was just to show, what's going behind the scenes. Chrome Experiments I'm talking about are backed by Google and that's for one particular reason. Google, being the leader in web browsers industry, implements the latest **standards** and **functionalities** ASAP. And, as they wanted to display this fact, they created and backed-up Chrome Experiments.

# Chrome Experiments introduction

So, what are these Chrome Experiments in-depth? Well, by now we know 2 things: it's a part of Experiments with Google and was created to display features of modern web standards that are constantly being implemented by the Chromium project. Now, which web features are we talking about? Well, quite a few actually. 🙂 Most of the experiments focus on **WebGL** (especially 2.0) and **Web VR** which are the latest trends. There are also examples of **Web Audio API** and **Canvas API**. Also, great many of these include some **AI** capabilities which also have their own Experiments with Google collection - **AI Experiments**. Yup, that's true, these experiments go way beyond the web with even more AI, VR/AR, and cultural stuff. But, as we're focusing on the web right now, these are just some side-notes. 🙃

If you didn't get what experiment stands for yet, it's just a nice showcase of the given feature. With that said, why should you even care about such things? There are a couple of reasons actually:

- **Inspiration** - Such experiences can definitely let you know about what's currently possible on the web. You can easily get **inspired to create** similar things yourself!
- **Learning** - The source code of great many of experiments is available for everyone! Thus, if something interested you, you can freely just **grab the code** and learn how to get the job done. 😁
- **Entertainment** - This one is obvious. Many of these experiments are **very interesting**. AI, image recognition, Web VR stuff, Web GL games, and all others provide just that - **fun**.

So, generally, an exploration of these experiments is nothing more than something new. So, if you have some free time, sit back, relax and go into any of the links below to experience the potential of **the modern web**! 🌟

# Experiments

## [Biomes](https://demo.marpi.pl/biomes/)

![img](https://areknawo.com/content/images/2019/02/biomes.png)

**Biomes** created by **Marpi** is a WebGL experience that generates **pixelated 3D biomes** based on **noise randomization**. With additional colors, this demo looks stunning and definitely requires a good graphics card. 👍

## [The Chaos Game](http://andrew.wang-hoyer.com/experiments/chaos-game)

![img](https://areknawo.com/content/images/2019/02/chaosgame.png)

**The Chaos Game** is yet another GPU-hungry demo. This time it is an **attractor-based fractal generator** ⚒ made using Canvas API and React by **Andrew Wang-Hoyer**.

## [VoxSculpt](https://jsh.sh/voxsculpt/src/)

![img](https://areknawo.com/content/images/2019/02/voxsculpt.png)

**VoxSculpt** is a nice WebGL application that allows you to create your own **Voxel-based 3D models**. You can sculpt or paint the blocks one-by-one. You have access to different colors brushes and more. When you're done with your design, you can export it to image or *".vox"* format. Made by **Josh Shadik**.

## [Paper Planes](https://paperplanes.world/)

![img](https://areknawo.com/content/images/2019/02/planes.jpg)

**Paper Planes** is one of my favorite experiments. It's a WebGL experience where you can catch, stamp and create your own's and other's **paper planes**. You can use the **PWA** on your smartphone to do all those things with respective **real-world gestures**! You'll know what I mean when you'll try it yourself. 🎉 Sadly, there's no source code available for this one. But most likely the **WebGL** and **Accelerometer**, **Device Orientation** and **Web Audio APIs** were used. Made by **Active Theory**.

## [Cube](http://www.playmapscube.com/)

![img](https://areknawo.com/content/images/2019/02/cube.png)

**Cube** is a little WebGL and Google Maps game. Here, you rotate your **3D cube** with small **3D models of cities** like New York and Tokyo on each side. Your task is to make the ball get to the right place. But, in general, the 3D cities cube is just so gorgeous to watch! ⚡ Made by **Google Maps** team.

## [Tendrils](https://epok.tech/work/tendrils/)

![img](https://areknawo.com/content/images/2019/02/tendrils.png)

**Tendrils** is a WebGL-based **music particle-based** **visualizer**. But there's more to this experiment than simple visualization (which in fact is stunning as well). You can actually **interact** with generated particles with your microphone (sound) and camera (movements). Now that's interesting, isn't it? Made by **Eoghan O'Keeffe**.

## [Origami simulator](http://apps.amandaghassaei.com/OrigamiSimulator/)

![img](https://areknawo.com/content/images/2019/02/origami.png)

**Origami simulator** is as the **origami** **folding** simulator. If you don't already know, origami is a Japanese art of paper folding to create different forms and models. With this tool, you can exactly see, how a piece of paper becomes a 3D origami model. You can also export the **visualization** and **import SVG** file with specified folding lines, to see your model visualized. Made by **Amanda Ghassaei**.

## [Teachable Machine](https://teachablemachine.withgoogle.com/)

![img](https://areknawo.com/content/images/2019/02/Screenshot-from-2019-02-21-20-01-44.png)

With **Teachable Machine**, we're entering the **AI** field. This experiment allows you to teach the machine to react to certain gestures (through the camera) with respective **GIFs** or sounds. It's really simple, but it can showcase you the magic behind AIs. With source code available and based on **deeplearn.js** (**tensorflow.js** predecessor) you can get into AI programming basics relatively easily. Made by **Google Creative Lab** team.

## [Quick, draw!](https://quickdraw.withgoogle.com/)

![img](https://areknawo.com/content/images/2019/02/draw.png)

**Quick, draw!** is a simple AI-related game. What's basically going on here is, you're trying to **doodle** given drawing in the specified amount of time and **AI** (neural network) tries to guess what it is. It's interesting, especially the way it works under-the-hood. Sadly, we'll never know that as there's no source code available. Made by **Google Creative Lab team**.

## [Google Shadow Art](https://shadowart.withgoogle.com/)

![img](https://areknawo.com/content/images/2019/02/shado.png)

**Google Shadow Art** is a truly impressive experience. It was created with the help of **tensorflow.js** AI. Here, the neural network tries to **guess** what **shadow** are you trying to create (with the help of camera) and **displays the illustration** for that. It's really interesting, especially with source code available! Made by **Google ZOO & bit.studio** teams.

## [Semi-Conductor](https://semiconductor.withgoogle.com/)

![img](https://areknawo.com/content/images/2019/02/Screenshot-from-2019-02-21-20-34-02.png)

With **Semi-Conductor**, you can become the conductor of your own virtual orchestra! Just move your baton in front of the camera and hear the music. Made by **Google Creative Lab** team with help of AI - **tensorflow.js** and **PoseNet**.

## [Bagan](https://artsexperiments.withgoogle.com/bagan)

![img](https://areknawo.com/content/images/2019/02/Screenshot-from-2019-02-21-20-19-08.png)

**Bagan** is an immersive WebGL and **Web XR** visual experience. It's an impressive tour of old temples and cultural monuments. It takes advantage of the latest Web XR API, so be sure to enable it in your flags before continuing. And, enjoy the view! Made by **Google Art & Culture** team.

# There's more!

So, above you have some of my personal bests of Chrome Experiments. Did I miss some? Probably a **thousand** or more. 😂 The point is, there's a lot more for you to discover and this article to handle. Just remember to **keep an open mind** and **get inspired** by the work of others. Also, if you want, you can contribute to this enormous collection of demos, by submitting one of your own! That's all for now. 🌟

As always, if you liked this post, consider [**checking out my personal blog**](https://areknawo.com). Also, follow me [**on Twitter**](https://twitter.com/areknawo) and [**on my Facebook page**](https://www.facebook.com/Areknawos-Blog-770620059945105) for more interesting content. 😁