דף זה תורגם על ידי Cloud Translation API.

קנייה של איסוף באינטרנט בחנות: ארוחת בוקר – חלק 1 – תחילת העבודה

1. מבוא

תאריך עדכון אחרון: 11 במאי 2022

ברוכים הבאים ל-Business Messages!

סדנת הקוד הזו היא מבוא לשילוב עם Business Messages, שמאפשר ללקוחות ליצור קשר עם עסקים שאתם מנהלים דרך חיפוש Google ומפות Google. יכול להיות שאתם עסק שרוצים לשלב את Business Messages ישירות, או שאתם עובדים בחברת תוכנה עצמאית שמפתחת פתרונות לשירותי שליחת הודעות לעסקים שאתם עובדים איתם, או אולי פשוט נתקלת ב-Business Messages ואתם רוצים להתנסות בפלטפורמה.

לא משנה מה הביא אתכם לכאן, הקודלהב הזה הוא דרך מצוינת להתחיל. בסיום התהליך, תהיה לכם הנציג הדיגיטלי הראשון שאיתו המשתמשים יוכלו לקיים אינטראקציה. אחרי שתסיימו לשפר את העסק, תוכלו להשיק אותו ב-Business Messages ולהגיע למיליוני לקוחות.

מהם המאפיינים של סוכן דיגיטלי טוב?

Business Messages הוא פלטפורמה לשיחות שמספקת חוויה דומה לאפליקציה במכשירים ניידים, ומאפשרת לצרכנים ליצור קשר עם עסקים בלי להתקין אפליקציה נוספת. סוכן דיגיטלי הוא החלק של הלוגיקה שבו הלקוחות מקיימים אינטראקציה. הלוגיקה מנוהלת על ידי אפליקציית אינטרנט שנפרסת בענן או בתשתית שלכם. הבחירה בידיים שלכם לגבי התגובה למשתמש. הנציגים הטובים ביותר מספקים הקשר כדי להגדיר ציפיות, לשמור על התעניינות הלקוחות ולספק פונקציונליות שתומכת בצרכים של המשתמשים.

מה תפַתחו

בסדנת הקוד הזו תלמדו ליצור נציג דיגיטלי ב-Business Messages לחברה בדיונית בשם Bonjour Meal. הנציג הדיגיטלי הזה יענה על כמה שאלות פשוטות, כמו "מתי העסק נסגר?" או "האם אפשר לבצע רכישה אונליין?".

בקודלאב הזה, המשתמשים יוכלו לקנות פריטים דרך הסוכן הדיגיטלי, להפנות את המשתמש לחברת עיבוד תשלומים כדי לקבל כסף ולאחר מכן לתזמן איסוף של הפריטים הבדויים בחנות.

ב-codelab הזה, האפליקציה שלכם:

איך עונים על שאלות באמצעות צ'יפ הצעות
להנחות את המשתמש לשאול שאלות שהסוכן הדיגיטלי יכול לענות עליהן
לספק תכונות שיחה עשירות כדי לשמור על העניין של המשתמש בשיחה

מה תלמדו

איך פורסים אפליקציית אינטרנט ב-App Engine ב-Google Cloud Platform. לחלופין, אפשר להשתמש ב-ngrok כדי לבדוק את האפליקציה המקומית באופן ציבורי.
איך מגדירים חשבון Business Messages עם webhook לאפליקציית אינטרנט כדי לקבל הודעות ממשתמשים
איך שולחים תכונות מתקדמות כמו כרטיסים, קרוסלות והצעות לשיחות באמצעות Business Messages API
איך ההודעות נשלחות ב-Business Messages

בקודלאב הזה נסביר איך ליצור את הנציג הדיגיטלי הראשון שלכם.

מה צריך להכין

הרשמה לחשבון פיתוח בחינם ל-Business Communications
באתר למפתחים מפורטות הוראות להוספת מודעות
מכשיר Android מגרסה 5 ואילך או מכשיר iOS עם אפליקציית מפות Google
ניסיון בתכנות של אפליקציות אינטרנט
חיבור לאינטרנט.

2. תהליך ההגדרה

הפעלת ממשקי ה-API

בקודלאב הזה, מאחר שאנחנו עובדים עם אפליקציית Django, נשתמש ב-Cloud Build API כדי לפרוס את האפליקציה ב-App Engine. לחלופין, אם אתם משתמשים ב-ngrok, אין צורך להפעיל את Cloud Build API.

כדי להפעיל את Cloud Build API:

פותחים את Cloud Build API במסוף Google Cloud.
לוחצים על Enable.

יצירה של חשבון שירות

כדי לגשת ל-Business Communications ול-Business Messages API, צריך ליצור חשבון שירות. פועלים לפי השלבים שמפורטים בתיעוד ליצירת חשבון שירות במסוף הפיתוח של Business Communications.

פריסת קוד ההתחלה של Django Python EchoBot

בטרמינל, מעתיקים את Django Echo Bot Sample לספריית העבודה של הפרויקט באמצעות הפקודה הבאה:

$ git clone https://github.com/google-business-communications/bm-bonjour-meal-django-starter-code

מעתיקים את קובץ פרטי הכניסה בפורמט JSON שנוצר עבור חשבון השירות לתיקיית המשאבים של הדוגמה, ומשנה את שם פרטי הכניסה ל-'bm-agent-service-account-credentials.json'.

bm-bonjour-meal-django-starter-code/bonjourmeal-codelab/step-1/resources/bm-agent-service-account-credentials.json

בטרמינל, עוברים לספרייה step-1 של הדוגמה.

מריצים את הפקודות הבאות במסוף כדי לפרוס את הדוגמה:

$ gcloud config set project PROJECT_ID*
$ gcloud app create
$ gcloud app deploy

