Redesign of the DeepMake AfterEffects Extension

The DeepMake AfterEffects extension allows video editors to take advantage of the latest advancements in AI directly within AfterEffects. Generate images and masking layers in minutes using LLM's running locally on the users device, without leaving AfterEffects.

At DeepMake, I was in charge of the re-design and development of the front-end for the DeepMake extension, which involved building and completely re-imagining the front-end UI. I used Svelte, TypeScript, and SCSS, and the websockets API for bi-directional communication with the existing back-end. Each plugin can have any variety of input field parameters, which meant dynamically generating each the input fields while keeping track of their values.

Before the re-design the extension UI was based on Adobe's own C++ API's, which lacked the input variety and freedom to build robust and user-friendly UI's. The goal was to rebuild the extension on Chromium, making it possible to build a better interface using HTML, CSS, and JavaScript, embedded directly within AfterEffects.

Below is the extension before the redesign.

Given the tight deadline, I quickly got started with designing low-fidelity clickable prototypes on Figma before development.