Maybe your obsession isn't mesh gradients. Maybe it's fluid sims, delightful micro-interactions, or crazy particle systems. Find the thing that keeps you up at night, then make it - again and again. That's where the real growth happens 💪

Gotta say, kind of clean in light mode 🤔

I love iterating on ideas and techniques, but you need to know when to stop. Here's what I've learned: Keep going when: still discovering, results surprise you, you enjoy it. Move on when: you're bored, it feels like busywork. Your gut knows, just listen to it 🙇

I wrote some words about obsession, repetition and shuhari. Been thinking about this for a while. What do you all think? www.fragments.supply/writing/15-b...

I'm a design engineer in threejs I'm a shader artist in threejs I'm a creative coder in threejs Any questions? 😇

This is a great community - been really enjoying this so far 🙇

I think some of my favourite shader outputs happen by accident Using a loop iterator as an input, altering a colour with noise, reversing the coordinates... Stumbling into these happy accidents is one of the most satisfying feelings in creative coding Embrace the chaos and just try stuff 💪

Some more morning inspiration here I've been following @brettbolton_av for quite a while, and he just dropped a new single https://www.youtube.com/watch?v=fvXkZxrHZ4Q This is the kind of stuff I've always dreamed of doing The way the visuals react and play to his live playing is just magical 😍

People often ask me why I write shaders when AI exists I just love to know how things work. I think that building rad stuff is the best way to learn and grow as a creative developer Also, gives me massive appreciation to all of the amazing shader artists out there 🙇

Ever notice that so much in tech is starting to look the same? Like a copy-paste of itself? Learning to write shaders opens up a whole new world of creativity that actually sets you apart as a dev or artist ✨

After 9 months of hard work, time to take this out of early access and officially put it out into the world! This is fragments.supply, a platform to help you learn creative coding with shaders and three.js So happy with how it came together, but now it's time to rest from the grind for a bit 😪

Heads up: my creative coding platform with shaders fragments.supply is launching out of early access tomorrow! If you've ever been interested in creating amazing, artful things with #threejs, you should check it out (Also there's a sneaky 40% discount until we launch 🤫)

This is basically my internal monologue every single day Don't stop, keep going! ✌️

Curled noise is one of those techniques that can completely transform how your generative art feels Simply layering noise on top of a warped image can create absolutely incredible results - it's kind of shocking I'm honestly still shocked how this turned out 🪄 #tsl #threejs

everyone: good sleep is the most important thing! me: has a 3 year old 🫠

Think pixellation effects are just for retro games? No way! This tiny TSL trick shifts the mood of your work dramatically ✨ I used to find it so hard to share effects between shaders, but these little functions are an absolute super power! #tsl #creativecoding #threejs

I think I have an unhealthy obsession with mesh gradients 😅 I think I've made at least a dozen different versions over the last few years, but the one I made for Fragments might be my favourite yet Made these with TSL and ThreeJS - so fun 😊

I wrote about the final creative coding technique to launch in Fragments: Mesh gradients There's a little bit about how I make these amazing things, plus what's coming up in the last week of early access Check it out here → www.fragments.supply/writing/13-e...

Can noise be beautiful? This is Slate 5 - built entirely with layered noise that somehow comes together amazingly Took me ages and a ton of tweaking to things just right, honestly I'm a bit obsessed with how this flows What does it remind you of? #creativecoding #threejs #tsl

Ever struggle with washed out colours in your shaders? Tonemapping can really help! I adapted some classic tonemap functions to TSL which have really helped! gist.github.com/phobon/63ba9... #tsl #threejs #creativecoding

An underrated part about writing shaders is that just a tiny tweak can completely transform what you get Every change you make, you learn a bit more and those discoveries stack up Then sometimes, you'll stumble on something insanely cool and it feels amazing

I think inspiration is one of the secrets of great art. We're all a sum of our experiences, so we need to utilise those to create things that are personal, or unique to us. Good artists copy, great artists steal - but what parts should we be stealing?

Guys. What shader artists or creative coders inspire you the most? I'd love to find new or under-represented people

Slate 5 #tsl #threejs #creativecoding

Pixel sorting always looked impossible, until I finally cracked the code in my latest deep dive If you're curious how the glitchy goodness works, this one’s for you Catch all the details here → fragments.supply/writing/12-e... #tsl #creativecoding #threejs

fragments.supply builds tools for shader artists, creative coders and design engineers ✨ Kickstart things with #threejs and #tsl

