An animation of a design professional throwing a ball against a tall wall, getting hit back by the ball, and thus falling to the ground. Designed in After Effects with vector lines and shapes, the basic format for outputting as a json-file, using the bodymovin extension.
An animation of a design professional throwing a ball against a tall wall, getting hit back by the ball, and thus falling to the ground. Designed in After Effects with vector lines and shapes, the basic format for outputting as a json-file, using the bodymovin extension.

Member-only story

Why consistently hitting design walls is a good thing

It’s all about getting back up on your creative feet

Eva Schicker
5 min readMar 17, 2022

--

Build a strong, long-term learning strategy

Newly acquired skill sets are the best way to expand our design mind

Today, I hit that black wall while I was following along a design tutorial on YouTube about dynamic animation. Everything went well for the first 10 minutes. I learned how to output an After Effects (AE) text animation to JSON with bodymovin [1], an extremely useful AE extension to export Lottie animations [2].

Bodymovin exports AE animations by default as .json files that utilize the lottie.js player that comes along with the plugin. (More on the Bodymovin plug-in for After Effects in reference 1.)

Outputting an AE animation as a .json file is extremely useful for developers to utilize JSON to build dynamic animations, using a, for example, class=“username”, to link through code to the dynamic live text.

The .json .username is exactly the point where I hit my roadblock

It was about the .json statement. How exactly does my AE layer name .userentry, output to .json, relate to the dynamic…

--

--

Eva Schicker
Eva Schicker

Written by Eva Schicker

Hello. I write about UX, UI, AI, animation, tech, fiction, art, & travel through the eyes of a designer & painter. I live in NYC. Author of Princess Lailya.

Responses (1)