Computational Arts Initiative (CAI)

Computational Arts Initiative a.k.a. CAI is the team we formed in JetBrains in Munich office around 2017-2018 with the designer Sergo Golovachev as its leader. I was a developer in this team till 2024. Some details on how the team was formed:

When I was working in Animatron, Sergo was the ideologist of the project and while all the “core” team of Animatron was located in Boston and so we had many remote meetings, with Sergo we usually had discussions and debates over coffee about different artistic things, in person. I was always (and still, as you may notice) inspired of how art connects with programming or mathematics (a degree that I definitely don’t have).

By noticing the bareable, but itching, struggle among the Design team of JB in creating dozens of similar marketing materials that should strictly follow the brand rules (e.g. YouTube tutorials backgrounds, the repeating parts of the website, banners of all kinds…), we decided to join our strengths and help in finding a ways to generate all those programmatically as close to the brand guidelines as possible, with total pre- and pre-control by fellow designers. First year (years?), we were working without leaving our main responsibilities behind (I did it few times to be honest), but then many friendly people suggested us to come out and form and name the team. And so the CAI appeared.

During years we developed new approaches to generative graphics every year or less, and produced not only banners, but also splash screens for your favorite IDEs of JetBrains. We hired more talented people into the team and with them we were among the first on the market who has used AI generation, controlled by designers of course. Using past tense is definitely wrong though, the team keeps creating new things:

Computational Arts Initiative Website.

Many of the projects are open-sourced by us at https://github.com/computational-arts-initiative.

Projects

The list of projects created by CAI till time (I tried to keep chronological order) (the projects where I participated are marked with ł):

• Lorenz ł — uses Lorenz-Attraktor, our first animation using WebGL that appeared at JetBrains website; #webgl
• Metaballs ł — the second animation, based on Metaballs Isosurfaces in WebGL, it was used on the website as well as for IDE splash screens and desktop backgrounds; #webgl
• Seti łł — this one was the mix of the static layers based on Flat Surface Shader in mix with some other techniques such as mirroring etc.; and it used my RPD (Reactive Patch Development) project for creating the art; #canvas #visual-programming
• Origami łł — on the base of the same Flat Surface Shader we created the animation; Here, the first version of Tron was developed and used; #webgl
• CoverBaker — the internal editor for all the covers and banners that uses other generators when possible;
• Raygun — our team was searching for the ways to create nice ray structures that could conform with JetBrains style at the time; #canvas
• Plasmatic — plasmatic shaders that allow create rings as well as flame structures; uses Tron as the interface; #webgl
• Neobeam — another interecting try to create rays, this time with neon lighting; uses Tron as the interface; #webgl
• Kvant łł — we decided to research the Wave Function Collapse algorithm and I tried to redevelop it in Elm language;
• Tron łł — inspired by dat.gui and other alternatives, I also noticed that most of the art generators are using the same set of controls, but I also wanted them to look beautiful and use grid approach for placing them; Powered by Elm and SVG; #svg
• Tiler — tiling with a style, first time the designers were not only using and forming our product, but creating the source material for it, in collaboration; uses Tron as the interface; #canvas
• Randolor — custom editor to create characters in the corporate style; #svg
• Barista — creating backgrounds with a lot of small elements in them is also a challenge we tried to ease; #svg
• Dots — the patterns of dots with a lot of configuration and limited by product palettes can form beautiful shapes; #svg
• Noodle łł — Noodle is a separate project of mine which was born from RPD (Reactive Patch Development) and continiued to perfect it in CAI, please read the full description for details; #webgl #svg #visual-programming
• Gradient ł — at KongressJS in Munich I noticed a talk from a woman from Google who investigated how neural networks help create beautiful and soft images (it was around 2020!), so we tried to re-implement these techniques and use them in our own way; #neural-networks #canvas
• Jelly — jelly shapes wandering in space; #webgl
• Waver — the waves of smaller shapes form different structures; #svg
• Limb ł - this project developed & investigated further the idea of using neural-networks in generating beautiful images, but this time also with cross-breeding them, to find the better fit; #neural-networks #canvas
• Eidos - generating new images directly from a neural-network;
• Nautilus ł — the latest design approach of JetBrains uses these sequences of shaded shapes in place of rays, so we created an editor for it;

Talks

TODO

Gallery