Another TSL trick I’m obsessed with - a clean vignette effect. Drop this into your shaders to add dramatic contrast and make colours pop off the screen ✨ Love how easily you can hit a vibe with just a few lines of TSL. #tsl #creativecoding #threejs

If you’re a design engineer, please learn to write shaders. You can create magic and bring any visual idea to life. Even just some basic skills can open up so many doors. Imagine the things you could create in 6 months if you started today 🧑‍🎓

Slate 4 #tsl #threejs #creativecoding

Fragments early access has been live for just over a week (crazy!), and I wanted to share some updates. Wins, challenges, and more on what's next. Your feedback has been amazing. Keep it coming! 🙏 Full post → https://www.fragments.supply/writing/11-early-access-noise/

😞 Shaders broken on different screen sizes 🤩 Perfect aspect ratio correction in ~3 lines This tiny TSL function gets used in (just about) every single shader I write! What's your most-used shader helper? #threejs #creativecoding #tsl

Slate 3 #tsl #threejs #creativecoding

Slate 2 #tsl #threejs #creativecoding

🚀 I made a little TSL function to add texture to my artwork and it still shocks me how nice things look with it. Makes a huge difference! If you're making stuff with shaders and giving TSL a go, this might be useful for you too. What's your favourite shader effect? #creativecoding #threejs #t

Slate 1 #tsl #threejs #creativecoding

Added a big noise technique breakdown on Fragments. Dives deep into using noise not only as a basis for your shaders, but also how and where to use noise to enhance them. How do you all use noise in your shaders? Let me know 👇 Sign up → fragments.supply with a 40% discount 🙇‍♀ #tsl #threejs

Abiogenic 3

I've done a lot of stuff with some of my raymarching shaders - these weird, liminal spaces. So much can be done with it when you tweak shapes and coordinate spaces. I think it might be my favourite technique 😍 Part of the Abiogenic series I made for Fragments #tsl #creativecoding #threejs

I've been asked a lot about early access for Fragments, so some answers: 📅 Early access ends October 1 🙏 40% percent discount 👀 Full preview of content → fragments.supply/techniques/geometric-shapes/ Huge shouts to those that have joined already ❤️ #creativecoding #threejs #tsl

Shapes, angles, repetition and motion - something so mesmerising when you combine all these things into a shader. Add a little neon glow and cool. shit. happens. ✨ I made this for genuary way back at the start of the year - start of a great journey

Warp 2 A rad variation on the Warp series - the domain here is warped by an SDF square. You end up getting these interesting jagged edged sort of output. I love how much variance you can create with such small changes 🪄 Check it out → fragments.supply/sketches/warp-2/ #tsl #creativecoding

Check out what Ben made if you're looking to upgrade your creative dev skills with shaders in threejs!

Here's another shader from the Eidolon series - a really rad variation that involves masking with circle repetition. Each band here offsets and rotates the shape at different speeds - super trippy effect 🪄 Made this sketch when I was looking at domain repetition on Fragments 🙇‍♀️

(continued - fragments.supply content) September 10: Noise - how I use it as a basis for a piece, and how I use it to enhance others September 17: Pixel Sorting - a full, extensible pixel sorting component (really fun) September 24: Mesh Gradient - those lovely swirly, grainy gradients

Over the next month, I'm going to add some more creative coding technique deep-dives to fragments.supply - these are a result of some really fun and interesting experiments I've been doing over the last few months. I have a lot planned (will have to put this in separate posts for now)

Genuary 17 It took me a while to realise how you could generate a ton of shapes in a fragment shader. Loops are neat 🪄 Check it out → https://www.fragments.supply/sketches/genuary-17/ #tsl #creativecoding #threejs

I made a couple of companion projects for fragments.supply that you can easily clone and get up and going with #threejs and #tsl. I've set them up with some of the utils from Fragments: R3F → github.com/phobon/fragments-boilerplate Vanilla → github.com/phobon/fragments-boilerplate-vanilla

There's a ton of depth to help you started creating your own amazing art, or integrate shaders into your professional work This is a labour of love for me, a true creative outlet I'm incredibly proud of and passionate about, and I hope you love it too! Check it out - 🚀 fragments.supply 🚀

I built a platform to help you learn #creativecoding with #shaders and it's finally open for early access! 🪄 Check it out → fragments.supply All made with #threejs and #tsl: 7+ technique deep dives, 15+ utilities to supercharge your process and over 110 shader sketches with full breakdowns

Genuary 29 Loved how this one turned out - a combination of noise, domain repetition and geometric shapes. A lot of simple techniques layered on top of each other Check it out → https://www.fragments.supply/sketches/genuary-29/ #tsl #creativecoding #threejs