PROJECT_ID הוא מזהה הפרויקט שבו השתמשתם כדי להירשם לממשקי ה-API.

שימו לב לכתובת ה-URL של האפליקציה שנפרסה בפלט של הפקודה האחרונה:

Deployed service [default] to [https://PROJECT_ID.appspot.com]

קוד ההתחלה שפרסמתם מכיל אפליקציית אינטרנט עם webhook לקבלת הודעות מ-Business Messages. האפליקציה מחזירה את ההודעות למשתמש, ומאפשרת להציג חלק מהתכונות העשירות שזמינות בממשק השיחה.

הגדרת ה-webhook

עכשיו, אחרי שפרסמתם את השירות, תוכלו להשתמש בכתובת ה-URL של האפליקציה כדי להגדיר את כתובת ה-webhook בדף Account settings (הגדרות החשבון) ב-Business Communications Developer Console (מסוף הפיתוח של Business Communications).

כתובת ה-URL של ה-webhook תהיה כתובת ה-URL של האפליקציה + ‎"/callback/". לדוגמה, יכול להיות שהכתובת תהיה דומה לזו: https://PROJECT_ID.appspot.com/callback/

עוברים אל דף הגדרות החשבון במסוף Business Communications. שם הפרויקט ב-GCP אמור להופיע בפינה השמאלית העליונה, מתחת לסרגל הניווט. אם מופיע תפריט נפתח, חשוב לבחור את פרויקט GCP שלכם.

ממלאים את הפרטים של איש הקשר הטכני, ואז מעדכנים את Webhook בכתובת ה-URL של ה-webhook לאפליקציה שנפרסה.

לוחצים על Save לצד הפרויקט שלכם ב-GCP.

3. יצירת הנציג הראשון

שימוש במסוף הפיתוח של Business Communications

במסוף Business Communications, לוחצים על הלוגו בפינה הימנית העליונה כדי לחזור למרכז הבקרה של המסוף, ואז לוחצים על Create agent. יוצרים מותג באותו זמן שיוצרים את הנציג. בוחרים באפשרות הודעות לעסק בקטע סוג הנציג ומוודאים שפרטי השותף נכונים.

בקטע Brand (מותג), מקלידים את שם המותג שיוצרים.המותג הוא העסק שאיתו אתם עובדים, והצרכנים יכולים לנהל אינטראקציה עם הנציג בצורת שיחה. בשדה Agent name (שם הנציג), מציינים את השם שרוצים שהמשתמשים יראו בשיחה ב-Business Messages. במקרה של Bonjour Meal הדמיונית, Bonjour Rail היא חברת הרכבות שמנהלת את המסעדות של Bonjour Meal. לכן אסמן את Bonjour Rail בתור המותג ואת Bonjour Meal בתור הסוכנות.

הנציג הוא הישות בממשק השיחה שמייצגת את המותג.

לוחצים על Create agent ומאפשרים למסוף לעשות את הקסם שלו. הבקשה הזו נשלחת תוך כמה שניות, והיא כוללת כמה בקשות ל-Business Communications API ליצירת המותג והנציג. אפשר להשתמש ב-Business Communications API ישירות כדי ליצור סוכן ולייצר מותג. כדאי לעיין במסמכי התיעוד כדי לראות איך נראית בקשת curl שמבצעת את אותן הפעולות שמבצעת המסוף.

השיחה הראשונה

פותחים את הנציג שיצרתם זה עתה. יוצג לכם הדף סקירה כללית, שבו תוכלו להתחיל לבדוק את פרטי הנציג. כדאי לעיין בכתובות ה-URL לבדיקת הנציג. כתובות ה-URL האלה משמשות להפעלת משטח השיחה במכשיר.

כדי להעתיק את כתובת ה-URL לבדיקה, לוחצים על אחד מהצ'יפים. כמובן, צריך להעתיק את כתובת ה-URL לבדיקה למכשיר שרוצים לבדוק. שולחים את ההודעה המועתקת למכשיר בכל דרך שרוצים.

אחרי שמגיעים למכשיר הנייד, מקישים על הקישור כדי להפעיל את מרכז האפליקציות של נציגי התמיכה ב-Business Messages, כאשר כתובת ה-URL לבדיקה של נציג התמיכה מוגדרת מראש.

מקישים על הפעלה כדי להפעיל את ממשק השיחה של הנציג.

אפשר לבצע פעולות עם הסוכן ולקבל תחושה לגבי היכולות שלו. ברוב המקרים, תוכלו לראות רק את ההודעות שלכם בממשק השיחה. שולחים הודעה כמו "שלום, עולם!", והנציג ישלח לכם בחזרה את אותה ההודעה.

האפליקציה שנפרסה מכילה גם לוגיקה מסוימת שמציגה את התכונות העשירות הזמינות ב-Business Messages.

אם שולחים את הפקודה 'card', מופיע כרטיס מתקדם.
אם שולחים 'צ'יפים', מפעילים הצעות קשורות
אם שולחים את הערך 'carousel', מופיעה קרוסלה של כרטיסים מתקדמים.

מעולה! זו השיחה הראשונה של הנציג, איתך!

אפשר להשתמש בכל אחת מהתכונות העשירות כדי לספק הקשר טוב יותר לאדם שמדבר עם הנציג שלכם. אתם יכולים לשלוח נכסים גרפיים בכרטיסים עשירים כדי להעביר רעיונות בצורה טובה יותר, או להשתמש בצ'יפים של הצעות כדי להנחות את השיחה.

עדכון הודעת הפתיחה ושימוש בצ'יפים של שיחות

נתרגל קצת את השימוש במסוף הפיתוח, נראה איך לערוך את הודעת הפתיחה של הנציג ונלמד איך להשתמש בצ'יפים של הצעות כדי לעזור למשתמש לתקשר.

עוברים לדף Overview של הסוכן ובוחרים באפשרות Agent information. גוללים למטה לקטע של הודעת הפתיחה ונושאי השיחה.

מעדכנים את הודעת הפתיחה (השדה הצהוב להזנת קלט) כך שתופיע:

ברוך בואך לסוכן ההפעלה של Bonjour Meal. אוכל להחזיר את ההודעות שלך ולהראות לך כמה מהתכונות העשירות שנתמכות בפלטפורמה. כדאי לנסות את ההצעות האלה!

לוחצים על + הוספת נושא לשיחה, כפי שמופיע בתיבה הסגולה בתמונה שלמעלה, כדי להוסיף נושאים לשיחה שיפעילו את הצ'יפים, הקרוסלה והכרטיס של ההצעות. כדי להוסיף התחלות שיחה, צריך רכיב טקסט ורכיב postbackData. הטקסט הוא מה שמוצג למשתמש, ואילו נתוני ה-postback הם מה שנשלחים ל-webhook של הנציג. ה-webhook ינתח את נתוני ההודעה החוזרת וישלח את התגובה המתאימה למשתמש.

פרטי הנציג במסוף ייראו כך אחרי השינוי:

בצד שמאל של המסוף תוצג תצוגה מקדימה של הסוכן. שימו לב שהודעת הפתיחה משקפת את מה ששיניתם אותה אליו, ואת הצ'יפים של ההצעות שמתחתיה.

זהו כלי מצוין שיעזור לכם להבין איך חוויית המשתמש תהיה. אפשר להשתמש בו בזמן יצירת הנציג ותכנון תהליכי השימוש של המשתמשים שרוצים לתמוך בהם.

לצערנו, השינויים האלה לא ישתקפו בשיחה באופן מיידי, כי הנתונים הקודמים מאוחסנים במטמון בתשתית של Business Messages. המטמון נמחק בערך כל שעתיים, כך שאפשר יהיה לנסות את זה מחר.

בינתיים, נראה איך הכול עובד מאחורי הקלעים.

4. ניתוח הקוד לתחילת הדרך

תצוגה רחבה ממבט על של קוד המקור

קוד ההתחלה שפרסמתם יחזיר למשתמשים את ההודעות, ויכול להציג כרטיס עשיר, קרוסלה או צ'יפים של הצעות. נתעמק בקוד המקור כדי להבין איך זה עובד. לאחר מכן נבין מה צריך לשנות.

קוד ההתחלה הוא פרויקט Django. בהמשך הסדרה הזו של Codelab, נשתמש ב-Google Datastore כדי לשמור נתונים כמו עגלות קניות ושיחות משויכות. אם זו הפעם הראשונה שאתם משתמשים ב-Django, אל דאגה. המערכת פשוטה למדי, ועד סוף הקודלאב הזה תלמדו איך היא פועלת.

באופן כללי, Django יפנה כתובות URL לתצוגות, והלוגיקה של התצוגה תיצור תבנית שתתבצע לה עיבוד בדפדפן. נעיף מבט ב-urls.py של הפרויקט.

bm-django-echo-bot/bmcodelab/urls.py [שורות 31-37]

from django.urls import include, path
import bopis.views as bopis_views

urlpatterns = [
    path('', bopis_views.landing_placeholder),
    path('callback/', bopis_views.callback),
]

כאן מוגדרים שני מסלולים, כך ש-Django יכול להריץ לוגיקה אם שתי כתובות ה-URL האלה מזוהות. אם כתובת ה-URL של הפרויקט היא https://PROJECT_ID.appspot.com/‎, הנתיבים שהפרויקט מודע אליהם הם:

https://PROJECT_ID.appspot.com/
https://PROJECT_ID.appspot.com/callback/

שני הנתיבים של כתובות ה-URL מפנים אל bopis_views שמגיע מ-bopis/views.py. בואו נראה מה קורה בקובץ הזה. כדי להתחיל, נבין קודם מהו bopis_views.landing_placeholder.

bm-django-echo-bot/bonjourmeal-codelab/step-1/bopis/views.py [שורות 302-309]

... 
def landing_placeholder(request):
    return HttpResponse("<h1>Welcome to the Bonjour Meal Codelab</h1>
    <br/><br/>
    To message your Bonjour Meal agent, go to the Developer Console and retrieve
    the Test URLs for the agent you have created as described in the codelab
    <a href='https://codelabs.developers.google.com/codelabs/'>here</a>.")
...

קטע הלוגיקה הזה מופעל על ידי שרת האינטרנט כשמקבל בקשת אינטרנט שמצביעה על שורש הפרויקט. לא קורה כאן שום דבר מיוחד: אנחנו פשוט מחזירים ל-HTTPResponse שמכיל קצת HTML לדפדפן ששלח את הבקשה. אז כן, אפשר לפתוח את כתובת ה-URL ברמה הבסיסית של הפרויקט, אבל אין שם הרבה מה לעשות כי היא מחזירה אתכם לקודלאב הזה.

כתובת ה-URL השנייה מפנה לפונקציה שנקראת callback, גם היא ב-bopis/views.py. בואו נסתכל על הפונקציה הזו.

bm-django-echo-bot/bopis/views.py [Lines 60-101]

...
def callback(request):
    """
    Callback URL. Processes messages sent from user.
    """
    if request.method == "POST":
        request_data = request.body.decode('utf8').replace("'", '"')
        request_body = json.loads(request_data)

        print('request_body: %s', request_body)

        # Extract the conversation id and message text
        conversation_id = request_body.get('conversationId')
        print('conversation_id: %s', conversation_id)

        # Check that the message and text body exist

        if 'message' in request_body and 'text' in request_body['message']:
            message = request_body['message']['text']

            print('message: %s', message)
            route_message(message, conversation_id)
        elif 'suggestionResponse' in request_body:
            message = request_body['suggestionResponse']['postbackData']

            print('message: %s', message)
            route_message(message, conversation_id)
        elif 'userStatus' in request_body:
            if 'isTyping' in request_body['userStatus']:
                print('User is typing')
            elif 'requestedLiveAgent' in request_body['userStatus']:
                print('User requested transfer to live agent')

        return HttpResponse("Response.")

    elif request.method == "GET":
        return HttpResponse("This webhook expects a POST request.")
...

הלוגיקה כאן מנתחת את גוף הבקשה כדי למצוא message או suggestionResponse ומעבירה את המידע הזה לפונקציה שנקראת route_message. לאחר מכן, היא מחזירה HttpResponse חזרה לתשתית של Business Messages כדי לאשר את קבלת ההודעה.

זו פונקציה חשובה. קטע הלוגיקה הזה הוא ה-webhook של אפליקציית האינטרנט, שמקבל הודעות ממשתמשים שמקיימים אינטראקציה עם הנציג שלכם. אפשר להרחיב את ה-webhook כדי לשלוח הודעות לכלי אוטומציה כמו Dialogflow, כדי להבין מה המשתמש עשוי לומר וליצור תגובה על סמך ההסקה הזו. אפשר גם להעביר את ההודעה כדי שהמשתמש יוכל לדבר עם נציג תמיכה אנושי. תרשים להמחשה:

מערכת Business Messages שולחת את תוכן ההודעה כמטען שימושי (payload) בפורמט JSON אל ה-webhook שלכם, שם הוא מנותב לנציג תמיכה אנושי או ללוגיקת תגובה כלשהי כבוטים. מנגנון הניתוב הזה, במקרה שלנו, הוא route_message. בואו נראה.

bm-django-echo-bot/bopis/views.py [Lines 105-122]

...
def route_message(message, conversation_id):
    '''
    Routes the message received from the user to create a response.

    Args:
        message (str): The message text received from the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    normalized_message = message.lower()

    if normalized_message == CMD_RICH_CARD:
        send_rich_card(conversation_id)
    elif normalized_message == CMD_CAROUSEL_CARD:
        send_carousel(conversation_id)
    elif normalized_message == CMD_SUGGESTIONS:
        send_message_with_suggestions(conversation_id)
    else:
        echo_message(message, conversation_id)
...

קטע הלוגיקה הזה מתחיל לבדוק את ההודעה שהמשתמש קיבל. קודם כול, ההודעה מתאמת על ידי הפחתת כל התווים. לאחר הנורמליזציה, המערכת בודקת אם ההודעה היא אחת מהקבועות שהוגדרו בחלק העליון של הקובץ.

bm-django-echo-bot/bopis/views.py [Lines 40-42]

...
# Set of commands the bot understands
CMD_RICH_CARD = 'card'
CMD_CAROUSEL_CARD = 'carousel'
CMD_SUGGESTIONS = 'chips'
...

כלומר, הבוט מנתח הודעות שמכילות באופן ספציפי אחת מהמחרוזות שהכנסנו ל-postback_data של התחלות השיחה מהשלב הקודם בקודלאב הזה. אם אף אחת מהמחרוזות האלה לא מופיעה, ההודעה מועברת לפונקציה שנקראת echo_message, שאפשר להניח שהיא תחזיר את ההודעות.

שליחת הודעות

עכשיו כבר אמורה להיות לכם מושג איך הודעות מתקבלות באפליקציית האינטרנט. הכול מתבצע על ידי ה-webhook.

אבל איך האפליקציה שולחת הודעה יוצאת למשתמש באמצעות Business Messages?

כשתשובה מהתשתית שלכם נשלחת למשתמש, אתם שולחים את התשובה ל-Business Messages API, שמעביר את ההודעה למשתמש.

ל-Business Messages API יש ספריות ב-Python, ב-Node.js וב-Java. יש לנו גם API ל-REST שאפשר לשלוח אליו בקשות ישירות אם התשתית שלכם לא בשפה שיש לנו ספרייה בשבילה. במאמר שליחת הודעות מוסבר איך משתמשים ב-cURL כדי לשלוח הודעה למזהה שיחה ספציפי.

במסגרת הקודלאב הזה, נתמקד בשימוש בספריית הלקוח של Python שכבר משולבת בקוד ההתחלה של Bonjour Meal, שפרוס ב-App Engine בפרויקט שלכם ב-GCP או פועל באופן מקומי דרך ngrok.

נבחן את הפונקציה echo_message ונראה איך אנחנו יוצרים אינטראקציה עם ה-API כדי לשלוח את ההודעה ל-Business Messages.

bm-django-echo-bot/bopis/views.py [שורות 199-212]

...
def echo_message(message, conversation_id):
    '''
    Sends the message received from the user back to the user.

    Args:
        message (str): The message text received from the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        text=message)

    send_message(message_obj, conversation_id)
...

בפונקציה הזו, נוצר אובייקט BusinessMessagesMessage באמצעות משתנה ההודעה שמוענק לפונקציה echo_message. לאחר היצירה, האובייקט מועבר אל send_message יחד עם מזהה השיחה.

bm-django-echo-bot/bopis/views.py [שורות 214-236]

...
def send_message(message, conversation_id):
    '''
    Posts a message to the Business Messages API, first sending
    a typing indicator event and sending a stop typing event after
    the message has been sent.

    Args:
        message (obj): The message object payload to send to the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    credentials = ServiceAccountCredentials.from_json_keyfile_name(
        SERVICE_ACCOUNT_LOCATION,
        scopes=['https://www.googleapis.com/auth/businessmessages'])

    client = bm_client.BusinessmessagesV1(credentials=credentials)

    # Create the message request
    create_request = BusinessmessagesConversationsMessagesCreateRequest(
        businessMessagesMessage=message,
        parent='conversations/' + conversation_id)

    bm_client.BusinessmessagesV1.ConversationsMessagesService(
        client=client).Create(request=create_request)
...

כל מה שפונקציית send_message עושה הוא להשתמש בפרטי הכניסה של חשבון השירות כדי לאמת שאתם יכולים לשלוח הודעות לשיחת הצ'אט הזו, ליצור מופע של לקוח Business Messages וליצור בקשה לשליחת ההודעה ל-conversation ID הנתון.

התכונות המתקדמות משתמשות גם בפונקציה send_message הזו, אבל ההודעות שהן יוצרות הן ספציפיות לכרטיסים מתקדמים, לקרוסלות ולצ'יפים של הצעות. כרטיסים עשירים וקרוסלות יכולים לכלול נכסים גרפיים, ואילו צ'יפים של הצעות כוללים את הערך postback_data כדי שהלוגיקה של קריאה חוזרת (callback) תוכל לנתח אותם בצורה הולמת.

אחרי שראינו איך שולחים הודעה, נראה איך הדוגמה שולחת כרטיסים מתקדמים, קרוסלות ושבבי הצעות. בקטע הבא נשנה את קוד המקור כדי לשלוח הודעות עם חלק מהתכונות העשירות האלה.

כשתהיו מוכנים, נוכל להתאים אישית את הסוכן של Bonjour Meal.

5. התאמה אישית של הנציג

אם פעלתם לפי ההוראות ב-codelab עד עכשיו, אנחנו אמורים לראות את הנציגה היפה שלנו.

אוקיי, הוא לא כל כך יפה, הוא נראה די חשוף ולא מייצג את העסק שלנו בצורה טובה. למזלנו, יש לנו ידע בסיסי בקוד שתומך בסוכנות, ויש לנו את הכלים הדרושים כדי להתאים אישית את הסוכנות בכל דרך שאנחנו רוצים.

בשארית הקודלאב הזה, נרחיב את הנציג עם התכונות הבאות:

הוספת לוגו בפועל
הודעת פתיחה משופרת
לספק מידע על שעות הפעילות
ליידע את המשתמש שקניית פריטים באינטרנט תהיה זמינה בקרוב
שימוש בצ'יפים של הצעות לשיחה כדי להקל על השיחה

נשתמש במסוף Business Communications כדי לעדכן את הלוגו ואת הודעת הפתיחה, אבל תמיד אפשר להשתמש ישירות ב-Business Communications APIs כדי לעשות את זה. לאחר מכן נצטרך לעדכן את קוד המקור כדי לשלוח הודעות מתאימות עם מידע על שעות הפעילות, וגם הודעה על כך שבקרוב תהיה ב-Bonjour Meal אפשרות לקניות אונליין. בסיום, נשוב למסוף התקשורת העסקית ונתכנן צ'יפים של הצעות לשימוש בשיחות, שיעזרו להנחות את השיחה לחוויות הרצויות שהסוכן הדיגיטלי תומך בהן.

הוספת לוגו

במסוף Business Communications, בוחרים את הנציג ומנווטים אל פרטי הנציג. נצטרך לעדכן את הלוגו של העסק, כפי שמתואר בצהוב בהמשך.

לוחצים על העלאה ובוחרים תמונה להעלאה או לייבא מכתובת URL.

כדאי לעיין בהנחיות בנושא עיצוב סמלי לוגו במסמכי התיעוד כדי לקבל מידע על השיטות המומלצות לשימוש בסמלי לוגו משלכם.

נעלאה את הלוגו שנמצא בקוד המקור ששכפלתם בתחילת סדנת הקוד הזו. הוא נמצא בספרייה ‎ ./assets/ במאגר, והשם שלו הוא ‎bonjour_meal-logo.png. אפשר לגרור את הקובץ לחלון הדו-שיח בדפדפן האינטרנט. יוצג כלי עריכה קל לשימוש, שבעזרתו תוכלו לשנות את איכות התמונה ולחתוך אותה. משנים את רזולוציית התמונה ואת החיתוך שלה כך שהתמונה תהיה קטנה מ-50KB או שווה לה. כשמרוצים מהתמונה, לוחצים על סימן הווי בעיגול הכחול כדי לאשר ולוחצים על בחירה בחלק התחתון של חלון הדו-שיח.

בסיום, לוחצים על שמירה בפינה השמאלית העליונה של הדף פרטי הסוכן. ייתכן שיחלוף זמן מה עד שהשינוי יבוא לידי ביטוי במכשיר שלכם, כי פרטי הסוכן מאוחסנים במטמון בשרתים שלנו, והם אמורים להיות גלויים תוך שעתיים ממועד השינוי.

עדכון הודעת הפתיחה

כבר ביצענו עדכון של הודעת הפתיחה מוקדם יותר בקודלאב הזה. נבצע את הפעולה הזו שוב, אבל הפעם נגדיר הודעת פתיחה שתתאים יותר לתהליך השימוש של משתמשי Bonjour Meal.

במסוף Business Communications, בוחרים את הנציג ועוברים אל פרטי הנציג. גוללים למטה עד שרואים את שדה הקלט הודעת הפתיחה, שבו אפשר לעדכן את ההודעה.

אנחנו יודעים שנוסיף נושאים להתחלת שיחה, ולכן נוכל להפנות אליהם בהודעת הפתיחה. בשדה הקלט, מחליפים אותו בטקסט הבא:

"Welcome to Bonjour Meal. אני עוזרת דיגיטלית שיכולה לענות על שאלות שיש לך לגבי Bonjour Meal. אפשר לנסות כמה מהאפשרויות הבאות".

בסיום, לוחצים על שמירה בפינה השמאלית העליונה של הדף פרטי הסוכן. שוב, ייתכן שיחלוף זמן מה עד שהשינוי הזה ישתקף במערכת בגלל מנגנון האחסון במטמון שלנו, שנועד להבטיח שהדברים יהיו מהירים.

הצגת מידע על שעות הפעילות

כדי לספק את המידע הזה למשתמשים, נשלח להם הודעה מותאמת אישית באמצעות Business Messages API.

זכור לכם שההודעות מנותחות בפונקציה route_message של views.py? הפונקציה מנרמלת קודם את המחרוזת ואז מתחילה לבדוק אם ההודעה המנורמלת תואמת לאחד מהפרמטרים שמוגדרים בקוד. כדי לפשט את העניין, נוסיף תנאי נוסף שבו נבדוק אם ההודעה המנורמלית שווה לקבועה חדשה שנקרא CMD_BUSINESS_HOURS_INQUIRY ותכיל את הערך 'business-hours-inquiry'. אם התנאי יהיה נכון, נפעיל פונקציה בשם send_message_with_business_hours.

הפונקציה route_message תיראה עכשיו כך:

bm-django-echo-bot/bopis/views.py

...
def route_message(message, conversation_id):
    '''
    Routes the message received from the user to create a response.

    Args:
        message (str): The message text received from the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    normalized_message = message.lower()

    if normalized_message == CMD_RICH_CARD:
        send_rich_card(conversation_id)
    elif normalized_message == CMD_CAROUSEL_CARD:
        send_carousel(conversation_id)
    elif normalized_message == CMD_SUGGESTIONS:
        send_message_with_suggestions(conversation_id)
    elif normalized_message == CMD_BUSINESS_HOURS_INQUIRY:
        send_message_with_business_hours(conversation_id)
    else:
        echo_message(message, conversation_id)
...

כדי שהקוד יפעל, נצטרך לבצע עוד שני שינויים: הראשון הוא להגדיר את CMD_BUSINESS_HOURS_INQUIRY יחד עם הקבועים האחרים, והשני הוא להגדיר בפועל את הפונקציה send_message_with_business_hours ולשלוח הודעה באמצעות Business Messages API.

קודם כול, נגדיר את הקבוע בחלק העליון של הקובץ עם הצהרות הקבועים האחרות:

bm-django-echo-bot/bopis/views.py

...
# Set of commands the bot understands
CMD_RICH_CARD = 'card'
CMD_CAROUSEL_CARD = 'carousel'
CMD_SUGGESTIONS = 'chips'
CMD_BUSINESS_HOURS_INQUIRY = 'business-hours-inquiry'
...

עכשיו, מגדירים את send_message_with_business_hours. אפשר להגדיר את הפונקציה הזו בכל מקום בקובץ, בהתאם לתחביר המתאים של Python. מכיוון שהפונקציה הזו שולחת פשוט הודעה, בדומה לפונקציה echo_message, אפשר להשתמש בה כתבנית כדי להגדיר את הפונקציה הזו.

bm-django-echo-bot/bopis/views.py

...
def send_message_with_business_hours(conversation_id):

    message = '''Thanks for contacting us! The hours for the store are:\n
    MON 8am - 8pm\n
    TUE 8am - 8pm\n
    WED 8am - 8pm\n
    THU 8am - 8pm\n
    FRI 8am - 8pm\n
    SAT 8am - 8pm\n
    SUN 8am - 8pm
    '''

    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        text=message)

    send_message(message_obj, conversation_id)
