Optimizing 2D Textures, Best Practices
Featured
Lenses need to be under 4 MB when submitted to Snapchat. Additionally, when loaded on device, they need to consume less than 120 MB of RAM. Often, for creators, the biggest culprit for heavy lenses is unoptimized 2D assets. Below, I’ll walk through some best practices for optimizing your 2D textures.
Checking Lens Stats
First, you can check your Lens’ current size and memory consumption (RAM) by pairing Lens Studio to Snapchat and previewing your Lens on device. When paired, click the little gear icon in the top right corner to see your Lens’ performance stats. For more information, follow the Pairing to Snapchat guide.
Using the Public Folder
The best way I’ve found to do an optimization pass is to open your project’s Public folder. You’ll find it wherever you saved your project. Here, you have direct access to all of the assets in your project. You can then make changes to the textures directly.
Smaller Textures
Check every texture in your project and make sure that the resolution of the texture is necessary. Reducing the resolution of your texture will have big savings for both the size of the Lens and the Lens’ RAM consumption. Often, 3D textures are made at 2048 x 2048. In a lot of cases, you can reduce these textures to 1024 x 1024 or even 512 x 512 depending on the complexity of the texture and how big you expect the model to be on screen.
TIP - Be on the lookout for single color textures that could be reduce to a single pixel.
TIP - A 3D model's textures don’t all need to be the same size! For example, if there isn’t much detail in your normal map, try making it smaller than your base color texture.
JPG if you can, PNG otherwise
Lens Studio supports two image formats: JPG and PNG. JPG images are often much smaller than PNG. That said, they don’t support transparency. If your 2D image doesn’t need transparency, always use JPG. For example, most textures used for 3D models don’t need transparency, because of this JPG will work just fine. Only use PNG if you actually need transparent pixels.
Compression
Try to run all your 2D textures through some form of compression. In most cases, you can reduce an image size significantly using compression without noticeable visual degradation. There are a number of compression settings Photoshop offers when exporting images. That said, if you want to do a quick pass, tinypng.com is simple to use and offers big savings.
2D Animation
2D animation is often the biggest culprit for heavy lenses. Once you’ve created a 2D animation in Lens Studio, it will save a sprite sheet to your project’s Public folder. Like any other texture, you can optimize this sprite sheet directly in the Public folder. Try to reduce the resolution and run compression on this outputted sprite sheet to reduce the size of your Lens.
One important thing to look out for when importing 2D animated textures into studio is the single texture maximum size. A rough estimate is that one lens can have two to three 2048*2048 textures or five to six 1024*1024 textures.
A useful tip is to avoid repeated frames in your image sequence if you want to fit more frames or animations and maintain a good resolution. If you want certain frames to have a longer duration than the other frames, instead of duplicating that image in your image sequence, you can control that via script.