✨ Interpol examples updates!

I've updated all the internal Interpol usage examples inside the repository with a tweakpane instance on each of them to test different configurations and visualize the current states in real time during animation.

A dev team commissioned me to lead a training course on animation and creativity on the web. It would have been strange to lead a training course on "creative" development and web animation without a presentation tool being part of the theme!

Can we talk about the IOS 26 design?
I'm really not sure I'll get used to it this time. The UI feels really broken at some point.

Some interactive modules examples I developed for my new article “Build a router for creative transitions”, now available!

⭐️ willybrauner.com/journal/buil...

#article #blogpost #javascript

Thanks! No I don't speak about this but it's pretty easy with this "middleware" to prevent, queue or start new transitions, depends of what you want.

In the last sandbox example, for "design" reasons, I append every requested routes to the render, even if the previous was not totally play-out.

A preview of another module developed for my next blog post about Router & Transitions, using the Interpol Timeline visualization component.

Full article is finished & dropping soon!

After a good break, I've finished developing the first module of my next article on building a router for creative purposes! Introducing the path matching mechanism, it was not easy to find a way to be understandable on this point.

Next to come ✌️

#article #frontend #router #javascript

I created a visual playback timeline component for Interpol, my open-source interpolation library. It displays the real-time progress and relative positions of multiple interpolations.

👉 github.com/willybrauner...

#frontend #interpol #gsap #motion #typescript

I completely forgot to share this motion, developed for a previous project. I reproduced the #iOS drag/touch view transition from scratch, pretty pleasant to use on the web too.

It's still crazy for this kind of application/need. I ask to copilot agent to write me a benchmark to test my @wbe/debug library compared to that of debug-js. And it just works so quickly.

For an upcoming @nuxt.com project (thanks to the freelance life of switching stacks for each project 🫠), I've developed a routing middleware component to handle route transitions, just like on my @preactjs.com router. This is what it can look like when you force the browser history, a little.

I'm working on components for my upcoming post on a fluid CSS methodology I developed to address specific needs in my projects from last year. It should be out this month!

#css #frontend #blogpost

A view of what's append on the grid when an album is focused. The css grid is sync with the JS grid system. So I can "speak the same language" to each of these languages; like "position yourself at 2 column 1 a gutter". It make the motion process easier to manage.

My last production for French music producer Julien Jussey is online! I'm a quite happy with this micro interface. Fun to develop and use actually.

julienjussey.com

#development #frontend #motion

My new folio is available ⭐️

I have been a freelancer for almost a year and have only recently had the time to look into a new version of my folio. Thanks to the agencies and clients for not giving me time to move forward on the subject until now!

↳ willybrauner.com

#folio #frontend #motion

New folio, new articles, new design, something is cooking! I will have new things to share soon.

#frontend #development #motion #design

Always for my blog built with @preactjs.com, I couldn't use @codesandbox.io React Sandpack, so I rebuild my own with the Sanpack client API :)

#frontend #blog #code

Finally, my first blog post about linear interpolation is under construction with some sandboxes. I think this is the coolest part of writing.

#blogpost #frontend #motion

And no webgl on this one, I only transform dom elements. But for acceptable performances, I was needed to transform only visible elements.