...

לאחר מכן, הבוט שלנו אמור להגיב למשתמש עם שעות הפעילות האלה כשהוא ישלח את ההודעה הבאה: 'business-hours-inquiry'. זה מה שצפוי לקרות:

אחרי הפריסה של קוד המקור ב-GCP, השינויים יופיעו באופן מיידי. אנחנו לא שומרים את אפליקציית האינטרנט ב-Google Cloud Platform באותו אופן שבו אנחנו שומרים את פרטי הסוכנים, כך שתוכלו לבדוק את החוויה הזו באופן מיידי.

אנחנו ממשיכים לבצע שינויים במקור, אז נבצע שינוי נוסף שיאפשר למשתמש לשלוח פנייה לגבי קניות באינטרנט. הנציג הדיגיטלי יגיב ויגיד שהתכונה עדיין לא זמינה, אבל אפשר לחזור ולבדוק מאוחר יותר.

הודעה למשתמש על כך שאפשר יהיה בקרוב לקנות באינטרנט

נעשה שינוי דומה לזה שעשינו כדי ליידע את המשתמש על שעות הפעילות. הפעם נציג את המידע בכרטיס עשיר עם תמונה מעניינת.

לנתח את ההודעה המנורמלית ולבדוק תנאי לקבוע אם הקבוע CMD_ONLINE_SHOPPING_INQUIRY מוגדר לערך 'online-shopping-inquiry'. אם התנאי מתקיים, המערכת מפעילה את send_online_shopping_info_message.

