Etidou’s Shader Gallery

My shader Gallery is finally launched, you can scroll through many shaders and click on them to edit them!

Is made with GLSL for shaders, the modeling was done with Blender and development with three.js and some post processing !

Here is the link : https://shader-gallery.etiennepharabot.fr/

Quick notes I was able to win my first SOTD (on 02 june 2023) on CSS design awards, with this side project !

I’m available also for freelance work I you want to contact me : https://twitter.com/epetidou

4 Likes

Thanks for sharing your project. It looks nice. There are some quite interesting shaders. Yes, it is computationally intensive (this is easy to guess by the noise of my laptop fan).

In case you need suggestions for improvements, here are a few:

  • I did not find how to browse all shaders (as a grid of snapshots), so the only way to see them is to walk along a predefined route.
  • The lines that are edges of the walls exhibit strange behaviour – sometimes they disappear, sometime they become dashed … as if they are not antialiased at all.
  • By editing a shader I imagined to see the source code, instead I was only able to customize/configure some parameters. Do you plan to allow users to pick a shader and use it in their projects?
  • I use [space] to go forward, but when I reach the end, [space] stops working. I have to [scroll] past the “finish line” to make [space] functional again.
  • The front page → “all the shader” or “all the shaders”

In case you do not need suggestion, please, ignore them.

Thanks, that’s a very interesting kind of feedback!

I won’t be changing anything for now (apart from the last point) but maybe for a second version, that can be nice to implement !

The problem with the space bar should be reported to Studio Freight, I’ve used their lenis scroll library, with the infinite option.

With also the possibility for the user to browse freely!

Thanks again !

1 Like