TikTok2021

TikTok Effect House

If you’re reading this, chances are you’ve seen a TikTok video. And if you’ve seen one, you’ve probably seen or created one yourself that uses a TikTok Effect.

Initially, these effects were created exclusively by TikTok's in-house team and partners. However, TikTok wanted to democratize effect creation and build a community of creators.

Myself and one other designer - along with a talented team of engineers distributed across the west coast and China - brought this product from zero to one in 8 months.

The product offers a robust set of tools leveraging things like spatial computing, computer vision, audio synthesis, and much more.

TikTok Effect House

Prototyping

For a tool with so many interactive components and a highly distributed team it was a essential to leverage prototyping to test and communicate ideas.

I leaned on a wide range of prototyping tools and chose the best one for the job depending on the types of interaction and level of fidelity required: Figma, Origami, Protopie, After Effects, and Blender.

Node based editor
Drag Entity
Preview Menu
Preview Panel Undock

Design System

I led the design system effort from scratch, developing the typography and color systems, and creating a custom icon set.

Icon Set
Typography
Menu components