Sketches120Writing15

Fragments

Learn creative coding with shaders. For design engineers, creative coders and shader artists: techniques, tools, deep dives. Powered by ThreeJS and TSL.

Be the first to know what's next

2025 Phobon

phobon.io↗Shadercraft↗

Pages

Home↗Techniques↗Utilities↗Sketches↗Writing↗

Contact

X @thenoumenon↗hey@fragments.supply↗
All rights reserved.
Building Fragments — Early Access
↑
Early Access Launching September 3Getting StartedTechnique Deep DivesUtilitiesSketch BreakdownsBoilerplate ProjectsWhen can you expect updates?How much will Fragments cost?How much will Early Access cost?Student discounts
↵Writing
←→

Building Fragments — Early Access

Let's talk about what Early Access is, and what you can expect from it

Early Access Launching September 3

Before I head off for some sun and sand, I wanted to give you all a quick update about what early access is, and what you can expect from it. I want Fragments to be a stellar experience for you all out of the box, but I also want to build and evolve it based on your feedback. So, I want to open up Fragments early so you can jump in and start building and refining things together. I really want you to succeed with Fragments, and I think this is the best way to do it.

I want to keep Early Access open for at least 1 month, so that I can get a good sense of changes and improvements that I can make based on your feedback - it's very much appreciated.

So, for early access here's what will be available:

Getting Started

I've created a section to get you all oriented with the platform, and how to use it, along with a bunch of more general, or beginner information about Three Shading Language (TSL) and how it relates to something like GLSL. From early feedback, this has been a bit of a hurdle to overcome for people who are familiar with GLSL, but not super familiar with TSL. So, while not completely comprehensive - I do assume that you'll learn by doing - I think it's a good leg up to get going.

Technique Deep Dives

Next, we have 7 of the 10 technique deep dives available:

  • Thinking in Code - A comprehensive look into creative coding process, and how to experiment with shaders
  • Geometric Shapes - Focused on how to use shapes to create (almost) any effect - this is available now
  • Procedural Color Palettes - Different methods for creating interesting color palettes, and how to manipulate them
  • Domain Repetition - Create interesting patterns and warp them into things shaders are great at
  • Flow Fields - An advanced topic covering creating flow fields with compute shaders
  • Kaleidoscopic Fractal - Beautiful, self-referential patterns with simple transformations
  • Raymarching - Another advanced topic covering creating 3D scenes and lighting with raymarching

Fractal warping sketch

I had originally planned on having 4 of the 10 available, but as luck would have it - I've been able to get a bunch of time working on these things with a toddler who has really temporamental sleep patterns 🫠

Overall, I'd estimate there's probably around 8-12 hours worth of content just in these 7 sections depending on your skill level and how much time you want to spend on things. I'm really happy with how these have turned out so far, with 3 more to come.

Utilities

Here, there are 16 themes of utilities available, ranging from full React components, to several TSL functions that can help make your life easier when working with shaders. This is something that I will continually be adding to as time goes on, and as more of my own sketches take shape.

Sketch Breakdowns

This is maybe the area that I'm feeling the most crunch at the moment. There are 120 sketches in the collection; they all have full, commented source code, and at current count, 70% of those sketches have breakdowns of where I think the interesting parts are. I'm aiming to get all of these ready for Early Access, but if not, soon after. This is part of the ongoing process that I'm working on right now.

Gravity 6

Boilerplate Projects

I've created two boilerplate projects to get you started working with Fragments and creative coding. I have one that is React specific and one that is Vanilla flavored, depending on how you like to work.

There are some problems when it comes to private repos and giving access automatically, so I'll see how this all goes. If it turns out to be really difficult, I'll likely make these projects public so they're really easy to just pick up and run with.

When can you expect updates?

After launch, my current aim is to release each of the remaining technique deep dives as they're ready - which is a little vague, but as they're just past the first draft stage, there's a lot of room for improvement. I've really enjoyed the process of writing these - it involves a lot of experimentation, so even more sketches & corresponding breakdowns will come out of them.

I actually have a lot of ideas for more techniques to add in the future, but I haven't put a lot of thought to them beyond the really basic concepts yet.

How much will Fragments cost?

After Early Access finishes, Fragments will cost $149 USD. I wanted to strike a balance between making it really accessible, and something that reflects what I think the amount of value you can unlock with it is worth. This is a passion of mine and I've poured a massive amount of myself into it, so I want to be open and up front about this now to set expectations.

How much will Early Access cost?

Early access will significantly discounted at $90 USD (40% off). This is a massive thank you for joining the journey early. This represents the largest discount that I'll ever offer for Fragments, so if you jump in now, it will be the best possible price.

Student discounts

When I launch Fragments, if you're a student, just send me a message with proof of enrollment, and I'll send you a coupon code. A message from a .edu domain is enough proof 😊

Abiogenic 3

Phew - that's more than I expected to write, but as it turns out - I had a lot to say! So, for the next couple of weeks, I'll be less active online, and (hopefully) getting some sun and escaping the winter here in Australia! Really excited to finally get this out, has been a really long time coming.