bm-django-echo-bot/bopis/views.py

...
# Set of commands the bot understands
CMD_RICH_CARD = 'card'
CMD_CAROUSEL_CARD = 'carousel'
CMD_SUGGESTIONS = 'chips'
CMD_BUSINESS_HOURS_INQUIRY = 'business-hours-inquiry'
CMD_ONLINE_SHOPPING_INQUIRY = 'online-shopping-inquiry'
...
...
...
def route_message(message, conversation_id):
    '''
    Routes the message received from the user to create a response.

    Args:
        message (str): The message text received from the user.
        conversation_id (str): The unique id for this user and agent.
    '''
    normalized_message = message.lower()

    if normalized_message == CMD_RICH_CARD:
        send_rich_card(conversation_id)
    elif normalized_message == CMD_CAROUSEL_CARD:
        send_carousel(conversation_id)
    elif normalized_message == CMD_SUGGESTIONS:
        send_message_with_suggestions(conversation_id)
    elif normalized_message == CMD_BUSINESS_HOURS_INQUIRY:
        send_message_with_business_hours(conversation_id)
    elif normalized_message == CMD_ONLINE_SHOPPING_INQUIRY:
        send_online_shopping_info_message(conversation_id)
    else:
        echo_message(message, conversation_id)
...

עכשיו מגדירים את send_online_shopping_info_message. אנחנו רוצים שההודעה הזו תישלח ככרטיס עשיר עם תמונה, לכן נעתיק את הפונקציה send_rich_card כדי להשתמש בה כתבנית להגדרת send_online_shopping_info_message.

