Start tracking your progress
Trailhead Home
Trailhead Home

Prepare for Mobile Chatbots

Learning Objectives

In this project, you’ll:

  • Set up Chat and Einstein Bots in your org.
  • Build a native iOS app, using Xcode, that provides the chatbot experience.
  • Make your chatbot smarter with a contextual response.
Note

Note

This project was produced in collaboration with Apple. It is designed for a Mac running macOS High Sierra or Mojave. If you do not already have Xcode installed, doing so requires upgrading to macOS Catalina.

Note

Note

This is an Intermediate level project. We build on the foundational learning found in the Swift Essentials and Xcode Essentials modules. While we encourage adventurous learning, know that these essential modules are here to help you get a deeper understanding of the steps in this project. 

Why Build a Chatbot?

There are many channels for your agents to engage with customers. Email, social media, messaging—these channels aren’t going away anytime soon. How are you using these to focus your agents on helping with the complex issues they are uniquely skilled for? Are there any predictable customer needs that can be resolved effectively before they even get to an agent?

Now that smart devices are becoming more ubiquitous in our homes, you’re undoubtedly familiar with some tasks that computers are far faster at solving than humans. For instance, you can check the weather or set a timer using Siri on your iPhone in a few seconds.

Similarly, chatbots are a great way to enhance a chat session, taking advantage of things that computers are extremely fast at doing like looking up and presenting information. Whether it’s through machine learning and natural language processing, or just by using a clean, automated menu system, a chatbot can make life easier for you and your customers.

Salesforce provides you with Einstein Bots for chat and messaging to get this done.

Why Go Native Mobile?

Your customers are often on their mobile devices when looking for support. One part of your mobile solution might include making your website mobile-friendly. But oftentimes, the best user experience on a mobile device comes from a mobile app that is natively designed for the platform. 

Among other things, customer service in a native app enables a seamless experience right on the mobile device. With the Embedded Service SDK you can add chat and chatbots directly into your native iOS mobile app. You can even brand the chat experience so that it fits naturally within the app you’ve already designed for your customers.

Get the IDE and SDK

This project helps you get your org set up for chatbots. Then we build an iOS app that can launch a chatbot session and let you take advantage of your bot from within a native mobile iOS app. 

Before we’re ready to dig into our mobile app: 

  1. Download the Xcode Integrated Developer Environment (IDE) from the Mac App Store if you don’t have it on your machine. This is where you build apps for Apple products including iPhone, iPad, Apple Watch, Apple TV, and Mac—all from one place.
  2. Download the Service SDK framework files from the Service SDK download page. We recommend using the manual download option. More on that later.

It can take a while for Xcode to download. While that’s happening, feel free to continue on with this project. You won’t need the IDE or SDK until the next step.

Launch Your Trailhead Playground

To complete this project, you need a free Trailhead Playground. We recommend you create a brand-new one for this project. You can find it at the bottom of this page. Click Create a Trailhead Playground to open a new Trailhead Playground in a new browser tab.

Hands-on org menu open at the bottom of a Trailhead project with an arrow pointing to Create a Trailhead Playground option.

It can take a few minutes for it to become available. Sit tight. Once it’s ready, make sure it’s selected, indicated by a checkmark. Then click the Launch button.

Set Up Chat

There’s a guided setup flow that helps you set up web chat in just a few minutes. Head over to Service Setup and follow the Chat setup flow.

  1. Click the Setup gear icon and select Service Setup.
    Service Setup highlighted with a red rounded box from the gear dropdown on the upper right of the Salesforce homepage.
  2. Under Recommended Setup, click View All.
    View All highlighted with a red rounded box in the Service Setup Home.
  3. In the search box, enter Chat, and select Chat with Customers.
  4. After you read the overview page, click Start.
  5. Set up your queue.
    • Queue Name: Chats
    • Name This Agent Group: Chat Agents
    • Select yourself and any other members to add to this group.
    • Click Next. In Set Up, Chats is entered in the Queue Name field and Chat Agents is entered in the Name This Agent Group field.
  6. If you’re asked to prioritize chats with your other work, enter the routing configuration name Chats and give it a priority of 1. Then click Next.
  7. Now it’s time to set capacity and workload. We want agents to be productive, but not burn out. In a real-world scenario, you may need to monitor agent workload and adjust this over time, based on case volume and agent feedback.
    • Work Item Size: 5
    • Agent Capacity: 20
    • Click Next. Work Item Size is 5 and Agent Capacity is 20 in the Chat Setup.
  8. Let’s make it work for the web. The idea is if your customer can access chat from the web, they can access it everywhere.
    • Website URL: https://*.force.com (when setting this up for your business, this would be the URL for your website).
    • Salesforce Site Domain: Type a domain prefix in the text field in order to create a new, unique domain.
    • Accept the Terms of Use by checking the box, then click Next. Set Up Chat offers fields to enter Website URL and the ability to connect a Salesforce site.
  9. For the type of chat, select Service then click Next. In Set Up, the selected type is Service.
  10. Choose whether you want to provide offline support for customers. For this project, leave it Off and click Next.
  11. Copy the code snippet by clicking Copy to Clipboard and paste it in a text editor. You need to extract a few pieces of information from this code snippet to use for later. You’ll be able to track down this information afterward, but it’s easier at this point in the process. So paste the snippet in a text editor... right now. The Get the Snap-ins code snippet screen with the Copy to Clipboard highlighted with a red box.
  12. Click Next and then Done.

