conversational commerce and magento 2: breaking new ground with facebook, alexa, and slack

Conversational Commerce and Magento 2

Breaking new ground with Alexa, Facebook and Slack

Conversational Commerce: Magento, Facebook and Alexa | October 2016 1

@philwinklegithub.com/philwinkle


@magetalk


somethingdigital.com/careersConversational Commerce: Magento, Facebook and Alexa | October 2016 5

What is Conversational Commerce?

(C12L)


What is it not?

C12L is not about shopping online in a chat bot. It is about creating opportunities to engage with customers in an asynchronous way


So then what is Conversational Commerce?

— Conversational, when done well, is assistive

— It is engaging

— It is helpful

— It creates value


C12L Commerce

This is not a new concept. "Bots" have been around for ages. What is new is that we can now interact with them outside of our traditional desktop computer contexts.


We shouldn't be repurposing APIs for every medium. Each

medium excels in its own particular niche given its

audience.


— Not for all contexts

— Alexa: Store Insights / Administration

— Slack: Developer Support

— Facebook: Consumer


Why not Alexa for purchasing on Magento?

— API could be used, so it's possible

— Purchase decisions are hard

— Predciated on choice

— Search and browse is impossible via spoken word

— Write one API, use it many places...


Why would we want this?

— We're moving away from Visual UI

— Spoken word is the fastest way to communicate (send)

— Written text is the fastest way to consume


We're becoming increasingly distracted


What kind of change does this mean for businesses?

— Change of jobs and expertise

— Fewer creative arts, more communications

— Call trees replaced by chat trees

— Asynchronous, on your time === 24/7


Obvious commerce applications

— Beyond the purchase:

— Status, update, cancel, replacement

— Reorder

— 1-click, ephemeral


Challenges


Challenges

— Fragmented APIs mean lots of boilerplate code to interact with your store capabilities

— For Magento this is likely REST API

— Different UIs mean different skillsets


Technologies


— Alexa

— Facebook

— Slack


Alexa

Upside:

— Robust API

— Geared toward commerce (future)

— Rapid dev

— 3rd party consumer

— FREE (Raspberry Pi)

— BYOL(anguage)Conversational Commerce: Magento, Facebook and Alexa | October 2016 21

Alexa (cont.)

Downside:

— Physical devices (right now)

— Lower adoption with dependence on physical devices


Thankfully

— Serverless.js

— Alexa App on Node.js


Developer boilerplate without Alexa App:

exports.handler = (event, context, callback) => { try { console.log(`event.session.application.applicationId=${event.session.application.applicationId}`);

/** * Uncomment this if statement and populate with your skill's application ID to * prevent someone else from configuring a skill that sends requests to this function. */ /* if (event.session.application.applicationId !== 'amzn1.echo-sdk-ams.app.[unique-value-here]') { callback('Invalid Application ID'); } */

if (event.session.new) { onSessionStarted({ requestId: event.request.requestId }, event.session); }

if (event.request.type === 'LaunchRequest') { onLaunch(event.request, event.session, (sessionAttributes, speechletResponse) => { callback(null, buildResponse(sessionAttributes, speechletResponse)); }); } else if (event.request.type === 'IntentRequest') { onIntent(event.request, event.session, (sessionAttributes, speechletResponse) => { callback(null, buildResponse(sessionAttributes, speechletResponse)); }); } else if (event.request.type === 'SessionEndedRequest') { onSessionEnded(event.request, event.session); callback(); } } catch (err) { callback(err); }};


With Alexa App:

'use strict';

var rp = require('request-promise');var alexa = require('alexa-app');var app = new alexa.app('sample');var options = require('config');

app.intent('SalesVolumeIntent', function(request, response) {

options.uri = 'http://c12l.philwinkle.com/index.php/rest/V1/admin/sales/totals/today';

rp(options) .then(function (res) { response.say("Your sales for today are currently " + res.grand_total + " dollars"); response.send(); });

return false;});

exports.handler = app.lambda();


Siri

Upside:

— Billions of devices (literally)

— Soon in our ears (thanks Airpods)

Downside:

— Swift / App dev focus


Implementation details


Alexa Taxonomony


Utterances

Utterances is the phrase that maps to an intent to process a request

CheckStoreOnline is my store onlineCheckStoreOnline are you onlineCheckStoreOnline if it is onlineCheckStoreOnline statusCheckStoreOnline current status


Intents and Slots