קודם צריך לעדכן את הטקסט החלופי כך שיכיל הודעה מתאימה. הטקסט החלופי משמש אם המכשיר לא יכול לקבל כרטיס עשיר מסיבה כלשהי. בשלב הבא, צריך לעדכן את BusinessMessagesRichCard כך שיכלול כותרת, תיאור, הצעות ושדה מדיה רלוונטיים. הפונקציה שלנו אמורה להיראות כך:

bm-django-echo-bot/bopis/views.py

...
def send_online_shopping_info_message(conversation_id):
    fallback_text = ('Online shopping will be available soon!')

    rich_card = BusinessMessagesRichCard(
        standaloneCard=BusinessMessagesStandaloneCard(
            cardContent=BusinessMessagesCardContent(
                title='Online shopping info!',
                description='Thanks for your business, we are located in SF near the Golden Gate Bridge. Online shopping is not yet available, please check back with us in a few days.',
                suggestions=[],
                media=BusinessMessagesMedia(
                    height=BusinessMessagesMedia.HeightValueValuesEnum.MEDIUM,
                    contentInfo=BusinessMessagesContentInfo(
                        fileUrl=SAMPLE_IMAGES[4],
                        forceRefresh=False
                    ))
                )))

    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        richCard=rich_card,
        fallback=fallback_text)

    send_message(message_obj, conversation_id)
