Quick-fire tips for Snapchat's Lens Studio

in programming •  7 years ago  (edited)

I recently worked on a few Snapchat lenses with a friend for an event. This was my first time creating a set of real lenses which other people would use, as opposed to just messing around with the software.

There were a few features which I really wish I'd known about before I got to work on the lens, and not knowing they were there certainly caused a few headaches, or made my life much harder than it needed to be.

Without further ado, here are some short, simple tips and tricks for working with Lens Studio.

  1. Lens Studio crashes quite easily, so save often. For a non-beta piece of software, it crashes far more than is ideal. On my Windows 10 laptop, Lens Studio would reproducably crash when I tried to print a non-string object from a script, or if I imported many files at once.

    In fairness, Lens Studio does have a project backup feature which runs automatically every few minutes, but I wouldn't rely on it.

  2. The script object does way more than just holding your @input variables. It's actually an instance of ScriptComponent, and as such can be used to get the SceneObject or Transform which the script is attached to, using script.getSceneObject() and script.getTransform() respectively.

    You can also use it to dynamically create and attach events to your objects:

    script.createEvent("TouchStartEvent").bind(function() {
      print("Touch started.");
    });
    

    This is really handy for quick prototyping if you only want to use one Script asset for several events.

  3. By default, your imported animations will look very low quality. We used After Effects CC to create animations for the lenses, and it worked fantastically, looking really crisp. But, as soon as the animation was imported into Lens Studio, it looked significantly worse, with blurry edges as a result of heavy compression.

    The reason for this is that Lens Studio uses sprite sheets for animations. A sprite sheet is an image where every frame of an animation is laid out as a grid. To play the animation, the software you're using effectively pans through the sprite sheet frame-by-frame. This results in much better performance than loading images individually.

    In Lens Studio, every sprite sheet has a cap on its size, which means that the frames of your animation will be scaled down to fit in the sprite sheet. You can see the effect of this by looking at the Animation asset's properties in Lens Studio; my beautiful 1500x600 animation had been squished to an ugly 113x282:

    Fortunately, there's an easy fix. When importing your animation, you can increase the number of sprite sheets which your animation is spread across:

    Don't go too high though, since there's a 4MB size limit on every lens. You can check the current size of your lens in Project Info:

  4. Test the lens on a real device often. There can be huge differences between the preview and an actual device, most notably in animation quality and speed. Remember that you don't have to publish your lens to test it on a device; you can just pair your phone to Lens Studio.

  5. If you're a gamer and you have Plays.tv, I'd recommend disabling it whilst creating lenses. It thinks Lens Studio is a game, but as I'm sure you already know, lens creation is a much more serious business. Worse still, it doesn't really understand the UI; my work in Lens Studio was regularly interrupted by this monstrosity:

  6. Stuck while scripting? The API documentation is excellent. The tutorials on Snap's website are pretty useful, but once you get into more advanced scripting, you'll want to refer to the API documentation all the time. It's well written and laid out, and there are examples for working with most of the classes which Lens Studio offers.

  7. For creating headwear, learn about Face Occluder. This is an object which hides other 3D objects behind it, and is automatically attached to a Head Binding. It's difficult to describe, but basically, it's the magic object which means your lens' glasses don't stab you in the eye. You should fiddle with positioning so that your headwear looks just right when you tilt your head.

I hope these tips have helped you! If you've got any other hints for Lens Studio, or improvements to any of mine, then leave them in the comments.

Authors get paid when people like you upvote their post.
If you enjoyed what you read here, create your account today and start earning FREE STEEM!
Sort Order:  

@orangeflash81, I gave you an upvote on your first post! Please give me a follow and I will give you a follow in return!

Please also take a moment to read this post regarding bad behavior on Steemit.

Congratulations @orangeflash81! You have completed some achievement on Steemit and have been rewarded with new badge(s) :

You published your First Post
You got a First Vote

Click on any badge to view your own Board of Honor on SteemitBoard.
For more information about SteemitBoard, click here

If you no longer want to receive notifications, reply to this comment with the word STOP

Upvote this notification to help all Steemit users. Learn why here!