Promote Your Club’s Event with Snapkit Creative Kit

Major League Hacking
Major League Hacking
5 min readFeb 3, 2021

--

Speak your users’ language by making your content easily shareable in their Snapchat Snaps. Creative Kit allows you to easily create and promote your events with branded stickers for your users to share. Let them spread the word to their friends with your custom stickers directly from your app.

Stickers allow you to easily share media, URLs, prepopulated captions, and Lenses with your audience from your application to help promote your events. Help users promote the events and activities they care about by having a sticker ready to share. Follow along below to learn how to integrate Creative Kit into your next app, create custom stickers for your next event, and make a Lens to share the good news!

Create a Snapkit Sticker

Enable users to promote your events by adding stickers from your website or app to their Snaps. You’ll use Snapchat’s Creative Kit to integrate your next iOS mobile app (using swift and Xcode) with Snapchat. Then, you’ll be able to use custom stickers with the click of a button. Note: you’ll need a new or existing Snapchat account to accomplish this.

  • Log-in to the Snapkit developer portal and create a new app.
  • Open the new app and enable the Creative Kit. While on this page, take note of the Bundle ID field and Client ID.

Open up swift and Xcode and create a new project. Make sure to use SwiftUI as the Interface and Life cycle options. Once created, follow the steps below:

  • Navigate to the project file in your terminal and initialize CocoaPods with $ pod init
  • Open your Podfile and add the Snapchat Creative Kit SDK with pod 'SnapSDK', :subspecs => ['SCSDKCreativeKit']and install by running $ pod install
  • Open the new .xcworkspace (not the .xcodeproj) and the info.plistfile adding these lines:

<key>SCSDKClientId</key>

<string>YOUR OAUTH2 CLIENT ID</string>

<key>LSApplicationQueriesSchemes</key>

<array>

<string>snapchat</string>

</array>

  • Add your Bundle ID to your Snapchat app through the dashboard
  • Open ContentView.swift and add the code below to create some content for the page:
...var body: some VIEW { () { VStack() { Text("Promote Your Club's Next Event") .font(.title) .multilineTextAlignment(.center) Text("Add your event poster to Snapchat as a Sticker!") .font(.subheadline) .fontWeight(.medium) .multilineTextAlignment(.center) } VStack() { Button(action: { print("Button Clicked Test") }) { Text("Send to Snapchat") .font(.body) .fontWeight(.semibold) } .padding() .background(Color.yellow) . cornerRadius(25) .offset(y:40) .foregroundColor(Color.black) } Spacer() } ...

The preview should look something like this:

With the UI scaffolding out of the way, the next thing to do is add an image for users to be able to share:

  • Find the image you would like to use as your poster for your event and add it to the project folder.
  • Open Assets.xcassets and drag the file onto the assets catalog to add it.

Now let’s create a Snapchat API data payload when the “Send to Snapchat” button is clicked. Paste in the code below inside the button action declaration.

...
Button(action: {
// Snapchat requires the UIImage data type in its API call so this takes the Image() and converts it into something Snapchat will accept
let bundlePath = Bundle.main.path(forResource: "SecretClubLogo", ofType: "png")
let image = UIImage(contentsOfFile: bundlePath!)
let stickerImage = image!

// sets the image as a Sticker for the Snapchat call
let sticker = SCSDKSnapSticker(stickerImage: stickerImage)

// creates an empty response body to send to Snapchat
let snapContent = SCSDKNoSnapContent()
snapContent.sticker = sticker // assigns the sticker to the response body

let snapAPI = SCSDKSnapAPI(content: snapContent) // assigns the API call
snapAPI.startSnapping { error in // sends the response body to Snapchat with API call
if let error = error {
print(error.localizedDescription)
} else {
// success
}
}
}) {
...

You should end up with something like this:

IMAGE

As you can see, you can create almost any kind of sticker as long as they are JPG or PNG under 100MB.

How to Create a Snapkit Lens

You want to promote your events or special occasions with interactive, unique *dynamic filters* to drive engagement further. To create custom lenses, start by downloading Lens Studio. We’ll be building a countdown timer, which is a great way to build excitement for your upcoming event.

Lens Studio starts you off with several templates to select from to help you get started. After opening Lens Studio:

  • Click on the Templates tab and select the template you want to use
  • Follow along with the template demo to set the date and appropriate text
  • Then click the top left “Publish Lens” button. It will shortly go into review before it is made public.
  • Click on the lens once it goes live and copy the Lens ID.

Going back to Xcode, add a new button below the one you just made. This button will launch Snapchat and pull up your countdown lens automatically. The concept is very similar, and a lot of the same code is used again but with a different class used.

This time, SCSDKLensSnapContent() will be called to initialize the Snapchat object. Set the lensID to the Lens ID of your newly published lens and load it as the content into the API method call like before. Your code should look something like this:

...
Button(action: {
// Set lens ID of countdown lens
let snapContent = SCSDKLensSnapContent(lensID: "229227ec-51f7-4d77-8e48-07b92c82d693")
snapContent.caption = "How many days left?!" // optional

let snapAPI = SCSDKSnapAPI(content: snapContent)

snapAPI.startSnapping { error in
if let error = error {
print(error.localizedDescription)
} else {
// success
}
}
}) {
Text("Launch the Countdown!")
...

This particular example shares a model with Snapchat without any data except the lens attachment. URLs, captions, and additional launch data can be sent with the object, but stickers can not. See here to read more about how the different classes are constructed.

Why CreativeKit is Valuable for Marketing Your Event

Drive Engagement for your events by creating interactive and fun ways to share. Creative Kit allows you to easily craft branded stickers, pictures, URLs, and captions within your products that are ready to share. Snapchat reaches younger audiences where traditional marketing has struggled to gain traction. Users sharing with friends allows you to concentrate on the branding and let your users advertise for you. Taking selfies with club stickers and using whimsical filters allows for fun in marketing while remaining authentic.

--

--