Julian Garnier
@JulianGarnier
Followers
12K
Following
5K
Media
178
Statuses
1K
It's decided, I'm making a course!. I'll explain how the new Anime.js website was created by recreating the entire landing page from scratch, while sharing all the animation tricks and techniques I've learned throughout the years. Join the waitlist in the link below 👇
62
154
3K
After 5 years in the making, I'm very happy to finally release Anime.js v4, my dream animation library:. 🧩 New modular API.⚡️ Highly performant.🖱️ Scroll-linked animations.🫵 Draggables.↔️ Responsive.✨ Additive animations.🪽 WAAPI support. And so much more!. Link below👇
398
972
9K
Anime.js Beta 106 is out and completes the `animate()` and `waapi.animate()` APIs!.Really happy with the amount of features packed in only 10KB and 3KB respectively!. Next up: v4.0
13
126
2K
My first awwward! Thanks to everyone who voted!.
Today’s #SOTD goes to @JulianGarnier for "Anime.js". Anime.js is a fast and powerful JavaScript animation library that brings motion to the web with versatility and ease. Congratulations! 🏆. #technology #animation #3D
59
41
2K
I think the `createDraggable()` API is now complete 😮💨
Anime.js v4 beta 102 is out for all my monthly GitHub sponsors! This version adds many new features to the draggable and spring API.
12
95
2K
Just on time to celebrate reaching 50 monthly @GitHub sponsors:.🚀Introducing draggables to anime.js V4!.✅ Inertia with spring animation.✅ Snap to grid.✅ Axis lock.✅ Container autoscroll.✅ Transformed container.✅ Quick swipe gestures.✅ onSnap callback.And a lot more.
19
86
1K
Today's my birthday, but more importantly, today is release day!.Anime.js v4 beta 100 is now available for my sponsors, featuring:.✅ Scroll-linked animations (ScrollObserver).✅ Responsive animations (Scope).🚀 Brand new docs (It took 4 months, but I think it was worth it!).👇❤️
20
77
986
An example of responsive, interruptible, draggable and auto-animated infinite carousel with the new anime.js v4 `createDraggable()` API.
9
49
832
Finally updated my website for the first time in 8 years
22
13
740
Anime.js V4 beta is finally available in early access for my GitHub sponsors!.✅ New ES module based API.✅ Huge performance boost.✅ Built-in types.✅ Integrated GUI.✅ New easing functions.✅ Improved timelines.✅ Additive animations.And so much more! 👇Link below👇
18
69
700
Introducing Animatables to Anime.js V4 beta. A new way to efficiently manage repeated animations without redundant calls to animate() or utils.set(). Perfect for mouse tracking effects!.API Details below 👇.#animejs #animation #webdevelopment
12
49
613
Anime.js v3.0.0 is out ! 🎉.Spring easing, built-in staggering helper, new keyframes system, new callbacks and more. And a brand new website : ✌️
34
132
564
I've been overwhelmed by the responses on the release. Thank you everyone, and sorry if I haven't responded to all your messages, I'm receiving a lot of them and doing my best to get back to everyone!.
After 5 years in the making, I'm very happy to finally release Anime.js v4, my dream animation library:. 🧩 New modular API.⚡️ Highly performant.🖱️ Scroll-linked animations.🫵 Draggables.↔️ Responsive.✨ Additive animations.🪽 WAAPI support. And so much more!. Link below👇
12
8
496
Anime.js v4 will be released next week, and there's never been a better time to become a sponsor. Major releases drive huge traffic spikes, so if you want to promote your product or company during v4 launch and the new landing page unveiling, check out my GitHub sponsor page!
7
35
470
Adding draggable capabilities to drawer components is now super easy with the new anime.js v4 `createDraggable()` API, it's fully responsive and it can even handle nested draggables!
3
24
396
Anime.js v4 beta 103 is now available for monthly GitHub sponsors! 🎉.This release improves and completes the playback API redesign and makes it easier to synchronize nested timelines:
3
20
368
Introducing `waapi.animate()` in beta 104:. Web Animations capabilities with the simplicity of Anime.js v4 API:. * Multi-target animations.* Advanced staggering.* Accepts any easing function.* Spring animations.* Scroll-linked animations.* Responsive animations.* And more!
5
21
339
Dragging animated elements is now easier than ever with the new Anime.js v4 draggable API!
3
19
304
Just reached 100 monthly GitHub sponsors today. Thanks, everyone. It means a lot ❤️
8
4
302
Website development for my buddies Studio Large 😘.Really happy with the result of these animated page transitions!.#animejs.➡️
6
18
236
The javascript animation library that I used on my website is now open source!! 🎉
9
78
222
Today I'm making a big move, I'm pausing freelancing to focus 100% on v4!.The amazing feedback and contributions from my sponsors have kept me motivated to work on the project. If you want to support a 100% open source JS animation library, now is the perfect time to join in! 🙏.
Anime.js V4 beta is finally available in early access for my GitHub sponsors!.✅ New ES module based API.✅ Huge performance boost.✅ Built-in types.✅ Integrated GUI.✅ New easing functions.✅ Improved timelines.✅ Additive animations.And so much more! 👇Link below👇
11
11
238
The new svg.createDrawable() utility function of Anime.js V4 makes SVG line drawing animations a breeze!
4
6
232
Just released Anime.js v4.0.0 RC 1 for my GitHub sponsors!.Mainly small fixes and improvements for the Draggable API, such as the possibility to scroll inside a draggable element on touch devices. Public v4.0.0 coming soon. Happy new year everyone!
8
10
233
Left: Web Animations API (21 FPS).Right: Anime.js v4 (59 FPS).Running animations on the main thread isn't always as bad as it may seem.
7
16
173
A sponsor on Discord asked me if it was possible to also map a draggable with snap to a scroll event. Here it is, I call this "drag-n-scroll-snap".
1
5
163
Here are 2024 animated divs to wish you all a very happy new year ❤️
2
8
144
I can't believe it's out, I hope you like it as much as I do, I put a lot of care and effort into that thing. Massive thanks to all my sponsors, small and big, I couldn't have done it without them ❤️.
1
1
142
Just improved the new WAAPI-powered `animate()` method with better tweens composition and more playback methods in Anime.js v4 beta 105!. This spring animation runs entirely with the native Web Animations API and can be written with just a few lines of code.
2
3
138
Not really the effect I was going for, but nice Windows throwback
2
0
102
It's currently 42°C in Paris, a perfect day to release anime.js 3.1.0! Mostly bug fixes and a complete easing functions refactoring.
5
8
88
🎉 Anime.js v2.0 is out! 🎉.Up to 2 times faster.Multiple keyframes.Timeline.Bezier easing.Promise support.And more ->
3
25
84
The tween composition parameter is probably my favorite new feature of Anime.js V4. It allows blending multiple animations together seamlessly. Perfect for user interactions.
2
6
83
Updating a draggable container's padding values is now super easy in Anime.js v4! This is particularly handy for creating custom range sliders. (code below)
2
1
73
Currently proofreading 300 chapters and around 250 example demos for the new Anime.js v4 documentation (Coming very soon in beta-100 for my sponsors)
2
3
71
And of course, if you want to help keep the project alive, you can sponsor me on @github sponsors!
2
0
62
Anime.js v4 beta 102 is out for all my monthly GitHub sponsors! This version adds many new features to the draggable and spring API.
0
3
57
This is the most interesting use of the golden ratio I've ever seen
0
9
54
No physics, no boids, just a few randomised animations loops
3
0
51
Better (400 SVG lines)
The new svg.createDrawable() utility function of Anime.js V4 makes SVG line drawing animations a breeze!
0
2
49
Just in case you were wondering why I haven't updated anime.js in a while (announcement soon).
8
3
47
For anyone interested in learning how I made this, I'm creating a course where we will re-create the entire landing page from scratch. You can join the waitlist here:
3
1
51
And if you're wondering how the website has been made, I'm making a course about it!.
It's decided, I'm making a course!. I'll explain how the new Anime.js website was created by recreating the entire landing page from scratch, while sharing all the animation tricks and techniques I've learned throughout the years. Join the waitlist in the link below 👇
4
0
39
772 838 clicks so far
5
6
30
Looks like the signup form isn’t working for some people, I’ll see what I can do, but meanwhile you can drop me a DM with your email and I’ll add you manually to the list.
2
0
31
Already 99 beta releases for Anime.js v4. All the core features are now completed. A massive thank you to all my sponsors for the support, it really helps in finding the motivation to push things forward!!.Next up: scroll-based animations!
3
1
31
Btw I’ve been using the new version of anime.js in all my client work for the last few months, and I think I’m finally happy with the new API, can’t wait to release it!.
Website development for Luke and Nik in collaboration with my friends @D_V_T_K 🙌 Lots of neat details in this one, the project's transitions were particularly fun to work on. 👉 #animejs
7
2
29
Just reached 30 GitHub monthly sponsors! Thanks everyone ❤️.
Anime.js V4 beta is finally available in early access for my GitHub sponsors!.✅ New ES module based API.✅ Huge performance boost.✅ Built-in types.✅ Integrated GUI.✅ New easing functions.✅ Improved timelines.✅ Additive animations.And so much more! 👇Link below👇
0
0
31
Check out my sponsor page to know more about the new features of Anime.js V4 and to support the project 🙏
3
1
30
I finished writing the migration guide + release notes for v4. The release notes simply list the new API features and biggest changes, with links to the docs for each section. Migrating from v3 to v4: v4 release notes:
0
1
26
Lots of good new V4 stuff packed in these 30 lines of code 👀
0
1
25
Quick anime.js V4 poll:. I'm planning to replace the "anime()" global function in V4 with a "animate()" ESM import. As a result, I'm also thinking about dropping the "targets" parameter in favor of a dedicated and mandatory "targets" argument. What's your preference?
4
0
25
And it's now possible to create seamless infinite looping animations like this one
3
1
24
A big thank you to all my early bird @GitHub sponsors, it means a lot ❤️.
Anime.js V4 beta is finally available in early access for my GitHub sponsors!.✅ New ES module based API.✅ Huge performance boost.✅ Built-in types.✅ Integrated GUI.✅ New easing functions.✅ Improved timelines.✅ Additive animations.And so much more! 👇Link below👇
1
1
24
Also, the Anime.js website and docs are great places to advertise your product or company. With roughly ~100k impressions/month, it's a good opportunity to reach a targeted audience of web developers and designers. I have a sponsor tier for that!.
Check out my sponsor page to know more about the new features of Anime.js V4 and to support the project 🙏
0
0
23
🔴 Anime.js v3.2.1 released! .Changelog: Thanks to everyone who has contributed!.
1
2
24
@i_gassmann @mattgperry Motion has React and Vue specific integrations that Anime.js doesn't, but regarding the vanilla JavaScript side, I think Anime.js has a more complete set of features overall.
1
1
23
OK so setting the WAAPI "fill" property to "none" appears to have a good impact on performance, but still:. Left: WAAPI with fill: "none" (42 FPS) .Right: Anime.js v4 with a pre-defined starting value (70FPS)
Left: Web Animations API (21 FPS).Right: Anime.js v4 (59 FPS).Running animations on the main thread isn't always as bad as it may seem.
2
1
19
Still using the first beta version of anime.js though 😅 Keeping it for posterity
0
0
18
Draggables are popular apparently! Got a few new sponsors since I posted this video, thanks all ❤️.
Just on time to celebrate reaching 50 monthly @GitHub sponsors:.🚀Introducing draggables to anime.js V4!.✅ Inertia with spring animation.✅ Snap to grid.✅ Axis lock.✅ Container autoscroll.✅ Transformed container.✅ Quick swipe gestures.✅ onSnap callback.And a lot more.
1
0
18
Anime 2.1.0 is out with a lot of improvements and bug fixes. Complete changelog here 😘
1
2
17
@LegionWebDev Yeah, started working on the rewrite during the pandemic, then worked on it in between freelance gigs, then full time in the last 1.5 year.
0
0
18
And if you're just curious, the complete change log for the beta is accessible here
1
0
16
Quick follow up to 2.1.0, Anime 2.2.0 is already out!.Up to 1.5x faster, RGBA/HSLA support, and some bug fixes👌.
2
3
16
Huge thanks to all my GitHub sponsors! As always your support lets me go the extra mile ❤️.
Today's my birthday, but more importantly, today is release day!.Anime.js v4 beta 100 is now available for my sponsors, featuring:.✅ Scroll-linked animations (ScrollObserver).✅ Responsive animations (Scope).🚀 Brand new docs (It took 4 months, but I think it was worth it!).👇❤️
1
0
14
0
0
14
anime.js in the top 10!
The top open source launches on GitHub since 2015, ranked by number of stars gained in their first week:
1
0
14