๐—ช๐—ต๐—ฎ๐˜ ๐˜„๐—ฒ ๐˜‚๐˜€๐—ฒ๐—ฑ ๐˜๐—ผ ๐—ฝ๐—ฎ๐˜† ๐—ฎ ๐—ช๐—ฒ๐—ฏ๐—š๐—Ÿ ๐—ฑ๐—ฒ๐˜ƒ๐—ฒ๐—น๐—ผ๐—ฝ๐—ฒ๐—ฟ ๐—ณ๐—ผ๐—ฟ, ๐—œ ๐—ฝ๐˜‚๐˜ ๐˜๐—ผ๐—ด๐—ฒ๐˜๏ฟฝ...๐—ช๐—ต๐—ฎ๐˜ ๐˜„๐—ฒ ๐˜‚๐˜€๐—ฒ๐—ฑ ๐˜๐—ผ ๐—ฝ๐—ฎ๐˜† ๐—ฎ ๐—ช๐—ฒ๐—ฏ๐—š๐—Ÿ ๐—ฑ๐—ฒ๐˜ƒ๐—ฒ๐—น๐—ผ๐—ฝ๐—ฒ๐—ฟ ๐—ณ๐—ผ๐—ฟ, ๐—œ ๐—ฝ๐˜‚๐˜ ๐˜๐—ผ๐—ด๐—ฒ๐˜๏ฟฝ...
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
๐—ช๐—ต๐—ฎ๐˜ ๐˜„๐—ฒ ๐˜‚๐˜€๐—ฒ๐—ฑ ๐˜๐—ผ ๐—ฝ๐—ฎ๐˜† ๐—ฎ ๐—ช๐—ฒ๐—ฏ๐—š๐—Ÿ ๐—ฑ๐—ฒ๐˜ƒ๐—ฒ๐—น๐—ผ๐—ฝ๐—ฒ๐—ฟ ๐—ณ๐—ผ๐—ฟ, ๐—œ ๐—ฝ๐˜‚๐˜ ๐˜๐—ผ๐—ด๐—ฒ๐˜๐—ต๐—ฒ๐—ฟ ๐—บ๐˜†๐˜€๐—ฒ๐—น๐—ณ ๐—ถ๐—ป ๐Ÿฎ ๐—ฑ๐—ฎ๐˜†๐˜€. ๐—ฆ๐˜๐—ฟ๐—ฒ๐˜€๐˜€-๐˜๐—ฒ๐˜€๐˜๐—ถ๐—ป๐—ด ๐—š๐—ฒ๐—บ๐—ถ๐—ป๐—ถ ๐Ÿฏ.๐Ÿญ ๐—ฃ๐—ฟ๐—ผ ๐˜๐—ผ ๐˜๐—ต๐—ฒ ๐—บ๐—ฎ๐˜… ๐Ÿคฏ The previous post, where I recreated the first part of our Three.js animation from izum.study with the help of a neural network, got a lot of reactions. So I decided to go further and take the experiment all the way to the end. ๐—š๐—ผ๐—ฎ๐—น: build the FULL site animation using prompts only. Without a single line of code written by hand. So you understand the scale โ€” back in the day, a live developer used to make a similar animation for us for a whole month, and it was accompanied by constant nerve-wracking and edits. ๐—ก๐—ผ๐˜„ ๐˜๐—ต๐—ฒ ๐—ฟ๐—ฒ๐˜€๐˜‚๐—น๐˜ ๐˜„๐—ฎ๐˜€ ๐—ฟ๐—ฒ๐—ฎ๐—ฑ๐˜† ๐—ถ๐—ป ๐Ÿฎ ๐—ฑ๐—ฎ๐˜†๐˜€. ๐—”๐—ป๐—ฑ ๐—ถ๐˜ ๐—ด๐—ฒ๐—ป๐˜‚๐—ถ๐—ป๐—ฒ๐—น๐˜† ๐—ถ๐—บ๐—ฝ๐—ฟ๐—ฒ๐˜€๐˜€๐—ฒ๐—ฑ ๐—บ๐—ฒ. Gemini 3.1 Pro produced a fully working project: a wave of thousands of particles collapses into a 3D sphere on scroll, then smoothly breaks apart into three separate spheres (like in the original) and merges back. All of this is driven by GLSL shader math and tied to scroll via GSAP. ๐—ช๐—ต๐—ฎ๐˜ ๐—œ ๐—ต๐—ฎ๐—ฑ ๐˜๐—ผ ๐˜๐—ถ๐—ป๐—ธ๐—ฒ๐—ฟ ๐˜„๐—ถ๐˜๐—ต: โšก Morphing logic. Splitting one form into three with particle flow is complex geometry. The neural net wrote the shaders for a smooth split and reverse merge by itself. โšก Synchronization with GSAP. Camera movement, scaling, and the split triggers are perfectly fitted to the page scroll. After that, all that was left was to bring everything to the final look and polish the animation so that it feels as smooth live as in the original. What used to require a month of work from a dedicated specialist and a solid budget is now solved over a weekend. You just need to act as the art director and steer the modelโ€™s logic correctly. Neural nets really are changing the rules. ๐—ฅ๐—ฎ๐˜๐—ฒ ๐˜๐—ต๐—ฒ ๐—ณ๐—ถ๐—ป๐—ฎ๐—น ๐—ฟ๐—ฒ๐˜€๐˜‚๐—น๐˜ ๐—ณ๐—ฟ๐—ผ๐—บ ๐Ÿญ ๐˜๐—ผ ๐Ÿญ๐Ÿฌ ๐Ÿ”ฅ And the main question: what do you think โ€” is it already time for WebGL developers to start quietly updating their resumes, or can the leather bags still sleep peacefully for now? Write in the comments ๐Ÿ‘‡
Back to feed
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started