That's it. Turns out creative + responsible + accessible is doable. Just takes the right constraints from day one.
→ collectifparcelles.com
Also open for freelance from April : Performance, accessibility, creative web. 👋
#WebGL #a11y #Vuejs #sustainableWeb
[9/9]
Screenshot of the accessible display panel on collectifparcelles.com. A toggle button in the top-right corner shows the accessibility icon with a notification dot. The open panel displays "Affichage accessible" with three options listed: Animations réduites, Espacements ajustables, Compatible zoom +200%.
Animations designed to be accessible from the start, not patched after.
Result: 90%+ on the accessibility audit with the full animated site.
prefers-reduced-motion in CSS alone isn't enough. There's also an "accessible display" mode: reduced motion, adjustable spacing, works at any zoom level
[8/9]
The custom cursor is a Voronoi diagram in SVG.
Cursor is the central seed. Background cells precomputed once as static SVG paths. Only the cursor cell recomputes every frame.
Great intro here if you're new to voronoi :
gorillasun.de/blog/delauna...
[7/9]
WebGL only makes sense if you size it to the device. At startup I score the device (RAM, CPU cores, MAX_TEXTURE_SIZE, GPU renderer, network type, device type). Quality and effects scale accordingly. On low-end: static image fallback. Zero GPU get burned!
[6/9]
The hero: a GPGPU sim with a ping-pong framebuffer. Voronoi-based displacement encoded in a single RGBA texture: displacement UV, highlights, reveal mask.
A gaussian ring propagates from the center, each cell gets revealed as it passes through.
[5/9]
Wanted to go raw WebGL, but OGL is just too good especially for GPGPU.
Much closer to native WebGL than Three.js, and much lighter.
github.com/oframe/ogl
[4/9]
Code snippet showing a custom Timeline API built on top of WAAPI. A timeline instance is created, timeScale is set to 0.5, then four elements are added with keyframes and relative time offsets like "+=500" and "-=500". The last element animates x from -100% to 0 with a 1000ms ease-in-out duration. The timeline ends with timeline.play().
No animation library here. I wrote a ~4kB wrapper around the native Web Animations API (WAAPI). Too used to GSAP syntax so the API stays close: offsets, timeScale(), progress() for scroll scrubbing. WAAPI runs on the compositor thread: less risk of jank🎉
I also load polyfills only if needed
[3/9]
Vite bundle analyzer treemap showing the full JS output of collectifparcelles.com, split across chunks: ogl/src (WebGL core), lib/homeHeroGL with gpgpu.ts and shaders, app/lib/animation with scroll-timeline polyfill, VoronoiCursor, SiteHeader, ScrollDrivenSlides, and the Nuxt entry bundle. No single dependency dominates the treemap.
Hard budget from the start: <500kB total. JS, CSS, fonts, images, everything.
Fonts subsetted with glyphhanger (Really nice tool from @zachleat.com) + @nuxt.com/fontaine for fallback metrics so the layout doesn't shift while fonts load. Tracked automatically at every build. [2/9]
I thought I'd do a little technical breakdown of this one.
Creative experience with WebGL, scroll animations and custom interactions, built under hard accessibility and performance constraints from day one. 🧵
#FrontEnd #Javascript
[1/9] 👇
Coloring for Colorblindness : tester l'accessibilité de vos palettes de couleurs
10.03.2026 08:00 — 👍 2 🔁 1 💬 0 📌 0
New collab with Collectif Parcelles - pushing creative, accessible & sustainable web.
Interactive site with WebGL shaders + scroll animations, RGAA/RGESN(a11y/sustainability) compliant.
Tech: Vue/Nuxt, Vanilla JS, WAAPI, OGL, <500kB total.
Immersive ≠ heavy
→ collectifparcelles.fr
#a11y #webgl
Not sure what it is, but it is....
My new Portfolio! (best on desktop/laptop)
neuroproductions.be
Hey folks so I’m not good at this but, I’m a Sr. Producer seeking work!
💼 20 years of game production XP across Netflix Games/Spry Fox, Bungie, Blizzard, Zynga, Riot Games, and more
⭐️ indie, AAA, PC/console/mobile, 8-400 person teams, internal and ex-dev
www.linkedin.com/in/cuppycake...
@kyndinfo.bsky.social's articles are always invaluable resources for understanding complex concepts. Highly recommend!
28.01.2026 10:20 — 👍 6 🔁 0 💬 0 📌 0Such a cool idea, it looks so good!
26.01.2026 10:43 — 👍 2 🔁 0 💬 1 📌 0
Head of CNC (part of french ministry of culture in charge of cinema & game industries) raises a warning on private school selling expensive dreams (30 to 50k€) to wannabe gamedevs
www.linkedin.com/posts/gaetan...
(ping @erwancario.bsky.social)
Hey Bluesky
I've updated my portfolio
I'm currently looking for projects, so if you like my work, I'm available!
(Full version in comment)
#indiegame #indiedev #composer #vgm #videogamemusic #Portfolio #videogame #freelance #gamedev
Sharing the ASCII link hover ripple from my tiny folio. Plain JS, minimal CSS, layout‑safe for long labels.
Demo: codepen.io/erevan/pen/M...
Relief visualization in perspective style showing elevation data from Montée du Puits at coordinates 43.2135, 5.4418 with elevation range from -1m to 538m. This location was requested by @navalu.bsky.social.
//\ Relief #159
Location: Montée du Puits, Provence-Alpes-Côte d'Azur, France
Coordinates: 43.2135, 5.4418
Elevation Range: -1m to 538m
Terrain type: low-hilly
Requested by @navalu.bsky.social
#ReliefOfTheDay #DataViz #Geography
Hey, ça fait un petit moment que je travaille avec Abeto sur un projet de petit jeu jouable sur navigateur et c'est sorti hier !
C'est gratuit et ça dure 10/15 minutes.
N'hésitez pas à aller essayer : messenger.abeto.co
(en plus c'est multi, vous pouvez le faire à plusieurs)
#indiegame #ost
image d'une main qui tient un coca cola
Pou le plaisir, un clin d'oeil à mon collègue japonais Akiyoshi Kitoaka, de l'université Ritsumeikan de Kyoto, qui met tout son matos en ligne, comme cette magnifique canette, qui n'est rouge que parce que notre cerveau nous la fait voir rouge, alors qu'elle n'est faite que de blanc, noir et cyan
👇
Haha thanks ! And sorry for the pressure 😅
19.08.2025 12:11 — 👍 2 🔁 0 💬 0 📌 0
Since I'm now freelancing full-time, I made a new tiny portfolio: bastiencornier.com.
Tiny because I wanted it to be minimalist, and I set a strict budget of 10kB, including the WebGL frame. Everything fits!
I built a playable Softbody Tetris using #threejs #tsl and my softbody engine! 🕹️
I still consider this a work in progress, but you can already try it out in your #webgpu compatible browser here:
🔗 holtsetio.com/lab/tetris/
Bot update: @reliefbot.bsky.social now takes location requests! Comment coordinates (lat/lon) like "48.8566, 2.3522" on its latest post for next day's render.
First valid comment only, land locations only.
Can't wait to see your favorite hilly places!
#ATProto #CreativeCoding #DataViz #Javascript
Been exploring various aspects of #ATProto lately and created this bot as an experiment - it generates visual elevation renders from random spots around Earth.
Follow @reliefbot.bsky.social for daily terrain renders.
Source code: github.com/Bastou/bot-b...
#CreativeCoding #GenArtClub #Javascript
