Javascript, music, nutrition, WebGL, ReactJS, headphones, license plates, biking, Vim. Creator of @shaderfrog. he/him.
San Francisco, CA
Joined April 2008
- Tweets6.1K
- Following467
- Followers3.1K
- Likes10.8K
Pinned Tweet
After 16 years, it's time for me to say goodbye to Twitter.
You can find me on Bluesky bsky.app/profile/andrewray.m…
Or subscribe to my blog andrewray.me/subscribe
See you on the other side✌️
If you have your own personal domain, go verify it on BlueSky! Your handle there can be your website. Lots of OG creators from Twitter are showing up over there.
Stacking uv backfilling = insane
Live (may crash on mobile): shaderfrog.com/2/editor/cm1e…
#threejs #shaders #screenshotsaturday
Posting about Bluesky gets you shadowbaned on Twitter, but now that Bluesky supports video, I'm defaulting to posting shader content there first. I hope you'll join me!
This #threejs parallax map shader in @shaderfrog 2.0 is insanely fun to play with: bsky.app/profile/andrewray.m…
The @shaderfrog 2.0 editor is getting more use! I think there's a college that uses Shaderfrog - there are many flag shaders created in the system. If you're one of these students, can you let me know? I'd love to learn more!
Browse the #threejs gallery: shaderfrog.com/2/browse/thre…
@andrewray.me on Bluesky retweeted
PlayCanvas Engine 2.0.0 is here! 2⃣🚀
💀 WebGL 1 removed
🧹 Public API cleaned up
✨ New custom shader API
👥 New hardware instancing API
Read more on our blog:
blog.playcanvas.com/playcanv…
I hacked together a @Shadertoy import into @shaderfrog 2.0 / @threejs. Doesn't support most features, but it's a starting point!
Right now it converts to screen shader with gl_FragCoord. Up next I want to add an option to use UV coords for the conversion.
It's still a ways off, but what I hope to enable is unlocking easy shader reuse across engines, to increase the reach shader authors have, and increase the pool of effects artists have to choose from.
Wow I did NOT expect this to work! Applying a gl-transition in #threejs @shaderfrog 2.0 with uv backfilling to transition between two parallax map shaders!
Live: shaderfrog.com/2/editor/clzn…
Ugh, this is so much fun to experiment with.
Galaxy parallax map transition in @threejs @shaderfrog 2.0. Live: shaderfrog.com/2/editor/clzn…
Backfilling UVs in #threejs @shaderfrog 2.0 means you can treat shaders like image inputs. Here's the awesome gl-transition (github.com/gl-transitions/gl…) library applied to full shaders!
Live: shaderfrog.com/2/editor/clzn…
Another @greweb gl-transition effect applied to arbitrary shaders. Experimenting with effects is as simple as clicking on a node to replace, then clicking on a shader in the sidebar to replace it.
Live: shaderfrog.com/2/editor/clzn…
Backfilling UVs in #threejs @shaderfrog 2.0: All nodes are individual shaders. The fireball, the transition effect, and the vertex noise pattern. The primitive of artistic composition has changed from GLSL functions to full shaders/effects!
Live: shaderfrog.com/2/editor/clzn…
Lots of interesting effects are enabled by UV backfilling. Messing around with shaders as parallax maps in #threejs @shaderfrog
Live: shaderfrog.com/2/editor/clzk…
Simple effects add depth (literally) as a parallax map
Live: shaderfrog.com/2/editor/clzk…
Achieved something very silly, inefficient, and fun to play with in @threejs in the @shaderfrog 2.0 alpha: Using shader programs as parallax maps! Here's a fractal shader used to fake depth on an object.
Live: shaderfrog.com/2/editor/clzj…
And because it's @shaderfrog, you can arbitrarily compose shaders, so you can trivially change the parallax map to any other shader in the system! Leading to some fantastic results shaderfrog.com/2/editor/clzj…
#webgl #threejs