13-E-7 クラウドサービスとゲーミフィケーション: 「TwilioQuest 3」を用いた開発者オンボーディング

© 2019 TWILIO INC. ALL RIGHTS RESERVED.
#devSumiE
13-E-7
クラウドサービスと
ゲーミフィケーション:
「TwilioQuest 3」を用いた
開発者オンボーディング
Twilio Japan合同会社
池原大然 (@Neri78)

自己紹介
池原大然（いけはらだいぜん）
Developer Evangelist @ Twilio
Twitter: @Neri78

● ツイート 
● 写真撮影 
どんどんお願いします！

このセッションの内容
● Twilioとは？
● オンボーディングとゲームの活用
● TwilioQuest3のアーキテクチャ
● 導入の効果
● まとめ

様々なコミュニケーションチャネルをクラウドを介して
「プログラム可能な状態で」利用できるサービス

利用例: アカウント登録時の認証インフラとして
SMSまたは電話で
認証コードを送信

利用例: サーバーの死活監視の一部として
サーバーに障害が発生すると
電話で叩き起こされる（恐怖の電話システム）

他のサービスと連携することで可能性は無限大
例えば...
• AIチャットボット
例: https://www.linebrain.ai/
• 音声合成サービス
例: https://www.ai-j.jp/cloud/webapi/
• 監視ソリューション
例: https://mackerel.io/ja/

連携例: 関西弁で電話応答
https://www.ai-j.jp/cloud/webapi/

オンボーディング
と
ゲームの活用

社内でこんな会話されたことはないですか？
「うちのサービス（製品）のユーザーは、
◯◯の基本的な知識を持っていることを
想定している。だから【一般常識】として
△△は理解しているはずだ」

一般常識って全ユーザーの何%でしょう？

● いかに使いはじめてもらうか？
● いかに使い続けてもらうか？

© 2020 TWILIO, INC. ALL RIGHTS RESERVED.
Phone Numbers Short Codes IoT SIMSIPInterconnect
SUPER NETWORK
Twilio Flex Marketing Campaigns
ソリューション
チャネル API
SMS Voice ChatEmail WhatsAppVideo Facebook Line
RUNTIME
Functions
Assets
CLI
Debugger
SDKs
Autopilot
インテリジェンス
Verify LookupAuthy
アイデンティティ
TaskRouter
オーケストレーション
StudioConversations
多
すぎ！

製品ドキュメントは長所・短所それぞれ
https://www.twilio.com/docs
全
部
は
読
め（ま）ない

TwilioQuest3
https://www.twilio.com/quest

© 2019 TWILIO INC. ALL RIGHTS
RESERVED.

カンファレンス・イベントに合わせて 
「イベント」を設定

ハイスコアチャレンジなどのゲーム性を追加
http://bit.ly/TQDevSumi2020

Webアプリからローカルアプリに
• TwilioQuest2はWebベースのアプリケーション
• TwilioQuest3はローカルアプリに

TwilioQuest アーキテクチャー（概要）

利用されている技術やツール
• Electron - A cross-platform framework for building desktop apps with web technologies – used in the
likes of Visual Studio Code and Slack. It was a natural fit for a body of contributors that are mostly web
developers, and for an application that will be heavily dependent on displaying structured text and rich
media (a major reason for not using something like Unity to build TwilioQuest). It also enables us to use
the huge universe of packages available to Node.js applications.
https://www.electronjs.org/
• React - UI-heavy games like TwilioQuest benefit from having a robust rich client application framework
like React.
https://ja.reactjs.org/
• Phaser - A mature framework for building 2D games that run in the browser. TwilioQuest’s graphical
requirements are not intense, but thus far I’ve been quite pleased with the game’s performance on the
WebGL canvas in Electron’s Chromium browser. Join Twilio in supporting Phaser on Patreon here!
https://phaser.io/
• Tiled - An open source map editor, this is the key tool we use to design environments in the next version
of TwilioQuest.
https://www.mapeditor.org/
https://www.twilio.com/blog/operators-manual-1-welcome-to-the-twilioquest-program

日々更新されるサービスへの対応
• ゲームコンテンツのみを更新・追加できる
● objective.json - チュートリアルの設定
（タイトル、経験値、アイテムの設定など）
● description.json - チュートリアルの概要
● walkthrough.md - チュートリアル本体
● validator.js - 解答検証ロジック

導入の効果・今後について

導入の効果 - ユーザー数
TwilioQuest2と比較して
リリース後、
対前年比95%増加
新規ユーザー獲得、
リテンションに貢献

導入の効果 - コンテンツ消費数
TwilioQuest3リリース後、
対前年比135%増加
ユーザーのリテンション、
製品理解の向上に貢献

導入の効果 - セールスパイプライン
TwilioQuest3および、このツールを活用し
たイベントがセールスパイプラインにポジ
ティブな影響を与えた

今後の課題・改善
●Webアプリ vs ローカルアプリ
●ユーザー体験の改善
○ ゲームそのもののわかりやすさ
○ 言語の壁（英語ベース...）
●ゲームに対しての嫌悪感

まとめ
● オンボーディング 
= サービスを成功させる１要素 
● チュートリアルのゲーム化 
● ユーザーの獲得、リテンションに効果 
● https://www.twilio.com/quest

DevSumiマップにチャレンジ！

DevSumiハイスコアチャレンジ!  
(2/14 19:00まで）
http://bit.ly/TQDevSumi2020

ありがとうございました 
 
@Neri78

13-E-7 クラウドサービスとゲーミフィケーション: 「TwilioQuest 3」を用いた開発者オンボーディング

Recommandé

Recommandé

Contenu connexe

Tendances

Tendances (20)

Similaire à 13-E-7 クラウドサービスとゲーミフィケーション: 「TwilioQuest 3」を用いた開発者オンボーディング

Similaire à 13-E-7 クラウドサービスとゲーミフィケーション: 「TwilioQuest 3」を用いた開発者オンボーディング (20)

Plus de Daizen Ikehara

Plus de Daizen Ikehara (20)

13-E-7 クラウドサービスとゲーミフィケーション: 「TwilioQuest 3」を用いた開発者オンボーディング