Mobile

Create Your Own Mobile Chatbot with Cognitive Concierge

Share this post:

A growing trend in retail digital experiences is the use of chatbots to engage users in conversational mode. These help in determining what customers are looking for and how to best meet their needs. Advances in this technology are impressive. Anchored by mobile—with integration of cognitive services and delivered on the cloud—these apps provide personalized insights and recommendations in the moment.

Recently, Belinda Vennam and Sarah Chen at the IBM Mobile Innovation Lab created a starter application to show the ease of delivering these type of apps. Cognitive Concierge makes recommendations to the user based on a conversation with the app’s chatbot.

The video tutorial below shows the development of the conversation for special events and recommendations of restaurants that are best suited to the situation and event. It can easily be extended to situations, events, merchandise, and other retail-specific scenarios.

CognitiveConcierge Overview from IBM Cloud Experience Lab on Vimeo.

 

 

 

 

 

Getting started: Creating your own Cognitive Concierge

Cognitive Concierge Cellphone ImageMobile Chatbot Cellphone ImageMobile Suggestion Cellphone Image

You will need a Mac to work with the client part of this app. You can find the open source code for the app on GitHub.

The iOS client application is written in Swift and utilizes the Watson Developer Cloud’s iOS SDKs for Dialog (Conversation), Text to Speech, and Speech to Text. The server-side application is also written in Swift with the Kitura web framework and utilizes the Alchemy Language APIs. Consuming these cognitive services was made very simple by hosting our server side application on IBM Bluemix.

There are a number of important reasons you want a server-side component for your mobile application. In our case, we were able to reduce networking calls and client-side processing by pushing the restaurant recommendation code out to the server. If this app was in production, we would also have the ability to easily update and improve the restaurant recommendations over time. This is critical when client-side code changes often require all users to get the updated app.

By providing the recommendation code as a Swift API, we can easily share this with other applications or application developers. With an API management offering, like IBM’s API Connect, we could implement rate limiting and tiered levels for other developers that might want to build around our API.

This application could be used as a starting point for your own retail chatbot application—leveraging the latest in cognitive capabilities—or as an example of how you might set up a similar application yourself.

To recreate this application on your own machine, follow the steps below.

Before you begin your chatbot journey

There are a few things you’ll need to do before you start creating:

Now we’re ready to get going.

Setting up your application

Deploy the Server Application to Bluemix using IBM Cloud Tools for Swift (ICT)

Open the IBM Cloud Tools for Swift MacOS Application. Click the Create (+) button to set up a new project. Next, select the Cognitive Concierge Quickstart Application. Click Save Files to Local Computer to clone the project. Once the project is cloned, open up the .xcodeproj file that was created for you in ICT under Local Server Repository. Edit the Sources/restaurant-recommendations/Configuration.swift file’s constants struct with your own Google API Key for Web.

localrepository

Finally, you can use ICT to deploy the server on Bluemix. Click Provision and Deploy Sample Server on Bluemix under Cloud Runtimes. Give your Cloud Runtime a unique name, and click Next.

Point the iOS Application to the Server Application

With ICT, you can control whether the mobile application is pointing to a local or remote instance of your server code. For this step, ensure that the Connected to: field in the Client application settings is pointing to your server instance running on Bluemix. You can also point to your localhost for local testing, but you need to be running a local instance of the server application for this to work.

Update Conversation Service

Once ICT has provisioned your Cloud Runtime, you should have a Conversation Service instance in your Bluemix dashboard. This Service enables you to add a natural language interface to your applications. While you could create a conversation tree manually, we’ve provided the conversation for this application in the Resources folder at the top level of the project. (This is one area where different retail scenarios can be explored using different or enhanced conversations)

In ICT, Click on the Bluemix icon in Cloud Runtime to go to your Application Details page on Bluemix.

cloudruntimerunning

Select the CognitiveConcierge-Conversation Service under Connections.

cogcondashboard
Scroll down and select Launch Tool.

Log into Watson Conversation with your IBM ID and go to the Create Workspace page. Select Import, and upload your .JSON file (Resources/conversationWorkspace.json) representing the conversation for this application.