An intent allows you to map a phrase or phrases to a static function

CheckStockLevel how many {item} are in stockCheckStockLevel how many {color} {item} are in stockCheckStockLevel how many {item} do I haveCheckStockLevel how many {color} {item} do I haveCheckStockLevel what is the stock level of {item}CheckStockLevel what is the stock level of {color} {item}


Skill

A skill is a group of utterances which represent common functionality. Essentially, an "app", for Alexa.


Serverless = Stateless

Because Alexa runs Lambda functions it is inherently stateless. State can be stored either- as a long-running session with multi-step question and answer workflows- stored in DynamoDb for later retrieval


Magento 2 REST APIs


Interesting endpoints to consume for logged-in customers:

Quote REST API:

GET /V1/carts/mineGET /V1/carts/mine/itemsGET /V1/carts/mine/payment-methodsGET /V1/carts/mine/selected-payment-methodGET /V1/carts/mine/shipping-methodsGET /V1/carts/mine/totals


Use tokens for customer-authenticated REST


Generate a token:

/rest/V1/integration/customer/token


Example:

curl -X "POST" "http://c12l.philwinkle.com/index.php/rest/V1/integration/customer/token" \ -H "Content-Type: application/json" \ -d $'{"username":"[email protected]", "password":"asdf;lkj1234"}'


Get cart totals:

curl -X "GET" "http://c12l.philwinkle.com/index.php/rest/V1/carts/mine" \ -H "Authorization: Bearer 3g43lph2w0lcfh6719ltaa0fiml6sma1" \ -H "Content-Type: application/json"


Things that help

— Having an Alexa Device

— https://echosim.io/

— Testing tools in AWS Lambda Available

— Testing tools in Developer Portal

— Paw / REST testing tool


Facebook Messenger


Messenger

Messenger's approach is vastly different and is essentially the same experience as creating a


Upsides

— Fit for commerce

— Cards

— Long interactions

— Initiate / Push

— Customer Matching (phone #)

— Can use any language

— XMPP should be familiarConversational Commerce: Magento, Facebook and Alexa | October 2016 44

Downsides

— XMPP is limiting, requires persistence

— We emulate more human-like qualities via text so we have to fake interactions and pauses


Top 3 tips to creating engaging bot experiences1

1. Don't be dense

2. Have a vibe

3. Speak, don't print

1 GARY LEVITT, YOLA; VENTUREBEAT SEPTEMBER 2016


1. Don't be dense

Bad:

Me: help.

Bot: I can help by answering simple questions about how Chatbot works. I’m just a bot, though! If you need more help, try our Help Center for loads of useful information about Chatbot...```


1. Don't be dense

Better

Me: help.

Bot: Help is here, Gary!

Bot is typing…

Bot: Ask me a simple question.

Me: how to I blah blah blah?Conversational Commerce: Magento, Facebook and Alexa | October 2016 48

Don't be dense

1. Constructing a concise chronological narrative helps reduce denseness. When content is in little chunks, it’s easier to process.

2. When your chatbot provides the right forms and buttons at the right time, it can outperform its visual interface counterpart.

3. Combining concepts or distinct sets of details in one response causes mental static, and should be


2. Have a Vibe


Have a Vibe

1. Break up your communication into parts based on their functions: actions, greetings, goodbyes, thankyous, updates, loading, processing, intros, descriptions, notifications, etc.

2. Pick one or two parts and — while keeping all other parts neutral, concise, and direct — make that part a little zesty or animated.


3. Speak, don’t print

In short, emulate typing and build in pauses. You can split-test engagement based on pause time for a more data-centric approach.


Messenger Differentiators


Messenger Differentiators

The key differentiators for Messenger are:

— A robust interaction platform:

— Card types

— Media

— Video

— Interaction


Downsides

— No discernment of "intent" like in Alexa

— Developer left to parse intent from AI human language engine


Intent generation


Welcome screen


Rich cards


Prompt / Push


Push a message

Your package has shipped

curl -X POST -H "Content-Type: application/json" -d '{ "recipient":{ "id":"USER_ID" }, "message":{ "text":"hello, world!" }}' "https://graph.facebook.com/v2.6/me/messages?access_token=PAGE_ACCESS_TOKEN"


Q&AConversational Commerce: Magento, Facebook and Alexa | October 2016 61

Thank you!


conversational commerce and magento 2: breaking new ground with facebook, alexa, and slack

Technology