Writing about shaders and creative coding.

Get new posts straight to your inbox!

  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...
  • Loading...

Fragments will be open for enrollment soon.

Enrollments are closed for now ↓

Enrollments will be open for a limited time later this year! Join the waitlist to get notified when enrollment opens.

Loading...

Fragments

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

Loading...

2025 Phobon

phobon.ioShadercraft

Pages

HomeTechniquesUtilitiesBreakdownsSketchesWriting

Contact

X @thenoumenonhey@fragments.supplyOKAY DEV @phobon
All rights reserved.
Sketches162
Writing29
writing/og/29-fragments-in-2026.jpg
292026-02-10

Fragments in 2026

Fragments transitions to enrollment windows four times yearly with new content each period. Price increases for new members; existing members keep full access forever.

New
Free
writing/og/28-genuary-2026-roundup.jpg
282026-02-03

Genuary 2026 Roundup

A complete walkthrough of every Genuary 2026 sketch I made — 24 creative coding challenges from one color to flow fields, raymarched cities to cellular automata.

Free
writing/og/27-genuary-2026-week-one.jpg
272026-01-06

The first week of Genuary 2026

Genuary 2026 brings 31 days of creative coding prompts. Here's what I learned from tackling the first six challenges with TSL shaders.

Free
writing/og/26-year-wrap-up.jpg
262025-12-30

Fragments year in review

Looking back at the first year of Fragments: community growth, new features, and maybe a little about what's coming next.

Free
writing/og/25-getting-started-with-shaders.jpg
252025-12-16

How to learn shaders: a beginner's guide

Learn shaders the practical way: start with visual tools and playgrounds, copy simple code, break things on purpose, and master the fundamentals.

Free
writing/og/24-bands-series-breakdown.jpg
242025-12-09

Breaking down the Bands series

How to layer distortion, quantization, and color masking to create flowing geometric patterns that feel organic and alive.

Free
writing/og/23-building-a-tsl-boilerplate-where-to-start.jpg
232025-12-02

Building a TSL boilerplate: where to start

One of the biggest hurdles to learning TSL is knowing where to begin. Here's how to build a boilerplate project that gets you coding shaders fast.

Free
writing/og/22-black-friday-2025.jpg
222025-11-25

Black Friday 2025 — 25% off Fragments

25% off Fragments for Black Friday, plus a preview of the new Fragments V2 platform and upcoming Interactivity technique.

Free
writing/og/21-why-design-engineers-should-learn-shaders.jpg
212025-11-18

Why design engineers should learn shaders

A dive into why I think design engineers should learn to write shaders, and how it can unlock a whole new world of creativity and expression.

Free
writing/og/20-making-shaders-respond-like-toys.jpg
202025-11-11

Making shaders respond like toys

Preview the Interactivity technique for creative coding with Three.js—pointer tracking, grid trails, and click bursts that design engineers can ship fast.

Free
writing/og/19-making-pixels-misbehave.jpg
192025-11-04

Making pixels misbehave with distortion

Wave, swirl, and bulge distortion utilities are now live. Here's how they work and why distortion effects are just so fun to use.

Free
writing/og/18-why-some-techniques-stick-and-others-dont.jpg
182025-10-28

Why some techniques stick and others don't

What makes certain shader techniques memorable while others fade away? Here's what I've learned about why some stick in your toolkit forever.

Free
writing/og/17-entering-my-post-processing-era.jpg
172025-10-21

Entering my post-processing era

A fresh batch of shader effects for your creative toolkit. From vintage aesthetics to crazy glitches.

Free
writing/og/16-almost-quit-making-led-effect.jpg
162025-10-15

I almost quit making this LED effect

Hours of tweaking shapes and offsets almost broke me. Here's what happens when you push through the frustration.

Free
writing/og/15-building-mesh-gradients-12-times.jpg
152025-10-08

I built the same thing 12 times and I'll do it again

I've rebuilt the same mesh gradient 12 times. Why remaking the same thing teaches more than making new things.

Free
writing/og/14-why-learn-shaders.jpg
142025-10-01

Why should you learn to write shaders?

A dive into why I think you should learn to write shaders, and how it can unlock a whole new world of creativity and expression.

Free
writing/og/13-early-access-meshgradient.jpg
132025-09-24

Fragments Early Access — Mesh Gradient

Week three of early access: mesh gradient technique launches with custom color interpolation.

Free
writing/og/12-early-access-pixelsorting.jpg
122025-09-17

Fragments Early Access — Pixel Sorting

Week two of early access: pixel sorting technique debuts, new utilities, and expanding the toolkit.

Free
writing/og/11-early-access-noise.jpg
112025-09-09

Fragments Early Access — Noise

Week one of early access: noise techniques launched, community feedback, and what's coming next.

Free
writing/og/10-early-access-launch.jpg
102025-09-03

Building Fragments — Early Access Launch

Early access is live! What's included, subscriber benefits, and the journey from concept to launch.

Free
writing/og/9-early-access.jpg
092025-08-20

Building Fragments — Early Access

What Fragments Early Access includes: pricing, content roadmap, and what to expect at launch.

Free
writing/og/8-fragments-preview.jpg
082025-08-14

Building Fragments — Preview

Preview of Fragments before launch: UI walkthrough, features, and what makes the platform different.

Free
writing/og/7-new-landing-page.jpg
072025-08-06

Building Fragments — A new landing page

New landing page design, answering community questions, and final touches before early access launch.

Free
writing/og/6-dawn-2-breakdown.jpg
062025-07-31

Breakdown of Dawn 2

Dawn 2 shader breakdown: gradient techniques, color theory, and inspiration from Rik Oostenbroek.

Free
writing/og/5-process.jpg
052025-07-16

Building Fragments — A Creative Process

My creative process for building shader art. From concept through iteration to final composition.

Free
writing/og/4-utils.jpg
042025-07-08

Building Fragments — Utils

Guide to Fragments utilities: copy-paste components and shader functions for faster creative coding workflows.

Free
writing/og/3-sketch-breakdowns.jpg
032025-07-01

Building Fragments — Sketch Breakdowns

Diving into sketch breakdowns: how they work, code structure, and shader composition explained.

Free
writing/og/2-collection.jpg
022025-06-24

Building Fragments — The Collection

Exploring the Fragments Collection: techniques, utilities, sketches, and how it all connects.

Free
writing/og/1-building-fragments.jpg
012025-06-17

Building Fragments — What is this thing?

What Fragments is, why I'm building it, and who it's for. The origin story.

Free

Sign up to get notified when enrollment opens

Be the first to know what's next