watsonconv
Once the Conversation is created, select the More Options icon, and click View Details. Note the Workspace ID for use in your iOS application.

workspaces
Now go to the Client App section of the project and click on the icon next to the label containing CognitiveConcierge.xcworkspace. Copy the WorkspaceID into the CognitiveConcierge.plist file.


Note: Watson may take a few minutes to train based on the conversation workspace that you just uploaded. You can see if Watson is finished training by clicking the conversation workspace, then Dialog, then the chat icon in the upper right hand corner. This is also how you can try out the conversation and test your bot.

Run the iOS application

Install dependencies and run the iOS app

From Terminal, change directories into the YourProjectName/CognitiveConcierge-iOS folder. Run the following commands to install the necessary dependencies: carthage update –platform iOS and pod install.

Open the CognitiveConcierge.xcworkspace file (your Client App in ICT) in Xcode 8. When you deployed the server application to Bluemix using ICT, some services were provisioned for you on Bluemix, including Conversation, Text to Speech, and Speech to Text. Each of these services has some credentials that are required for the iOS application to be identified by your services on Bluemix. Put each of the required credentials into the CognitiveConcierge.plist file found at CognitiveConcierge-iOS/CognitiveConcierge/CognitiveConcierge.plist.

To find the credentials follow the below steps:

Return to your application details page on Bluemix which you can access by clicking on the Bluemix icon within ICT’s Cloud Runtime.

cloudruntimerunning

Click on ‘Runtime’ then ‘Environment Variables’ to access every services’ credentials within VCAP_Services to add into the CognitiveConcierge.plist file.

variablesinbm

Press the Play button in Xcode to build and run the project in the simulator or on your iPhone!

Find a restaurant with Cognitive Concierge

Now that the application is running, select the Restaurants option, which is the only option currently implemented for this starter app. This will bring you to the chat screen powered by Watson’s Conversation service. You could look for restaurant options for your birthday, anniversary, or just a date night. All of these are defined in the Conversation service’s conversation workspace file you previously uploaded to the Conversation service.

Once the conversation bot has determined the occasion and time for your upcoming event, the iOS app makes a call to the server-side Swift restaurant recommendations API. This API analyzes restaurant review text from the Google Places API with the Alchemy Language API to provide the perfect restaurant choices for you. These options are then returned to the iOS application for display.

To see these server calls in action, you could run the server application locally in Xcode by opening the Server .xcodeproj file (restaurant-recommendations.xcodeproj), changing the scheme to the executable, and then pressing play.

xcode1

Place a breakpoint in the main.swift file at the endpoint for /api/v1/restaurants. You’ll see the breakpoint in your local server getting hit, when you run the iOS application and complete your conversation.

Congratulations! You have now successfully created a mobile chatbot leveraging the latest cognitive and API creation technologies in IBM Bluemix, featuring both an iOS application and server side application in Swift. You have also connected those two applications to the appropriate APIs and services on Bluemix or elsewhere.

Consider the ways you would leverage this technology for your own apps. You can extend or redo this chatbot app to leverage other retail scenarios, including addressing shopping scenarios for merchandise. Explore the cognitive, mobile, and other Bluemix services on your own and use the Mobile Services on Bluemix page as a good starting point.

More Watson Stories

Spring Kafka application with Message Hub on Bluemix Kubernetes

In this post, I'll describe how to create two Spring Kafka applications that will communicate through a Message Hub service on Bluemix. One application will act as a Kafka message producer and the other will be a Kafka message consumer. We will deploy these applications to a Bluemix Kubernetes cluster.

Continue reading

Rapidly developing applications (part 3): implementing your microservices project

This is the third post in a series on microservices application development. The series provides a context for defining a cloud-based pilot project that best fits current needs and prepares for a longer-term cloud adoption decision.

Continue reading

How to migrate OpenWhisk api-experimental APIs

Earlier this year, the wsk api command was introduced as the replacement for the wsk api-experimental command. The wsk api-experimental command is now deprecated and will be withdrawn at the end of July, 2017. On August 1st, all APIs created with the wsk api-experimental command will be removed.

Continue reading