Record Configuration Information

You should have pasted the code snippet into a text editor. If not, do so now. 

Find and make note of the following configuration information from the embedded_svc.init function.

  1. Chat Endpoint Hostname (POD Name)—This value is the hostname of the baseLiveAgentURL property. When copying the hostname, be sure not to include the protocol or the path. For instance, if the value for baseLiveAgentURL is https://d.la2.salesforceliveagent.com/chat, then the hostname is d.la2.salesforceliveagent.com. This is referred to as your POD Name when you do your work in Swift and Xcode.
  2. Org ID—If you don’t already know this value, it is the fourth argument in the embedded_svc.init function call.
  3. Deployment ID—This value can be found in the deploymentId property.
  4. Button ID—This value can be found in the buttonId property.

Configuration information highlighted 1-4 in the rows of code for embedded_svc.init.

Save these four pieces of information for the next unit, where we configure the SDK.

Note

Note

If you don’t copy this information now, you can copy it later using the instructions in Get Chat Settings from Your Org.

You just finished setting up chat. And Omni-Channel. And Snap-Ins. Whoah!

Enable Einstein Bots

Now that we’ve got our chat implementation ready, we can enable our chatbot and start chatting with it from the web, from a community, or from a mobile device! That’s right. This is a very powerful and wide-reaching feature we’re working with here.

  1. From Service Setup, enter Einstein Bots in Quick Find and select Einstein Bots.
  2. In the Settings area, set the Einstein Bots switch to On. If you’re enabling the bot for the first time, you are asked to accept the terms. Go ahead and check the box indicating you’re authorized and then click Try Einstein.
    Einstein Bots setup screen with Einstein Bots switched to On, Log Conversations enabled, and Bot Options Menu enabled.
  3. Make sure that the Bot Options Menu is enabled—click the dropdown arrow for this option, click Edit, check the corresponding box, and click Save.
  4. Click New from the Einstein Bots setup page.
  5. Click Next.
  6. When prompted, provide basic information about the bot, then click Next. You do this several times.
    Prompt
    Input
    Einstein Bot Name
    Mobile Chatbot
    Description
    Chatbot for iOS
    Einstein Bot Greeting Message
    Hi! I’m an Einstein Bot. How can I help you?
    Main Menu Item 1
    Order Related
    Main Menu Item 2
    Appointment Related
    Main Menu Item 3
    Leave this field blank.
  7. Click Create, then Finish. When your new bot is ready, you’re taken to the Einstein Bot Builder.
    The Create an Einstein Bot setup screen with a message from Astro and configurable menu items.

  8. Add a channel for your bot.
    • Click the dropdown on the top left of the Einstein Bot Builder and select Overview.
    • In the Channels section, click Add.
    • Channel: Chat
    • Deployment: Chat Agents
    • Click Save. Now, instead of going directly to an agent, customers are first connected to your bot.
    • Leave Require Agent Online set to Off. This is ideal when your agents work limited hours and you want the bot working 24x7. We’re also leaving this deselected so we can test the bot without having to set up the agent side of the chat implementation.
  9. To activate your bot, click Activate.
    The top of the Einstein Bot Builder screen with the Activate button on the top right highlighted with a rounded red box.

You did it! Your bot is now ready to use. If you want to play around with the bot before building the mobile app, check out the recipes in the Bot Cookbook Developer Guide.