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

1. מבוא

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

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

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

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

מה הופך סוכן דיגיטלי לטוב?

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

מה תפַתחו

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

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

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

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

מה תלמדו

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

ה-Codelab הזה מתמקד ביצירת סוכן דיגיטלי ראשון.

מה תצטרכו

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

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

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

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

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

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

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

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

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

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

$ 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 של האפליקציה כדי להגדיר את כתובת ה-URL של ה-webhook בדף Account settings ב-Business Communications Developer Console.

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

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

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

לוחצים על שמירה לצד ההפניה לפרויקט GCP.

3. יצירת הסוכן הראשון

שימוש ב-Business Communications Developer Console

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

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

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

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

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

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

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

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

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

כדאי לנסות לתקשר עם הסוכן כדי להבין מה הוא יכול לעשות. ברוב המקרים, תגלו שממשק הצ'אט רק ישקף את ההודעות שלכם. אם תשלחו לו הודעה כמו "Hello, World!‎", תראו שהסוכן ישלח לכם את אותה הודעה בחזרה.

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

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

מעולה! זו השיחה הראשונה של הסוכן שלך, איתך!

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

ברמת העל, 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 [Lines 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>.")
...

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

כתובת ה-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.")
...

הלוגיקה כאן מנתחת את גוף הבקשה כדי למצוא הודעה או תגובה להצעה, מעבירה את המידע הזה לפונקציה בשם 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 של פותחי השיחה מהשלב הקודם ב-codelab הזה. אם אף אחת מהמחרוזות האלה לא מופיעה, ההודעה פשוט מועברת לפונקציה שנקראת echo_message, שאפשר לדמיין שהיא... משכפלת הודעות.

שליחת הודעות

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

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

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

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

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

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

bm-django-echo-bot/bopis/views.py [Lines 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 עושה זה להשתמש בפרטי הכניסה של חשבון השירות כדי לוודא שיש לכם אפשרות לשלוח הודעות לשיחה הזו, ליצור מופע של לקוח של 'הודעות לעסקים' וליצור בקשה לשליחת ההודעה אל conversation ID שצוין.

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

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

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

5. התאמה אישית של הסוכן

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

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

בהמשך ה-codelab הזה, נרחיב את הסוכן עם התכונות הבאות:

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

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

הוספת לוגו

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

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

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

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

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

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

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

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

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

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

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

הוספת מידע על שעות הפתיחה

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

יכול להיות שאתם זוכרים שהודעות מנותחות בפונקציה route_message של views.py. הפונקציה קודם מנרמלת את המחרוזת ואז מתחילה לבדוק אם ההודעה המנורמלת תואמת לאחד מהפרמטרים שמוגדרים בקוד. כדי לפשט את התהליך, נוסיף תנאי נוסף שבו נבדוק אם ההודעה המנורמלת שווה לקבוע חדש שנקרא CMD_BUSINESS_HOURS_INQUIRY ויכיל את הערך business-hours-inquiry. אם התנאי מחזיר את הערך true, נפעיל פונקציה שנקראת 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-hours-inquiry' או 'online-shopping-info' כדי לקבל מידע על העסק. בואו נעדכן את ההצעות לתחילת שיחה כך שכשהשיחה תיפתח, המשתמש לא רק יקבל הודעת פתיחה נעימה, אלא גם יראה הצעות לתחילת שיחה.

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

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

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

כמו שינויים אחרים שמבוצעים ב-Business Communications Console, יעבור זמן עד שהשינוי יתעדכן ותוכלו לראות אותו במכשיר הנייד.

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

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

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 Communications כדי לשנות את הסוכן, ושיפרתם את חוויית המשתמש עם סוכן דיגיטלי על ידי ביצוע שינויים בקוד המקור.

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

זו דוגמה לאופן שבו זה יכול להיראות.

איך בונים ממשק צ'אט עם AI מעולה?

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

הוספת הקשר והגדרת ציפיות

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

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

הענקת פונקציונליות למשתמש

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

שמירה על מעורבות המשתמשים

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

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

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

מה השלב הבא?

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

מאמרי עזרה

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

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

1. מבוא

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

מה הופך סוכן דיגיטלי לטוב?

מה תפַתחו

מה תלמדו

מה תצטרכו

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

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

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

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

הגדרת ה-webhook

3. יצירת הסוכן הראשון

שימוש ב-Business Communications Developer Console

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

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

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

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

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

‪bm-django-echo-bot/bonjourmeal-codelab/step-1/bopis/views.py [Lines 302-309]

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

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

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

שליחת הודעות

bm-django-echo-bot/bopis/views.py [Lines 199-212]

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

5. התאמה אישית של הסוכן

הוספת לוגו

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

הוספת מידע על שעות הפתיחה

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

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

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

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

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

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

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

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

6. מזל טוב

איך בונים ממשק צ'אט עם AI מעולה?

הוספת הקשר והגדרת ציפיות

הענקת פונקציונליות למשתמש

שמירה על מעורבות המשתמשים

מה השלב הבא?

מאמרי עזרה

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