InVideo AI • Timeline Editor for generated AI videos

Enable users to edit generated AI videos using a timeline editor, led to +29% user growth, and +74% exported videos (where previously just stuck in draft).

Fig 1. InVideo AI - Initial state - After user generates video

Context

InVideo AI is a web-based video collaboration platform, widely used by hundreds of thousands of content creators around the world. It comes with 4000+ custom-built templates, and 1 million+ royalty-free images and video clips.

InVideo uses AI to quickly generate videos, not based on an LLM, but based on custom-built templates. It’s currently in the process of redesigning the entire interface.

In this project I collaborated with a Design Lead, around 8 Engineers, and 2 PMs.

Two core problems were observed that led to this project

  1. The majority of users are stuck in the process, because the video is unable to be ‘edited’ as they like, which makes users feel they have no freedom.
Fig 2.1. InVideo AI - Result video generated, user can’t edit
  1. A quick fix from the dev, re-adding the old timeline editor, caused users to move to a competitor, as it was easier to use and less buggy.
Fig 2.2. InVideo AI - Old timeline editor

Benchmarking and understanding tech capabilities

Video is not my strongest area, so I need to understand the functionalities more, and understand why it’s not working for the users.

Fig 3. InVideo AI - Analyze timeline editor functionality

Testing other video apps, and trying to find the discrepancies between them.

Fig 4. InVideo AI - Benchmarking

Writing up my findings and synthesizing them, then bringing them to the Engineers to discuss, and having a design jamming session with the Design Lead to craft possible solutions.

Fig 5. InVideo AI - Example notes that I made

Iterations and solutions

First iteration, where I came up with the scene level, where users can break it down into multiple videos underneath

Fig 6. Invideo AI - First iteration

Iterated on some areas, and combined it with multiple use cases, including stress testing. Also integrated input from other designers, such as top navigation, sidebar, and left panel sidebar.

Fig 7. Invideo AI - Blank and Drag
Fig 8. Invideo AI - Record video
Fig 9. Invideo AI - Stress test
Fig 10. Invideo AI - Comparison

Outcomes

This led to +29% user growth, and +74% exported videos, so they’re no longer in draft.

We saw a majority increase in Reels on Instagram and TikTok

Notes

This is a light case study version, where a more in-depth case study will be available soon.

Thank you for reaching this last section! See you in another light case study.