Snap-ins for Mobile Apps is the best way to build customer service features right into your iOS or Android app. With this SDK, you can add real-time features such as two-way video, screen sharing, and text-based chats with agents. You can also add self-service features such as a knowledge base and a case publisher. In this blog post, we want to show you how easy it is to get started with the real-time chat feature in this SDK. This feature lets your customer talk to an agent right from within your app.
However you choose to use this SDK, it lets you build and brand a native mobile support experience that fits seamlessly into your existing app.
Set up that org!
Before you start using the SDK, your org will need to be set up to use Live Agent with a deployment and a button. You’ll need to grab the org ID, the Live Agent API endpoint, the deployment ID, and the button ID. See Console Setup for Live Agent Chat for more guidance.
OK. Done? Once you’ve got all of that in place, you have to pick your poison: iOS or Android. Drop down to the section that suits your mobile preference — we won’t judge!
The iOS way
We’ll be using the Swift language, but you can also use Objective-C if you prefer. For this example, we suggest you create a Single View App from Xcode.
For this example, let’s keep things savvy and use the Swift language.
Next, download the iOS SDK from the Service Cloud Snap-ins for Mobile Apps product page. You can find it in the iOS SDK section. (If you prefer to use CocoaPods, then just follow the CocoaPods instructions from the developer’s guide.)
Unzip the SDK and embed the following frameworks into your project: ServiceChat, ServiceCore, SmartStore, SalesforceSDKCore, SalesforceAnalytics, CocoaLumberjack.
Now let’s add the appropriate permissions to your Info.plist file:
Now we’re ready to add a button to our project. Drag a button onto your main view controller. Rename the button to something helpful, like: Snap-ins Rock!.
Align the button to the other views so that it’s positioned correctly on all supported devices.
Now create an action method for the button in our view controller class and name it buttonTapped.
OK. We can finally get to the coding. Add these lines to the top of your ViewController class so that we can access the desired classes:
Let’s configure chat with the four values you should have after setting up your org in the previous section: the Live Agent endpoint, the org ID, the deployment ID, and the button ID . If you need help getting this info from your org, see Get Live Agent Chat Settings from Your Org. We’re going to create a chat configuration (SCSChatConfiguration) instance variable and then instantiate that object in the viewDidLoad method:
Now let’s start a chat session from the button action handler (buttonTapped) using this line of code:
Now make sure that you log in to your console on your org and go online using the Live Agent or Omni-Channel routing (whichever one you configured earlier):
Once you have an agent online, you can run the app, tap your button, and start a chat session.
Pretty cool, huh?
To really do this right, you’ll need to implement a delegate (SCSChatDelegate), so that you can handle failed connections and error conditions. Otherwise it will fail silently. Also, you’ll want to brand it so that it looks like the rest of your app. You can read all about that in the iOS developer’s guide (the Live Agent Quick Setup in particular) or check out our iOS examples on GitHub.
The Android way
You can easily set up Live Agent Chat in your Android app. Just build a Basic Activity app.
You’ll need to get the SDK from Gradle. You can do this by adding https://salesforcesos.com/android/maven/release to your list of project repositories in your project’s build.gradle script.
And then update the dependencies from your app’s build.gradle script.
Also, declare permissions in your AndroidManifest.xml file.
Now let’s create a chat configuration object using your org settings. If you need help getting this info from your org, see Get Live Agent Chat Settings from Your Org. You’ll want to persist this object across the lifetime of your app (think Application, as opposed to Activity).
Hold on to that configuration object for when you’re ready to use it.
Whenever you’re ready to launch a chat session — like from the onClick of the floating action button in your Activity — just use that configuration object to launch a chat UI:
Now make sure that you log in to your console on your org and go online using the Live Agent or Omni-Channel routing (whichever one you configured earlier):
Once you have an agent online from your console, you can run the app, tap your button, and start a chat session.
You’ll want to add listeners to handle state changes and events. You’ll also definitely want to brand it so that it looks like the rest of your app, but this intro blog post should get you started. Check out our Android developer’s guide (the Live Agent Quick Setup in particular) or our Android examples on GitHub for more info.
Conclusion
So now you’ve gotten a quick peek into the power of the Snap-ins for Mobile Apps SDK. We just scraped the surface of the chat feature, but there’s so much more you can do with the SDK. We haven’t even told you about SOS, Knowledge, or Case Management, or how easy it is to brand the SDK so it looks and feels just like the rest of your app. Check out the Snap-ins landing page for the rest of the story. As you can see from this short post, it doesn’t take much to get started with the Snap-ins SDK!