it takes time β a (vibe)coded watchface done in 30 min with #threejs and #troikatext
Link: clock.felixmartinez.dev
Press βοΈ to show/hide controls
@felixmartinez.dev.bsky.social
Currently working as Graphics engineer & Tech director. My practice blends human interfaces, interaction design and realtime rendering.
it takes time β a (vibe)coded watchface done in 30 min with #threejs and #troikatext
Link: clock.felixmartinez.dev
Press βοΈ to show/hide controls
Day 6 for #genuary2025 - "Make a landscape using only primitive shapes", boxes seems to be the most common approach this year. My take uses instanced boxes in #webGPU and FBM noise to drive the height.
Link: genuary25.felixmartinez.dev/sketches/day...
Bit behind with #genuary2025 day 4 was "black on black" and I did some tweaking on my #webgpu msdf font renderer, playing with vertex shader transformations over instanced geometry.
Link: genuary25.felixmartinez.dev/sketches/day...
Source: github.com/Siroko/genua...
Time to jump onto day 5 and 6 π
Day 3 and the "Exactly 42 lines of code" I went for a quick "Boids" implementation with vanilla canvas 2D on Typescript.
Link: genuary25.felixmartinez.dev/sketches/day...
#genuary2025 #genuary3
It is an effect from the macromedia Flash times, where the frames of the webcam were passed down to different frames on a grid, so that you could see some sort of motion trails. It was done in a studio in London called hi-res IIRC.
03.01.2025 15:16 β π 0 π 0 π¬ 0 π 0Day 2 of #genuary2025 for the prompt: Layers upon layers upon layers. I thought about replicating the good old Nanikawa effect on WebGPU, but I just had a couple of hours while flying on a plane to code it, so this is where I landed :)
Link: genuary25.felixmartinez.dev/sketches/day...
thanks! much appreciated β€οΈ
01.01.2025 00:11 β π 0 π 0 π¬ 0 π 0Day one for Genuary 2025.
Prompt: Vertical or horizontal lines only.
Link: genuary25.felixmartinez.dev/sketches/day...
A rainy day, is a quick entry done with my custom WebGPU engine. I will try to keep up with #genuary2025 this year, let's see how it goes π
Flora is an exercise from 2021 when I was exploring instanced rendering and dynamic systems by using procedural functions to animate and position geometry.
It is coded using #threejs as a 3D engine and custom #glsl shaders to optimize rendering speed.
managed to improve the glyph render quality at different distances. Also having fun with mouse strength/direction on the compute shader.
Live link: kansei.graphics/examples/ind...
getting into Aino and Alvar Aalto vibes with this one.
Compute buffers updating nicely also on mobile phones.
#webgpu
πββοΈ
18.11.2024 10:46 β π 2 π 0 π¬ 0 π 0Progress with the msdf font renderer on my very own WebGPU engine. Glyph positions and metrics are on compute buffers so they can be manipulated on a compute shader pipeline. Love the sharpness when zoomed in βπ»
#webgpu
Finally got the SDF font parser integrated on my WebGPU framework! Next step, glyph bounds and instanced drawing.
#webGPU
infinite squeezed half-spheres displaced with some noise functions.
π Live link -> 04flora.netlify.app
πββοΈ
11.11.2024 16:59 β π 1 π 0 π¬ 0 π 0is cool yes!
10.11.2024 01:45 β π 0 π 0 π¬ 0 π 0thanks!
10.11.2024 01:43 β π 1 π 0 π¬ 0 π 0I did this experiment that generates random compositions of boxes on every refresh of the page.
breel-weekly-brutalist.netlify.app
#threejs
steering behaviour running on the GPU, realtime WebGL FTW
08.11.2024 00:22 β π 6 π 1 π¬ 2 π 0R&D with ML depth estimation applied to video footage
08.11.2024 00:15 β π 1 π 1 π¬ 1 π 0More realtime typography simulation work.
08.11.2024 00:11 β π 7 π 1 π¬ 0 π 0Some vanilla WebGPU compute shader interacting with the mouse. Very nice what browsers can do these days.
08.11.2024 00:08 β π 1 π 0 π¬ 0 π 0exploring typographic GPU simulations with WebGL!
08.11.2024 00:06 β π 4 π 0 π¬ 0 π 0