...

נהדר! הנציג הדיגיטלי שלנו יכול עכשיו לענות למשתמשים שמתעניינים בקניות אונליין. בשלב זה, הנציג הדיגיטלי שלנו עדיין לא תומך בקניות אונליין, ולכן אנחנו שולחים למשתמש הודעה על כך שהתכונה תהיה זמינה בקרוב. כך נראה הנציג הדיגיטלי שלנו כשהמשתמש שואל על קניות אונליין.

בדומה לשינוי הקודם שביצענו כדי לאפשר למשתמש לברר על שעות הפעילות, אפשר לראות את השינוי הזה באופן מיידי אם משתמשים ב-ngrok, או מיד אחרי שפורסים את הקוד ב-GCP App Engine.

בקטע הבא נשתמש בהתחלות שיחה ובצ'יפים של הצעות כדי להנחות את השיחה לנתיב הרצוי.

שימוש בצ'יפים כדי להנחות את השיחה

ביצענו כמה שינויים בקוד המקור ופרוסנו את הנציג הדיגיטלי המעודכן, אבל אף פעם לא נצפה ממשתמשים להקליד "שעות-פעילות-בירור" או "מידע-על-שופינג-אונליין" כדי לברר פרטים על העסק. נעדכן את הנושאים להתחלת שיחה כך שכשהשיחה נפתחת, המשתמש לא רק מקבל הודעת פתיחה נעימה, אלא גם מוצגים לו נושאים להתחלת שיחה.

