Show HN: I created an After Effects alternative

[clementpiki]

Many years ago, I made VJ softwares (to mix live visuals in clubs) for unexpected platforms like the Game Boy Advance, the Playstation 2 and the Raspberry Pi. This year, I’m back with a new web-app: Pikimov.

Inspired by Photopea (a free Photoshop clone), I created this web-based motion design & video editor as an alternative to After Effects, to fill empty void.

It's free, without signup, without cloud uploads (your files stay on your machine), and your projects are not used for AI models training.

[doctorpangloss]

This is from my point of view as an experienced developer and VFX artist, including in-depth knowledge of AE.

    A 30fps limit is surprising
    23.976 as an fps does not seem to be dealt with gracefully
    Clicking report bug should take me to a bug report form with info
    Interacting with "rectangle" is surprising because the corners aren't draggable. Probably should default to full size
    I should be able to wind input fields by clicking and dragging on them, such as for rotation
    When I drag keys around in the dope sheet, and let go with momentum, they appear to keep moving and "settle" in a sort of random place. They should not do that
    I see that this momentum behavior is also in the play head in the timeline. It really should not do that.
    Putting in a value in the dope sheet should be enabled, and it should automatically set a key
    I liked the visualizations of the easing, but it should probably be communicated with the keyframe's icon shape in the dope sheet like it does in AE.
    It is difficult to move a key to the beginning of the timeline.
    Architecturally, the preview rendering probably has to work the way it does in After Effects. Guaranteeing a real time visualization is pretty important.

I kind of stopped there because it's a bunch of goal-less fiddling. This is really great, there is a tremendous amount of product development. Hopefully you will think deeply about your audience and objectives, and the amount of product development that goes into After Effects.

[clementpiki]

Thank you for your feedback, the 30fps limit is temporary, until I have fully tested perfs with video files at a higher framerate can you tell me more about 'and let go with momentum', not sure what you mean? Is it about loss of precision, not being responsive, bad snapping to closest frame?

[KennyBlanken]

"Doesn't support NTSC framerates" is a "tremendous amount of product development"?

To me, it's "author / project lead has no background in the industry or even basic knowledge of video."

[bluelightning2k]

As a developer it's rare to see something which leaves me feeling "how would you even build something like that..." but this is one of those. Huge cudos for even attempting and following through with something like this!

[earthtograndma]

I notice it's written in Ember, which is billed as the framework for ambitious web developers -- in this case, it definitely checks out.

[mclightning]

you follow HN, and some guy posts a video editing js library, another guy builds an app taking that library further, you get inspired and build something even bigger.

[suyash]

You start by building your knowledge around computer graphics and modern web development, basically WebGL and modern web APIs have made doing sophisticated graphic applications on the browser. Only limitation right now I see is single threaded limitation on the browser.

[swyx]

yeah i'm gonna need a TLDR of the major moving parts. how do you even do video editing in the browser? is there a "ffmpeg in the browser"? is that the basic building block?

[enobrev]

This is excellent!

Several years ago I built a prototype of a video renderer on nodejs (v0.8-ish). It's a silly thing to do, rendering video in javascript (especially a decade ago), but it worked well enough to prove that it could be done and a startup pivot was born - one that was eventually acquired by Vimeo.

While a colleague (and now friend) was working on porting my silly little renderer to C/C++ to try to get closer to real-time, I built out a UI to allow us to "templatize" dynamic video for our users. This made it possible for our designers to design the video experience for the videos that were dynamically generated for our users' content.

That UI very much resembled Flash. Since then I've always wanted to do what you've done here. Before acquisition, I was asking our designers to walk me through how they use After Effects, in the hopes of building our tools in that direction, but then Vimeo showed up and... not too long after I left to start a travel startup. I haven't revisited the video space since.

I love this. I _knew_ that it could be done - especially now that WASM is stable - and I'm excited to see someone has done it. And free, no less!

Edit: Thought it was open source - thanks for the correction. Also I was way off on the node version.

[wavewash]

It is free to use but not open source according to the faq: https://pikimov.com/faq/

[ramses0]

2006: Flash-based, online/web NLVE, focused on clipping / remixing (eg: "TikTok / Stitch Me").

https://techcrunch.com/wp-content/uploads/2006/04/jumpcut.gi...

...sadly, acquired by Yahoo, and you know what happened next.

I can't find a lot of screenshots / video from the era, but the one above should give you a sense of it.

[mrandish]

Wow! This is wildly impressive and deeply inspiring - a truly incredible achievement. Even more unbelievable that it's by a solo dev. Please keep up the amazing work on this project. AE is powerful and feature rich but also bloated with decades of legacy code and niche professional use cases to support, so there's a huge need for what you've built. Not everyone is a high-end animator or special effects compositor. Many of us just want to make cool motion graphics for personal videos, social media and art projects.

