The interactive view couldn’t start. Reload to try again, or explore the projects below. Reload ↻

Case 008Mobile app design

Boomerang Video Editor

An iPhone editor for turning short clips into loops, designed from the project grid to the export sheet. A dark interface with one hot-pink accent keeps attention on the footage.

Contribution: Product flows and interface design
Project status: Interface design · Figma archive

Boomerang presentation cover from the original design file. — Presentation cover from the original file.

My contribution

Boomerang Video Editor is a dark iPhone app for making loops from short clips. Its Home screen calls it Boomerang Maker, and the splash sums up the idea in one line: “Create loops that Wow!”

I designed the flow from onboarding through Home, media selection, a paywall, trimming, editing, filters and export. This case stays with the screens where the editing decisions show most clearly.

Recorded from the Figma prototype. From the splash through onboarding to a project open in the editor. Editing: the clip above, the tracks below and one row of tools along the bottom. Trim: two handles set the stretch to keep, and the tools give way to Cancel and Save.

Editing screen with a neon-lit hand filling the top, video and audio tracks on a timeline, and a row of tools labelled Trim, Direction, Speed, Loops, Text, Voice and Music. — Recorded from the Figma prototype. From the splash through onboarding to a project open in the editor. Editing: the clip above, the tracks below and one row of tools along the bottom. Trim: two handles set the stretch to keep, and the tools give way to Cancel and Save.

The clip gets the screen

On the editing screen the clip fills everything above the timeline, and the controls sit on a dark gradient that grows out of the footage. Play, undo and redo, the 00:00 / 00:50 counter and fullscreen share one line, directly above the tracks they act on.

Below them, video and audio share one ruler. The tools run in a single row along the bottom that continues past the edge of the screen: Trim, Direction, Speed, Loops, Text, Voice, Music and FXs. Each one pairs an icon with a word, so nothing depends on the symbol alone.

My projects screen with a two-column grid of video thumbnails showing durations, a pink New Project button and a Become a PRO button at the top. — Home: projects in a two-column grid, with New Project always within reach. Export: choose a resolution and where to publish.

Home: projects in a two-column grid, with New Project always within reach. Export: choose a resolution and where to publish.

One job at a time

Trim changes only the lower half of the screen. The tool row gives way to Cancel and Save, and the selected stretch sits between two handles on the timeline. The only open decision is where the clip starts and ends.

Presentation image with the app's pink and blue looped mark beside two tilted phones showing the Home and editing screens. — Presentation frame with the looped app mark, Home and the editor.

Before and after the edit

Home shows projects in a two-column grid with their durations, under a New Project button that stays fixed over the content. At the other end, the export sheet asks two things: a resolution, with 4K marked by a small crown, and the apps to publish to.

Pink follows the next step throughout: New Project, Save, Export. It also marks Become a PRO, the one action on Home that sits outside the editing flow.