Experiments >

Code animation: Multiple timelines

Experiment #1179th April, 2021by Joshua Nussbaum

I realized something today. The good thing about the code animation project is that it has the most potential distribution. Since the group I have most connections in are developers, it’s a lot easier to get this thing used.

Compare that to e-commerce projects where I don’t have a following of store owners, I only know a handful that will take my call. It’s a good market, but I don’t have strong distribution there.

Marketing Strategy

From a marketing perspective it’s a lot easier to get people to try the code animiation tool. That means getting into the hands of real people, adjusting it to work better for real-life scenarions and getting testimonials. Which are things my previous projects weren’t strong on.

I think for this project, it would be better to release it in a limited exclusive way before opening it up to the wider public.

But I am conviced today it is a powerful tool, every time I use it in a tweet, the tweet gets 10X-20X more engagement. Which is a lot.

Preparing demos

Continuing with my marketing strategy of helping people instead of selling (aka “serve don’t sell” h/t Liston Witherill), my plan is to prepare example videos (for free) to help people I know. It could help anyone from a book author, course creator, framework builder, marketer at a company that sells to developers. Anyone.

Currrently, preparing those demos needs to be done by hand, like I did for a friend today (see experiment #116). It takes settings up the animation steps in a JSON file and adjusting the styling to match their brand.

Multiple timelines

It would be handy to get the timeline working so I don’t have to hand code examples. It would also be useful to be able to animate across multiple windows, like a code editor and a browser or a terminal with phone overlay. Each screen would need it’s own timeline.

So that brings me to todays experiment: Figuring out how to make multiple timelines work visually:

Code

https://svelte.dev/repl/7afd42b70d904ea1a44dadeef703b287?version=3.37.0

Demo

view all experiments

Stay tuned in

Learn how to add more experimentation to your workflow