Bạn có thể sử dụng Google Tin nhắn với RCS và Google Wallet để thiết kế một quy trình làm thủ tục liền mạch: người dùng hoàn tất quy trình làm thủ tục, nhận thẻ lên máy bay và thêm thẻ đó trực tiếp vào Google Wallet từ ứng dụng Tin nhắn. Sau khi thẻ lên máy bay được thêm vào ví, thẻ này sẽ tự động cập nhật nếu thông tin chuyến bay thay đổi. Người dùng có thể nhanh chóng truy cập vào thẻ lên máy bay mới nhất ngay trên điện thoại.
Tài liệu này mô tả các bước kỹ thuật để triển khai quy trình thêm thẻ lên máy bay vào Google Wallet. Tài liệu này cũng có một cuộc trò chuyện mẫu kèm theo các mẹo thiết kế để mang lại trải nghiệm đăng ký mượt mà và hiệu quả với RBM.
Triển khai kỹ thuật
Để triển khai quy trình thẻ lên máy bay vào Ví Google, bạn sẽ làm việc với Google Wallet API và RBM API.
Điều kiện tiên quyết
Để bắt đầu sử dụng Google Wallet API, hãy làm theo các bước bắt buộc sau:
- Đăng ký tài khoản tổ chức phát hành Wallet để bạn có thể tạo và phân phối thẻ và vé cho Google Wallet.
- Tạo một dự án Google Cloud (GCP) nếu bạn chưa có.
- Bật Google Wallet API.
- Tạo một tài khoản dịch vụ và khoá để bạn có thể gọi API Google Wallet.
- Uỷ quyền cho tài khoản dịch vụ trong Bảng điều khiển Google Pay và Wallet.
- Sử dụng mẫu thẻ lên máy bay để tạo một lớp Thẻ lên máy bay mới.
API Google Wallet
Để tạo thẻ lên máy bay và tạo URL Thêm vào Google Wallet cho RBM, hãy làm theo các bước này:
- Thực hiện các bước xác thực và uỷ quyền cần thiết.
- Tạo một Đối tượng thẻ/vé.
- Lấy Mã thông báo web JSON (JWT) đã ký. Độ dài tối đa của một JWT được mã hoá là 2048 ký tự.
- Sử dụng JWT để tạo URL Thêm vào Google Wallet.
RBM API
Để gửi đề xuất Thêm vào Google Wallet từ RBM, hãy gửi một Thao tác Mở URL. Trong tải trọng thông báo, hãy làm như sau:
- Đối với
text, hãy nhập "Thêm vào Google Wallet". - Đối với
url, hãy nhập URL Thêm vào Google Wallet.
Biểu tượng Google Wallet sẽ tự động xuất hiện trên nhãn đề xuất.
Thiết kế cuộc trò chuyện
Mẫu này sử dụng sức mạnh độc đáo của cuộc trò chuyện để hướng dẫn người dùng thực hiện toàn bộ quy trình nhận phòng. Ví dụ này minh hoạ cách bạn có thể sử dụng hộp thoại tự nhiên và các tính năng phong phú (như đề xuất bằng một lần nhấn và thẻ phong phú) để giúp người dùng đạt được mục tiêu. Trong trường hợp này, mục tiêu của họ là: (1) tuỳ chỉnh trải nghiệm chuyến bay, (2) nhận thẻ lên máy bay và (3) thêm thẻ đó vào Google Wallet để truy cập nhanh tại sân bay.
Tiếp theo là thông tin tổng quan về cuộc trò chuyện. Tiếp theo là các mẹo thiết kế và quy trình phân tích từng bước. Để triển khai một thiết kế tương tự cho tác nhân của bạn, hãy xem các mẫu mã sau đây theo các bước.
Lời khuyên về thiết kế
Hãy lưu ý các nguyên tắc sau khi thiết kế quy trình nhận phòng:
- Tin nhắn đầu tiên của bạn là quan trọng nhất. Nêu ngắn gọn mục đích của cuộc trò chuyện để người dùng có lý do tương tác.
- Mỗi thông báo nên cung cấp một phần nhỏ thông tin và nhắc người dùng phản hồi. Câu trả lời đề xuất và hành động đề xuất giúp người dùng thực hiện bước tiếp theo.
- Nhân viên hỗ trợ của bạn phải phản hồi nhanh chóng, chứ không phải phản hồi tự động. Sử dụng ngôn ngữ phản ánh giọng điệu của thương hiệu. Người đại diện lý tưởng của thương hiệu sẽ trò chuyện với khách hàng như thế nào?
- Mọi người đều muốn cảm thấy mình đặc biệt. Bạn có thể cá nhân hoá trải nghiệm làm thủ tục bằng cách đề xuất chỗ ngồi hoặc bữa ăn dựa trên nhật ký chuyến bay của người dùng.
- Thẻ thông tin nhiều định dạng và băng chuyền giúp cuộc trò chuyện trở nên linh hoạt hơn. Hãy sử dụng các thành phần này để chia sẻ hình ảnh và thông tin chi tiết giúp người dùng chọn trong số các lựa chọn.
- Một cuộc trò chuyện thú vị sẽ kết thúc một cách tốt đẹp. Xác nhận thông tin làm thủ tục lên máy bay của người dùng trước khi bạn gửi thẻ lên máy bay. Thêm nét gần gũi bằng lời chào tạm biệt thân thiện.
Quy trình đăng ký
Trợ lý thông báo cho người dùng rằng họ có thể làm thủ tục lên chuyến bay.
Mã mẫu
const suggestions = [ { reply: { text: '⚡ Check in', postbackData: 'checkIn', }, }, { reply: { text: '⏰ Remind me later', postbackData: 'remindMe', }, }, { reply: { text: '✈️ View my flight details', postbackData: 'flightDetails', }, }, { reply: { text: '🔀 Change my flight', postbackData: 'flightChange', }, }, ]; const params = { messageText: 'Check-in for your flight', messageDescription: '👏 Happy morning, Jo! Check-in is now open for your flight from London to Mumbai on ' + getFlightTime() + ' at 2:00PM. What would you like to do? ', msisdn: phoneNumber, suggestions: suggestions, imageUrl: getImageUrl('fly.png'), height: 'MEDIUM', }; rbmApiHelper.sendRichCard(params);
Người dùng nhấn vào một câu trả lời gợi ý để xác nhận có mặt.
Nhân viên hỗ trợ đặt ra kỳ vọng cho quy trình nhận phòng.
Mã mẫu
const params = { messageText: "OK, great. It's just 3 simple steps to check in. Here's the first step to get you onboard:", msisdn: msisdn, }; let self = this; rbmApiHelper.sendMessage(params, function (response, err) { self.sendPolicyImage(msisdn); });
Nhân viên hỗ trợ yêu cầu người dùng đồng ý với chính sách an toàn.
Mã mẫu
const suggestions = [ { reply: { text: 'Yes, I agree', postbackData: 'policy_agree', }, }, { reply: { text: "No, I don't agree", postbackData: 'policy_nack', }, }, ]; const params = { messageText: 'Baggage safety policy', messageDescription: 'To help us ensure a safe flight, please review our safety policy and let us know you agree', msisdn: msisdn, suggestions: suggestions, imageUrl: getImageUrl('policyImage.png'), height: 'MEDIUM', orientation: 'HORIZONTAL', thumbnailImageAlignment: 'LEFT', }; rbmApiHelper.sendRichCard(params);
Người dùng nhấn vào một câu trả lời đề xuất để đồng ý.
Trợ lý ảo cảm ơn người dùng và giới thiệu bước tiếp theo.
Mã mẫu
const params = { messageText: "Thank you - A safe passenger is a happy passenger! Here's the next step:", msisdn: msisdn, }; let self = this; rbmApiHelper.sendMessage(params, function (response, err) { self.sendPlan(msisdn); });
Nhân viên hỗ trợ nhắc người dùng chọn một chỗ ngồi.
Mã mẫu
const suggestions = [ { reply: { text: 'View the seat map', postbackData: 'view_seat_map', }, }, ]; const outerSuggestions = [ { reply: { text: '17A', postbackData: 'seat_17A', }, }, { reply: { text: '17C', postbackData: 'seat_17C', }, }, { reply: { text: '18A', postbackData: 'seat_18A', }, }, { reply: { text: 'Show me more', postbackData: 'more', }, }, ]; const params = { messageText: 'Choose your seat', messageDescription: "It's time to sit back and get comfy! 💺 We've recommended some seats based on your last flight. Choose the one you want, or let us know your preferred seat by typing the number.", msisdn: msisdn, imageUrl: getImageUrl('seatMap.png'), height: 'TALL', orientation: 'VERTICAL', outerSuggestions: outerSuggestions }; rbmApiHelper.sendRichCard(params);
Người dùng nhấn vào một câu trả lời được đề xuất cho ghế đã chọn.
Trợ lý xác nhận lựa chọn của người dùng.
Mã mẫu
this.seatmap[msisdn] = seat; const params = { messageText: `Seat ${seat}, you got it`, msisdn: msisdn, }; let self = this; rbmApiHelper.sendMessage(params, function(res) { self.sendFoodOptions(msisdn); });
Trợ lý ảo yêu cầu người dùng chọn bữa ăn trên chuyến bay.
Mã mẫu
const params = { messageText: `Now let's talk food 😋 You can pre-order your in-flight meal. Would you be happy with a vegetarian entree or a chicken entree?`, msisdn: msisdn, }; let self = this; rbmApiHelper.sendMessage(params, function(res) { self.sendFoodDetails(msisdn); });
Nhân viên hỗ trợ cho biết các lựa chọn về bữa ăn.
Mã mẫu
const cardContents = [ { title: 'Panzanella salad (v)', description: 'Ingredients: bread, lettuce, onions, tomatoes, olive oil', suggestions: [ { reply: { text: 'Choose vegetarian', postbackData: 'veggie', }, }, ], media: { height: 'MEDIUM', contentInfo: { fileUrl: getImageUrl('salad.jpg'), }, }, }, { title: 'Grilled chicken with greens', description: 'Ingredients: chicken, potatoes, peppers, olive oil', suggestions: [ { reply: { text: 'Choose chicken', postbackData: 'chicken', }, }, ], media: { height: 'MEDIUM', contentInfo: { fileUrl: getImageUrl('chicken.png'), }, }, }, ]; const params = { msisdn: msisdn, cardContents: cardContents, }; rbmApiHelper.sendCarouselCard(params);
Người dùng nhấn vào một câu trả lời được đề xuất cho bữa ăn mà họ chọn.
Trợ lý xác nhận lựa chọn của người dùng.
Mã mẫu
const params = { messageText: `Vegetarian it is 💚`, msisdn: msisdn, }; let self = this; rbmApiHelper.sendMessage(params, function (response, err) { self.sendAskConfirmation(msisdn); });
Nhân viên tóm tắt thông tin chi tiết về việc nhận phòng.
Mã mẫu
let seat = this.seatmap[msisdn]; const suggestions = [ { reply: { text: "Yes, I'm happy with that", postbackData: 'happy', }, }, { reply: { text: 'Change my seat', postbackData: 'change_seat', }, }, { reply: { text: 'Change my meal', postbackData: 'change_meal', }, }, ]; const params = { messageText: "Here's what we've noted down: You've opted for seat " + seat + " and a vegetarian meal. Please confirm your choices.", msisdn: msisdn, suggestions: suggestions }; rbmApiHelper.sendMessage(params);
Người dùng nhấn vào một câu trả lời gợi ý để xác nhận thông tin chi tiết về việc check in.
Nhân viên thông báo rằng quá trình nhận phòng đã hoàn tất.
Mã mẫu
const params = { messageText: "Hooray! You're now checked in for your flight ☑️ Here's your boarding pass. We're so happy to host you soon!", msisdn: msisdn, }; let self = this; rbmApiHelper.sendMessage(params, function (response, err) { self.sendWalletPass(msisdn); });
Nhân viên hỗ trợ gửi thẻ lên máy bay cho người dùng.
Mã mẫu
this.walletHelper.createFlightPassUrl(this.seatmap[msisdn]).then((url) => { let suggestions = [ { action: { text: 'Add to Google Wallet', postbackData: 'addToWallet', openUrlAction: { url: url }, }, }, ]; const params = { messageText: 'HS123 LHR to BOM\nPassenger: Jo Flow', messageDescription: "We'll keep you up to date! You'll get a notification if your flight details change.", msisdn: msisdn, suggestions: suggestions, imageUrl: getImageUrl('boardingPass.png'), height: 'TALL', orientation: 'HORIZONTAL', thumbnailImageAlignment: 'LEFT', }; rbmApiHelper.sendRichCard(params); });
Trong thẻ thông tin chi tiết ngang này, hình ảnh là thẻ lên máy bay hoạt động đầy đủ do hãng hàng không cung cấp. Hình ảnh phải hiển thị tất cả thông tin cần thiết để lên máy bay, bao gồm cả mã vạch có thể quét. Người dùng có thể nhấn vào hình ảnh để xem và quét thẻ lên máy bay trong ứng dụng Messages của Google.
Đề xuất Thêm vào Google Wallet sẽ xuất hiện trên thẻ thông tin. Đề xuất này kích hoạt thao tác Mở URL để mở ứng dụng Google Wallet, nơi người dùng có thể thêm thẻ lên máy bay vào ví của họ. (Nếu ứng dụng chưa có trên thiết bị của người dùng, họ sẽ được nhắc cài đặt ứng dụng.) Sau khi thẻ/vé được thêm vào Google Wallet, người dùng sẽ tự động nhận được thông báo nhắc nhở về chuyến bay và thông tin cập nhật về trạng thái nếu thông tin chuyến bay của họ thay đổi.
Những người dùng không thêm thẻ/vé vào Google Wallet cũng cần được cập nhật thông tin. Nhắn tin cho người dùng về mọi thay đổi đối với thông tin lên máy bay xuất hiện trên thẻ đa phương tiện.
Người dùng nhấn vào một hành động được đề xuất để thêm thẻ/vé vào Google Wallet.
Ứng dụng Google Wallet sẽ mở ra. Người dùng nhấn vào một nút để thêm thẻ và vé vào ví.
Người dùng nhấn vào một nút để xem thẻ và vé.
Thẻ lên máy bay có mã QR sẽ xuất hiện.
