We’re excited to share a fun new project template you can use to create your very own soundboard Lens! This Lens template features a set of buttons that each trigger a different sound and popup graphic.
Try a Lens made with the Soundboard Template by visiting this link or scanning this Snapcode:
In this post, we'll walk through all of the template’s features, and explain how you can customize the template to make it your own!
Getting The Template
To get started, download the Soundboard Template here.
Once it's downloaded, unzip the file.
Open it up in Lens Studio by selecting File > Open Project…
Navigate to the folder you just unzipped, select the soundboard_template.lsproj file and select Open.
Exploring The Template
Once you have the project open, you’ll see a set of buttons in the Preview panel. Try clicking on these buttons in the Preview to see what they do.
You should see that each button triggers a different sound and kitty visual.
The Soundboard Keys
The sounds and visuals triggered by the buttons are controlled by a group of SceneObjects. You can see them in the Objects panel, named with the prefix “SoundboardKey_”.
The Trigger Visuals
The Kitty visuals you see popping in after each button press are also SceneObjects, named with the prefix “TriggerVisual_”.
Editing The Template
Adding Custom Sounds
To edit the sound played by a button, start by selecting its corresponding “SoundboardKey_” object in the Objects panel.
The selected object has a SoundboardKey script. You can change the sound it plays by editing the “Audio Track” property on that script component.
To bring in your own audio track, in the Resources panel, select Add New > Import Files.
Adding Custom Visuals
To replace the image displayed on one of the popup visuals, start by selecting its corresponding “TriggerVisual_” object in the Objects panel.
The selected object has a Sprite component. You can change its image by editing the BaseTex property on the Sprite Component.
To bring in your own image, in the Resources panel, select Add New > Import Files.
Updating The Motion
Each of the TriggerVisual objects has its own predefined tweens for entering and exiting the frame. You can adjust these settings by editing the TweenBillboard script components attached to the “TriggerVisual_” objects.
To edit the visual’s start position, edit the “Start” property on the Tween named “show”, and edit the “End” property on the Tween named “hide.” Also, be sure to set the Sprite Aligner’s “Binding Position” property to match this value.
To edit the visual’s end position, edit the “End” property on the Tween named “show”, and edit the “Start” property on the Tween named “hide.”
To learn more about how the Tween system works, visit our documentation on Tweening.
Editing The Buttons
You can change the appearance of the buttons by editing the button’s Material, which you can find in Resources under “Materials.”
You’ll likely only want to adjust the Base Color and Base Texture.
By default, the buttons will be visible in Snaps recorded with your Lens. You can hide them by unchecking the “Show In Recording” checkbox on the SoundboardKey script component.
Previewing The Lens
You're now ready to preview your soundboard as a Lens. To preview your Lens in Snapchat, follow the Pairing to Snapchat guide. Don’t forget to share it with the community - we can’t wait to see what you make!