עוברים אל מסוף Business Communications ונכנסים לדף פרטי הנציג של הנציג. בעבר הגדרנו נושאי שיחה ל'צ'יפים', ל'כרטיס' ול'קרוסלה'. הם עדיין פועלים, אבל הם כבר לא רלוונטיים לפעילות העסקית שלנו. אתם יכולים להשאיר אותם כדי להמשיך להציג את התכונות העשירות האלה, או להסיר אותם כדי שהסוכן הדיגיטלי יציג נושאי שיחה ספציפיים לעסק Bonjour Meal.

אנחנו ניצור שני משפטי פתיחה חדשים. בשדה הראשון, מגדירים את הטקסט כ'מהן שעות הפעילות של העסק?' ומגדירים את נתוני ההודעה החוזרת כ'business-hours-inquiry'. להתחלה השנייה של השיחה, מגדירים את הטקסט כ'אפשר לבצע כאן רכישות?' ומגדירים את נתוני הדיווח החוזר על המרה (Postback) כ'online-shopping-info'.

התוצאה אמורה להיות ההגדרה שמופיעה בצילום המסך הבא:

כמו שינויים אחרים שמתבצעים במסוף התקשורת העסקית, תהליך ההפצה של השינויים עשוי להימשך זמן מה עד שתראו אותם בנייד.

עכשיו, אחרי שסיימנו עם התחלות השיחה, נצטרך גם למצוא דרך להנחות את המשתמש לנתיב רצוי אחרי שהשיחה תתחיל. אפשר להשתמש בצ'יפים לפי הקשר אחרי שליחת הודעה כדי להנחות את המשתמש לתכונות אחרות שהסוכן הדיגיטלי מסוגל לבצע. לכן, בכל פעם שמשתמש יבקש מידע על שעות הפעילות או על קניות אונליין, נשלח הודעה עם הצעה לבצע פעולה אחרת עם הנציג.

בסוף הפונקציה, מוסיפים את הקוד הבא:

bm-django-echo-bot/bopis/views.py

...
def send_online_shopping_info_message(conversation_id):
...
    # at the end of the function, send a message with suggestions
    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        text='Let us know how else we can help you:',
        fallback='Please let us know how else we can help you.',
        suggestions=[
            BusinessMessagesSuggestion(
                reply=BusinessMessagesSuggestedReply(
                text='Business hours',
                postbackData='business-hours-inquiry')
            ),
        ])

    send_message(message_obj, conversation_id)
