Solidifying Simplicity
--
By now, I hope you’ve heard about our core mission for Babylon.js. We want to make one of the most powerful, beautiful, simple, and open web rendering platforms in the world.
These 4 words carry a lot of meaning for us. We want Babylon.js to be a very POWERFUL platform that can do a ton of heavy lifting for you. We also want it to be capable of rendering the most visually BEAUTIFUL images. It will also always be completely free and OPEN source. Forever.
Today I wanted to take a minute to take an in-depth look at what it means for us to make Babylon.js SIMPLE.
To start, we have to acknowledge the hardest part of simplicity — what’s simple for one person is not necessarily simple for all. For a web developer, simplicity might be building elegant javascript code, but creating 3D assets might be really intimidating. The opposite is often true for 3D artists. We all have different natural gifts, experiences, and passions that give each of us a unique background and skill set. Simplicity in and of itself is actually a pretty subjective thing, which makes it a little harder to define.
As we were building version 4.1 of Babylon.js, we stumbled across something really wonderful with the Node Material Editor. Not the tool itself (which is truly amazing), but rather an example — shining like a bat-signal in the sky — helping us define what simplicity looks like.
What we discovered was a philosophy. At a 60,000 ft. vantage point, the Node Material Editor is a tool to help you write less code. Quite a bit less code in some cases. It is a tool that replaces writing complex GLSL code with a visual node tree. For example, it could take something like what you see on the right half of the image below, and replace it with what you see on the left half.
For many, creating the node graph is far faster and less error-prone than writing code to accomplish the same result.
And that was the beginning of our “AHA” moment.
OK, follow this train of thought: Babylon.js is a development platform, a JavaScript library for helping you create fantastic web experiences. JavaScript is the keyword in that sentence. Babylon.js creations are code. They will always be code, and so “creating” code is not just important, it’s foundational.
Why put the word creating in quotes? This “AHA” moment really came down to the simple realization that while code will always be the end result, creating that code doesn’t necessarily mean writing the code.
In the case of the Node Material Editor, even though you use a node-based UI to build your shader, under the hood we compile that node tree back to glsl. NME is a tool for creating code, without writing code!
And that’s where our philosophy on simplicity was truly born.
“Tools to help you CREATE code”
It turns out that regardless of your background, experiences, or skill set, creating code isn’t the hurdle — writing code is. From the most seasoned developers to folks who have never written a line of code in their lives, everyone benefits from 2 things:
- Going faster.
- Making fewer mistakes.
It turns out, that by creating tools that replace/augment parts of the code writing process, we repeatedly achieve both of these benefits.
This may sound obvious, and looking back it certainly was, but the journey to get to this realization and philosophy has greatly strengthened our focus, understanding, and resolve of what we are trying to achieve when we say “Simple.”
In fact just days after the Babylon.js 4.1 release, we began to look all over the platform and ask ourselves one question. “Where are areas in Babylon where we require you to write a lot of code?” Those are the areas we can look at first to create tools that speed up the development process, decrease the amount of errors written, and simplify the process of creating Babylon experiences.
Ideas instantly began to spring up — opportunities for us to create more tools to simplify more pieces of the puzzle.
The very first thing to pop up on everyone’s mind was particles. Our particle system is incredibly powerful and has a LOT of properties and capabilities. The problem is that the more of those capabilities you want to use, the more code you have to write…well not anymore. Just days after the 4.1 release, we merged the new Particle Editor into Babylon for our next release!
Check out this YouTube playlist by the Honorable Judge Deltakosh on how it works!
Today I’m super happy to share our next addition to the “Make Babylon.js Simple” initiative: playground templates!
The Playground is the single best place to get started with Babylon.js. It’s probably the most used tool in the entire platform. Write code on the left, see results on the right. Pretty simple yeah? Well as we discussed earlier, any time code is written, that’s an opportunity for us to ask that game-show-like question, “Can it be Simplified?”
Playground templates are our brand new method for giving you hotkey access to some of the most commonly written code snippets in Babylon.js. In the playground, simply hit CTRL+SPACE to bring up this little beauty:
Notice those first entries? Simply select the template you want, and
A brand new perfectly constructed line of code pops right into the Playground for you. On top of that, all you have to do is press tab to jump to the next property for you to fill in! Here’s a video that shows it in action:
It’s far more speedy and much less error-prone!
So that is the story of how we solidified our own understanding of what it means to make Babylon.js more simple to use. It’s not about replacing code…the code will always be the foundation. It’s building tools to replace WRITING code with faster and more accurate ways to CREATE your code.