Based on the great response you've gotten so far, I'd suggest focusing on ways for the community to expand on what you've built with templates and plug-ins.

[alfl23]

I really hope you charge money for it and make it awesome, it's about time Adobe gets disrupted and this is a wonderful idea!

It will take significant resources, cash and teams to make this into a serious contender, and folks that have problems to solve will always be happy to pay decent dollars for great software.

[majani]

He's clearly trying to follow the photopea playbook and make money through ads

[qingcharles]

This is amazing. I just installed AE yesterday after I decided that I needed to add "motion graphics creator" to my skillset in order to make decent Instagram stories.

What's needed now is a page where people can share the templates they've created.

[Andrew_nenakhov]

Can you please clarify, which exactly key features are missing from Firefox that make this app say 'use Chrome or Edge'?

[padenot]

I (Firefox developer working on anything media related) got in contact with the dev on Twitter, and he told me that Web Codecs was missing (and we're shipping this in a month or so, it's been in Nightly for some time), and something to save project file to disk (https://developer.mozilla.org/en-US/docs/Web/API/Window/show...).

So I spoofed the user-agent in a nightly build here on my Linux desktop workstation, then had to alias one method that we should have implemented years ago but only have with a `moz` prefix (`HTMLMediaElement.mozCaptureStream`). This is on us to fix.

Then it looks like a worker script is served with the `Content-Type` `text/html` instead of `application/javascript` or something like that. We also have a pref flip to bypass that check, so I did that, but this is on the dev to fix.

When you do this it works, I've loaded project demos containing videos, audio, various things composited on top, scrubbed the timeline aggressively in a debug build, moved things around in various bits of the interface and also in the rendering frame, etc., things seem to work as they should, perf is as I'd expect it to be (and again, I'm running it in a debug build with optimizations disabled for anything media related, enabled for other parts of the browser).

What's missing is `window.showSaveFilePicker` and file system related stuff. It's possible to use https://developer.mozilla.org/en-US/docs/Web/API/File_System... instead (that we ship, e.g. Photoshop on the Web uses it). We think that it's much less scary than giving access to the file system to a content process of a Web browser. Maybe because videos can sometimes be extremely big files, direct access to the FS could be of use there. Thankfully, we also ship extremely modern video encoders to make them tiny instead, but that's currently a limitation Firefox has, for better or worse.

https://paul.cx/public/pikimov-firefox-nightly.webm

[ayhanfuat]

From the FAQ:

> Why no Firefox support Firefox is my daily web browser. As a web developper, I always make sure my work is comptatible with all major browsers. But you can guess a web based video editor is a complex task to achieve, and Pikimov uses several key features that only exist in Chrome, Edge, and maybe Opera, and maybe, maybe, Brave. That's why Pikimov cannot currently work on Firefox (as of today: v127), there's nothing I can do to fix this, it is just not possible. For the curious ones, here are some of the web API Pikimov requires, but are missing from Firefox: - audio data - window showsavefilepicker - videoencoder Note: There is no Safari support due to similar obstacles.

https://pikimov.com/faq/

[uh_uh]

The fact that he's a solo dev giving his project away for free (even for a limited time) is a good enough reason.

[AshleysBrain]

As I mentioned in another comment, in short, WebCodecs and File System Access API I believe. Both pretty essential for an app designed for editing large video files from disk.

[jampekka]

IME the features are often mostly there same but there are small implementation differences/bugs at least in the newer APIs. Firefox is no more buggy (often less), but it's easier to code for one set of bugs. Safari is by far the worst.

I use Firefox for all my browsing, but do web app development with and for Chromium. I'd gladly do it for Firefox, but people, especially users, suck and sometimes one has to accept this.

Glad to see no time is wasted for Safari/iOS support. It's a huge waste of time and people using Apple devices are to blame.

[Aldo_MX]

Why the entitled tone demanding "to clarify which exactly key features"?

It is the right of developers to say "I don't want to support your browser" and you should respect that decision even if you disagree with it.

As a reality check, see this ticket: https://bugzilla.mozilla.org/show_bug.cgi?id=390936

It took Firefox 17 years of back and forth with developers to add parity with an Internet Explorer feature that Chrome supported since version 1. This late in the game IE is already dead for good.

Not everybody has infinite time or infinite money to support Firefox, as an aside, you knew what you signed up for when you made Firefox your main browser.

So please, change the "clarify why you don't support Firefox" tone with "I want to make the site work with Firefox, how can I help you?". And good luck making the Firefox team change their mind when they decide not to support X feature, because it is also their right to do not implement the whole spectrum of features that Chrome supports.

[sadops]

Probably the same features that computers have had since the 1960s, but nobody writes native applications anymore. Guess I'll have to pass on this one. I wish Chrome weren't the only operating system people chose to write software for.

[mrbluecoat]

Very cool! Although other more complex open source solutions exist, for me the sweet spot between capable and not overwhelming is perfect. I prefer Photopea over Photoshop for that same reason (..just don't go crazy on the anti-adblocker like Photopea did)

[tombert]

Which open source solutions exists as an alternative to After Effects?

[gaudystead]

+1 for Photopea.com. I don't even bother with Adobe anymore. I just wish their subscription could be implemented on a usage basis instead of time based because I use it off and on but the ad blocking is occurring on the network level via a PiHole, and I'm not turning all of that off just to let them serve me ads for a couple hours once every couple months.

[codelord]

I thought this is using AI so I was gonna dismiss it. But then saw the No AI sign and immediately signed up. Seriously though why is "No AI" a "feature" worth mentioning on top?

[eamonobr]

Adobe had some clause where they could train AI based on your creative, effectively building a model that can ultimately plagiarize your work. No AI is a nice appeal in this context. That and it being simple, fully offline, not at the whims of execs trying to bump their share price with AI features that put the user second.

[ttoinou]

Doesn’t your behavior prove the point of showing No AI ?

[czhu12]

Having never used after effects, I would like to say that photopea has probably been my favorite piece of software in the last 10 years.

I diligently disable Adblock on that website and have donated a few times in the past to support them.

I hope to see many more alternatives on the market, and lend my support to anyone building!

[n3storm]

Site and brand looks amazing and it's like something that really can compete with AE. Best of the lucks and I hope you will make it open source some day and make it work on Firefox :D

[Melatonic]

Nuke blows AE out of the water but is mainly only used by professionals

[billconan]

but I think each browser tab has a memory limit of 4gb? this means a web based video editor can only work on short clips?

[anovc]

looks impressive!

What are your plans for further development? I guess for this complex project to evolve in order to meet the needs of the professional users it will require lots of work/team/resources/etc.

Do you plan to monetize it somehow in the future? or how are you going to sustain it?

Another free alternative to AE (targeted at more casual users) that comes to mind is CapCut... which is obviously a ByteDance product. And they already offer tons of features for free, so the competition could be tough...

[kypro]

Given it's free, it might be worth open source the project, or at least opening it up to community plugins so that community can build & fund additional functionality.

[alok-g]

Side comment:

Comparing a web-based software that runs on your own computer vs. installing a (say native) software and frequently updating, isn't it interesting that the former is faster to do? When using a web-based software to ru on your own machine, you are effectively, momentarily, installing it and are able to uninstall by clearing the cache.

[whartung]

This is just a testament to the maturity of the platform, and the work that has gone into the portable engine segment.

Targeting Chrome targets all of the platforms, and the machines and platform is "fast enough" to do the job without having to dig deep into specific nature of the platforms.

It also leverages, I'm assuming, the deep knowledge the developer has of doing other things for the browser platform.

They probably could have targeted some other portable GUI toolkit, but this was more familiar. It may well be an even smoother experience than using other cross platform GUI toolkits, plus, of course, the platform is free.

Finally, distribution is familiar and likely easier, it's truly cross platform (no need to build executable on the individual platforms, even if its all from the same source base), etc.

No bundling, no signing, no app stores. Just a URL shared in a tweet and you're on your way. If it was OSS, it could be parked on a Github page for all eternity.

Overall, it's a really attractive platform for developers, just not yet fully embraced I think, as client based applications I mean.

[crazygringo]

And when you start a web app you might not even be "installing" 5% of the code, which is great for speed.

You can load+interpret JavaScript files dynamically as the user accesses certain features.

[conception]

Well, it’s rarely “running” on your machine but is just a client for the server it is running on.

[deweywsu]

Wonderful. You just "created" this?! This seems like it took many years and lots of hours. Great work!

[SillyUsername]

Where did you get the time to do this as a hobby? I spend evenings and weekends working on a project for the last 6 months and it's only half as good. 10x developer maybe, small team, millionaire? xD

[clementpiki]

I had previous experience doing editors, and I am not ashamed to admit ChatGPT gave me a hand on some features I was not comfortable with, like editing audio in javascritt for example.

[jagged-chisel]

Can I export projects to use in other places? Or import projects from other places? Blender comes to mind.

But also, I would like to use motion graphics in an app where the software engineers don't have to re-implement each asset in code.

[dorkwood]

Is there an option for custom ease curves, like a graph editor? I love the idea of an After Effects alternative, but if it only has a few simple ease functions to choose from I can't see myself using it much, sadly.

[InsideOutSanta]

Dang, the level of feature depth you've achieved here is amazing, and the UX is great if you have some experience with other video editors. This is definitely workable, at least for smaller projects.

[atum47]

I was well on my way to create a software like this [1], it started out as a flash clone, but since I didn't define any scope it started to look like after effects, on the back end I mean, never actually wrote a single line of code for the UI.

Are you planning on creating a company out of this? Are you going to monetize it?

1 - https://m.youtube.com/playlist?list=PL3pnEx5_eGm9BbCp2ZTj6LT...