Skip to main content
TikTok Effect House Platform Logo
Latest
Download
Log in
Getting Started

Make Your First Effect: Talking Potato

Let’s now get you started with a simple tutorial that will help you familiarize yourself with the tool, basic features, and the general creation process.

You can also follow along with this video tutorial:

Prepare Your Assets

First, let’s look at how to create the 2D potato object that will back the facial features. When drawing your asset, think about where you would like the facial features to be positioned. Once you’re satisified, export the potato as a PNG with a transparent background.

Next, create the background image. In this example, we’ve drawn someone ready to eat from a plate at a table from a first-person perspective. Make sure the image has an aspect ratio of 9:16 and export it.

Feel free to download the following assets here:

↓ TalkingPotato.zip

Import Assets Into Effect House

First, let’s create a plane. You can do this by clicking + Add object > 3D > Plane. Feel free to rename the plane to “Potato” by right-clicking the plane and selecting Rename. Then create a new unlit material by clicking + Add asset > Material > Unlit.

Click Unlit in the Asset panel and select the Texture On checkbox in the Inspector panel. Click the default texture to open up the assets picker window and select your image from Textures.

Open up Render State 0 and change the Blend Mode to Transparent.

Add a Face Inset

Add a Face Inset by clicking + Add object > Face Effects > Face Inset. Drag the plane into the Face Binding object. Select the Depth Testing checkbox in the right panel. Adjust the position, scale, and rotation of the the Face Inset and the plane.

To add more facial features to the potato, duplicate Face Inset by right-clicking it and set the Face Area to Left eye or Right eye. Adjust the position to your liking.

Add a Background

Import the background asset into Effect House. Add another Image using the same steps as before.Click the Image and change Texture to your background image through the assets picker window. Change the Size to 720 x 1280.

Click the Canvas scene object and set Match Mode to Fill. This will ensure that the background image will always auto-adjust to fill the whole screen on different devices.

Make sure the 2D Camera object’s render order is set to a smaller number than the Camera object’s render order. Render Order can be found in the Inspector panel. The camera with the smaller render order will be rendered first.

Face Inset provides a variety of additional effects including feathering, color overlay, and outline that users can use according to their needs. Feel free to test out your effect!