...

# Let's do the same with the business hours
def send_message_with_business_hours(conversation_id):
...
    # at the end of the function, send a message with suggestions
    message_obj = BusinessMessagesMessage(
        messageId=str(uuid.uuid4().int),
        representative=BOT_REPRESENTATIVE,
        text='Let us know how else we can help you:',
        fallback='Please let us know how else we can help you.',
        suggestions=[
            BusinessMessagesSuggestion(
                reply=BusinessMessagesSuggestedReply(
                text='Can I purchase online?',
                postbackData='online-shopping-inquiry')
            ),
        ])

    send_message(message_obj, conversation_id)
...

חשוב לזכור ששדה הטקסט ב-BusinessMessagesSuggestion מוגבל ל-25 תווים, כפי שמתואר בתיעוד.

הנה כמה צילומי מסך של חוויית המשתמש הצפויה, עם שאלות נפוצות מעודכנות ושימוש אסטרטגי בצ'יפים של הצעות.

6. מזל טוב

מזל טוב, סיימת ליצור את הנציג הדיגיטלי הראשון שלך ב-Business Messages.

פרסתם אפליקציית אינטרנט כדי לתמוך בנציג הדיגיטלי ב-Business Messages, השתמשתם במסוף התקשורת העסקית כדי לשנות את הנציג ועיצבתם את חוויית המשתמש עם נציג דיגיטלי על ידי ביצוע שינויים בקוד המקור.

עכשיו אתם יודעים מהם השלבים העיקריים הנדרשים כדי ליצור חוויית שימוש אינטראקטיבית ב-Business Messages, והאפשרויות ממשיכות להתרחב. אפשר להרחיב את הסוכן כך שיתמוך בחיפוש מלאי או להוסיף עגלת קניות כדי לעקוב אחרי הפריטים שהמשתמש עשוי להתעניין בהם. אפשר להשתמש בקרוסלה כדי להציג את הפריטים בתפריט, ולהשתמש בהצעות כדי לאפשר למשתמש לבחור פריטים שמעניינים אותו.

הנה טיזר של מה שיכול לקרות.

איך יוצרים חוויית שיחה מעולה?

הנציגים הטובים ביותר מספקים למשתמש מידע לפי הקשר, ומאפשרים לו לבצע פעולות במהלך השיחה כדי שהוא יוכל להתעניין בעסק ולנהל איתו אינטראקציה כמו שהוא היה עושה בטלפון או אפילו פנים אל פנים. כדאי לחשוב איך הנושאים הבאים יכולים להתאים לשיחה שאתם רוצים לנהל עם עסק שאתם עובדים איתו.

מתן הקשר והגדרת ציפיות

הוספת הקשר יכולה להיות כל דבר, החל מהצהרה מפורשת על האופן שבו אתם יכולים לעזור למשתמש ועד להצגת הנציג הדיגיטלי עם פרופיל משתמש שהמשתמש יכול להזדהות איתו. נציגי תמיכה מצליחים ב-Business Messages משתמשים בתמונת הפרופיל כדי להראות למשתמש עם מי הוא מדבר.

הגדרת הציפיות תלויה בחוויית המשתמש שאתם יוצרים. לדוגמה, אם הנציג תומך בחיפוש מלאי, כדאי להודיע למשתמש לפני מתן התשובה שהמלאי עשוי להיות נמוך.

מתן פונקציונליות למשתמש

הצרכנים יוצרים קשר עם עסקים כל הזמן. שירות Business Messages יכול לתמוך באינטראקציות מורכבות של משתמשים, החל מבדיקת סטטוס ההזמנה ועד לבדיקת זמינות הפריט. משתמשים רבים ממשיכים להתקשר לעסקים בטלפון כדי לקבל תשובות לשאלות שלהם, גם אם התשובות זמינות באתר של העסק. כתוצאה מכך, העסקים צריכים להשקיע יותר משאבים כדי לטפל בנפח השיחות, במיוחד בתקופת החגים.

שמירה על עניין המשתמש

כדאי לספק נקודות מגע שיחה כדי לשמור על העניין של המשתמש בשיחה. בין הודעות, אתם יכולים להשתמש בסמנים של הקלדה כדי להודיע למשתמש שאתם כותבים תשובה.

בעזרת תכונות מתקדמות כמו אינדיקטורים להקלדה, צ'יפים של הצעות, כרטיסים מתקדמים וקרוסלות, אתם יכולים להנחות את המשתמש דרך חוויית משתמש רצוי כדי לעזור לו להשלים משימות מסוימות, כמו הזמנה מתפריט פריטים. המטרה היא להפחית את נפח השיחות לקו הטלפון של העסק.

חשוב מאוד שהשיחה תספק פונקציונליות למשתמש. משתמשים שיוצרים קשר עם עסק באמצעות הודעות מצפים לקבל תשובות לשאלות שלהם במהירות. במצב לא אידיאלי, הנציג הדיגיטלי לא יכול לקדם את השיחה, מה שעלול להוביל לחוויית משתמש גרועה. למרבה המזל, יש דרכים לעקוף את הבעיה הזו, כמו העברת השיחה לנציג תמיכה אנושי. נרחיב על כך בסדנת קוד שתתקיים בעתיד.

מה השלב הבא?

כשתהיו מוכנים, תוכלו לעיין בחלק מהנושאים הבאים כדי ללמוד על אינטראקציות מורכבות יותר שאפשר לבצע ב-Business Messages.

מסמכי עזרה

SuggestedReply
מסמך עזר בנושא הודעות ב-Business Messages
הגדרת JSON ל-RichCard