Hello everyone! For the last year I've had a hobby of creating smooth animations / motion graphics and uploading them to my instagram. I did it daily for a very long period and while doing it I developed a library with which I could create these animations, and I just made it public here: https://github.com/EriKWDev/nanim
I was heavily inspired by 3b1b's wonderful manim (https://github.com/3b1b/manim) which is a much more sophisticated piece of software that, among other things, use TeX to render beautiful text..
Anyway, I love Nim so that's the language I wanted to use. I use staticglfw and opengl to create a window and then using some nanovg bindings (https://github.com/johnnovak/nim-nanovg) I can draw cool vector graphics.
I've created my own timeline and tweening library that is all built in. Everything can then be rendered into a video using streams and osproc to talk to ffmpeg.
Here are some animations that I have created using Nanim: https://www.instagram.com/erikwdev/
This is merely an initial public release and while I haven't changed much in the core of Nanim for some time now, I would not mind keep on improving it in the future.
Hope you find it interesting or at least my animations somewhat pretty xP If enough interest sparks I might consider making all the code for all animations in my back-catalog on instagram available on GitHub as well.
Thanks for reading!
IMO to qualify as 'art' there has to be a poignancy or some way to evoke an emotional reaction other than 'that's clever'.
Disagree.
They also only stated that they are smooth animations / motion graphics so not sure why your opinion on art is relevant to the thread.
Great work @ErikWDev!
Thanks a lot for working on such awesome project and sharing it here. I played around with it (not that I have any artistic skills, but it still was really fun). Everything worked flawlessly, including renderer part.
Hope you find it interesting or at least my animations somewhat pretty xP If enough interest sparks I might consider making all the code for all animations in my back-catalog on instagram available on GitHub as well.
Yes, please. They can serve as a very good examples on how one might create particular animation pattern (for example I usually have a hard time coming up with something that can be even considered somewhat creative, so I have to look up lots of examples). And they just look beautiful - I don't have an Instagram myself, so I only seen the most recent ones (up until Instagram engages its login wall), but I'm very impressed.
Some things I want to mention wrt. to the project itself
If anyone is curious I just animated rectangles placed in sequence one after another, nothing really complicated.
import pkg/[nanim, nanovg]
import pkg/nanim/entities/rectangle
proc testScene(): Scene =
let scene = newScene()
let bg = rgb(128, 128, 230)
let fg = rgb(128, 230, 128)
scene.setBackgroundColor(bg)
var rects: seq[Rectangle]
for i in 0 .. 4:
let rect = newSquare()
rect.fill(fg)
scene.add(rect)
rects.add(rect)
scene.wait(500)
scene.showAllEntities()
for idx, rect in rects:
scene.play(rect.move(100 + idx * 200.0, 500))
scene.wait(500)
return scene
when isMainModule:
render(testScene)
It has been really amazing just getting wholesome feedback from so many here on the forum. Thanks to everyone! I wouldn't mind adding maybe some more examples and explaining a bit more and convert it into its own blog post.
I responded in the issue. Is it the same repo for that? Should I edit it in place or add the edited one as a comment?
It doesn't currently have it built in, but it would be trivial to add since it uses ffmpeg to export the video to mp4. Here is where the command is executed: https://github.com/EriKWDev/nanim/blob/c59154fc3e99025b8c7109e1598716ceda2b1fa6/src/nanim/rendering.nim#L204
I currently convert the final video to a gif using ffmpeg. The following bash script to convert all files .mp4 in the folder to gifs
for f in ./*.mp4; do
ffmpeg -i "$f" -vf "fps=22,scale=340:-1:flags=lanczos,split[s0][s1];[s0]palettegen[p];[s1][p]paletteuse" -loop 0 "${f%.*}.gif"
done
I don't fully understand the question. If you're wondering whether nanim has a GUI for creating animations the answer would be no (not currently ;) )
I'm only slightly familiar with blender animation nodes, and using a graph and interface to create animations certainly makes more sense in most cases, but nanim aims more to create really precise motion graphics described entirely through code and is currently meant to be produced by writing that code yourself.
It would be interesting to create some form of serializable format that nanim could read and then have a separate GUI interface generate such a file format... Or perhaps just be fully integrated with nanim itself.
I rely on NanoVG currently which requires OpenGL support. I've experimented with using Cairo as a backend (and there is even a branch currently with that), but from my limited testing the performance was not very great even when a GPU is present.
To my understanding Cairo should work both with GPU when present, and only on pure CPU when not, but it didn't fit my needs. Even with limited integrated graphics on my old Macbook Air I got decent performance with the current NanoVG implementation.
The project could ofc be rewritten to support different backends, but I do not intend to maintain such a project. Anyone is ofc free to fork it and rewrite nanim though, so go ahead!
To my understanding Cairo should work both with GPU when present, and only on pure CPU when not,
Cairo was not really designed for OpenGl, so its OpenGl backend was not really faster than the CPU version. There have been many attempts, like https://github.com/jpbruyere/vkvg or intels FastUIDraw. Some say that skia is faster than cairo with OpenGl backand, but I am not really convinced. I am using still cairo for my SDT tool, as it best fits into GTK. But later Blend2D should be the backend -- will be some work to make the high level Nim bindings, as there is of course no gobject-introspection support.