LINE株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。 LINEヤフー Tech Blog

Blog


Qiitaで人気のLINE関連投稿紹介(保存版)

Developer Relations Teamマネージャーの砂金(いさご) @shin135 です。この記事はLINE Advent Calendar 2017の21日目の記事です。

LINEでは12月よりDeveloper Relation Teamを新設し、より一層エンジニアのみなさまとの関係構築に注力して参ります。

LINEとしてエンジニアが積極的に情報発信してゆく雰囲気を応援しようという意図で、Qiitaのアドベントカレンダーに協賛させていただいている流れもあり、今回はQiita上でLINE、特にチャットボット開発に関連した記事をピックアップして、みなさまが後に参照するときに困らないためのまとめ記事として紹介してゆきます。LINE Bot関連情報はWeb上に多くあるものの、まとまった記事を見つけにくいというご意見もいただいており、こちらの投稿を「はてぶ」などで保存版としてご活用いただけると幸いです。ここに掲載させていただいた方々のみならず、LINEが公開しているMessaging APIやLINE Loginを実際に試していただいたすべてのエンジニアのみなさまに、改めて御礼申し上げます。

Qiita上の投稿は1.事例系、2.作り方解説系、3.Tipsの3つに分類することができそうなので、順にご説明してゆきます。

1. 事例、やってみた

つくってみた系の投稿が増えてきていることを大変嬉しく思います。そのすべてをご紹介することは難しいのですが、直近のQiitaエントリーの中から3つほど紹介します。

海外仮想通貨取引所を使いやすくする美少女コンシェルジュ

Bittrexでの仮想通貨取引を日本語での対話形式で行ってくれるBotです。シンプルな機能で、ちょっと不便なことを代替してくれるBotというアイディアは広く応用できると思います。美少女である必然性はありませんが、何らかのキャラクター性をもった相手が対応してくれるUXを意識することは、チャットボット開発で重要です。機械的な素っ気ない対応より、ユーザーが親近感を持って接することができる演出を心がけてみてください。自分で使うためであればコマンドとして機能する表現は、好きな文字列を使えばよく、それほど気を遣わなくてもよいですが、多くの方に使ってもらいたい場合にはボタンなどのテンプレートやリッチメニューを利用すると、より直感的に使いやすくなります。現状のサイトが不便というわけではないのですが、リアルタイム性の高いLINEでの取引やアラートは国内勢のbitFlyerさんやGMOさんにも対応していただきたいですね。

オープンデータ活用とリアルタイム性を活用した「金沢空きチャリ」

地域課題解決型のBotを開発するにあたり、オープンデータの活用は相性抜群です。比較的簡単に実装できる上、開示しただけでは誰にも使ってもらえないオープンデータ提供側の課題と、データの正確性を担保しにくいBot開発者の課題の両方を解決できます。LINEも各地のCode forコミュニティや自治体と協力してGovHackを開催してきており、ゴミの分類や子育ての悩み相談など、身近な地域課題を解決するBot開発を支援してきました。また、Bot開発のテーマを選ぶ際には、リアルタイム性も重要です。通知や対話の手段はメールなど他にもありますが、ユーザーが日常的に利用するLINEの特徴のひとつとして情報のリアルタイム性があげられます。今回利用されているオープンデータでは、レンタル自転車の空き状況がほぼリアルタイムに把握することができ、LINEとのこの点でも相性完璧です。

クリスマス用「近くのケンタッキーを教えてくれるLINE BOT」

位置情報を扱うという点では、金沢空きチャリとアプローチは似ています。ぐるなびのAPIを利用して近くのケンタッキーを教えてくれるという至ってシンプルな機能を実現していいます。ちょっとアプリをつくってみたくなったとき、簡単に実装できる上、まわりの友だちに使ってみてもらえるのでおすすめです。クリスマスシーズンで、Adventカレンダーもあるし短時間で何か作ろう!という状況で、うまく活用していただき感謝です。余談ですが、同じような仕組みで近くの松屋を検索するBotをつくったりすると@chomado氏から人気が出そうですね。興味ある諸氏はがんばってみてください。つくったbotの拡散の仕方はこちらが参考になると思います。

2. 作り方解説

LINEもDeveloper Centerでファーストステップガイドを提供してますが、各開発言語で開発環境を整える手順やサンプルコードが多数紹介されています。なかでも、圧倒的にまとまっているのはnode.jsです。特に言語へのこだわりがなく、手軽に試してみたいという場合にはnode.jsがおすすめです。

IoTLTを主催する「のびすけ」氏によるこちらの「1時間でLINE BOTをつくる資料+レポート」はわかりやすく、多くの方に参照されています。

また、LINEでDeveloper Advocateをしている中嶋さんによるBootcampハンズオンも丁寧な解説で、身内のことながらわかりやすいと評判です。サポートを受けながら開発してみたいという方は、次回以降の機会に参加してみてください。

PHP、Ruby、Go、Pythonなど他の言語でも多くの投稿がありますので参考にしてください。ここでは、Qiita外ではありますが、ちょっと変わったところでC#での開発手順を解説してくれている中村さんのBlogをご紹介します。

前職マイクロソフトで担当していたAzureのFunctionというサーバーレス環境を使っているあたりも胸アツです。さらに、実はマイクロソフトの中の人である中村さんとプロジェクトメンバーで、Visual Studio CodeのExtensionやシミュレーターまで勢い余って開発されてますので、普段あまりマイクロソフト関連技術に触れない方もチェックしてみてください。

3. ちょっとしたTips

LINE Botを開発をするにあたり、知っておくとちょっと便利なTips投稿もQiita上で増えてきていますので、いくつか紹介させていただきます。

Ngrok

Ngrokを用いた簡単Botテスト作成

NgrokはSSLを必須にしているLINE Botの仕組み上、お世話になっている方も多いと思いますが、SSLに対応したトンネリングツールです。弊社セキュリティポリシー上の配慮から、オフィシャルにはスタートアップガイドなどに記載して推奨しにくいものの、いちいちクラウド環境にデプロイして確認する必要がないので、Bot開発のデバッグが非常に便利になりますので使ってみてください。

Rich Menu API

LINE BotのRich Menu APIの使い方まとめ

LINEユーザーにより便利に利用してもらえやすいBotをつくるにあたり、是非活用を検討していただきたいのがリッチメニューという仕組みです。Botのアカウントを友だち登録したユーザーが、フリーテキスト入力に戸惑うことなく操作できるよう、画面下部に固定されるボタンです。これまでも設定画面から操作できましたが、APIでユーザーの状態や場面に合わせて細かな制御ができるようになっています。

画像の活用

画像を利用したRich Menuをブラウザから設定するサービス

Rich Menu APIで画像を利用する際に領域設定を支援してくれるツールを、LINEの立花さんが作成し、紹介しています。地味に便利な機能です。

イメージマップをブラウザから設定するサービス

こちらは遡ること数ヶ月前、LINEに入社したての立花さんがもくもくと作っていたサービス。これが上記Rich Menu APIに応用された流れですね。

Botが受信した画像を永続化(PHP)

他にも、Botが受信した画像を永続化するコード(PHP, Ruby, Python)や、データベース接続を支援するコードなど、立花さんがBot開発の中で生み出してきた便利ツールをgithub上に公開しています。

Windows環境での画像アップロード

前回LINE BOT AWARDS決勝で「写クレ」をプレゼンして見事入賞された「若狭氏」が、Curlコマンドがなくて画像アップロードが不便なWindows使いのために、Power Shellでの回避策をメモしてくれています。みなさんに各種APIを利用していただく中で工夫されたTipsはブログなどで残していただけると大変助かります。

URLスキーム

【Node.js】LINE Messaging APIのURLスキームを使ってメンヘラ彼女BOTを実装するは、題材がメンヘラ彼女Botとかなりファンキーな投稿ですが、公式には先日公開したばかりのURLスキームを活用していただいています。位置情報やカメラなど、LINEアプリの中の各種機能を呼び出すことができるため、工夫次第ではNativeアプリのようなユーザー体験を実現することも可能です。公式ドキュメントはこちらをご覧ください。

おまけ:LINE Bot開発におけるアドバイス

Qiitaでのまとめが趣旨とはいえ、他の方の引用ばかりではおもしろくないので、商用含めた数多くのチャットボットを見てきた私の知見から、LINE Bot開発時のアドバイスをさせていただきます。

LINEでチャットボットをつくる魅力のひとつに、多くの人たちに使ってもらえやすいことがあげられると思います。りんなやパン田一郎などを見ていると、テキスト入力での自然文会話が必須であるような印象を持つ方もいるかもしれませんが、実際にはAIエンジンとフリーテキスト入力で自由に対話させることが不親切になることも多くあります。

その場合、Welcomeメッセージやリッチメニューでできることを直感的に示してユーザーの迷いをなくし、事前に準備したシナリオに沿った、ボタンやイメージマップなどのテンプレートによる誘導が有効です。フリーテキスト入力を利用する場合には、キーワードの完全一致だけでなく、LUISやdialogflowを利用して意図抽出を行いながら、ハンドルできなかった場合のメッセージを丁寧に設定しておくことで、がっかり感を抑制するよう、工夫してください。

また、必ずしもLINEのトーク画面のような流れるUIが最適ではないこともあります。その場合には無理にチャットボットだけで完結させることを考えず、LINE Loginを利用してHTMLコンテンツを連携させることもできます。できる限りユーザーに優しい親切設計を心がけていただけると、LINEを日常的に利用するより多くの人たちに受け入れられるのではないかと思います。

Messaging API自体も機能追加を随時おこなってますし、追加されたRich Menu APIやアップデートされたLINE Loginなどを併せて利用することで、これまでNativeアプリでしか提供できなかったような機能を、LINEアプリの中で実現することができるようになっています。

音声とテキストの違いこそありますが、Clovaなどスマートスピーカーも各社からでてきている中で、対話によるチャットボット的なUXがより一層重要になってきている昨今、2018年も引き続きユーザー目線で、LINEらしいチャットボットを開発していただけましたら幸いです。LINE BOT AWARDSまたやってほしいという方、コメントお寄せくださいませ。

明日は劉碩さんによる「grow-loaderを使ってcode-splittingをもっと簡単に実装できた」です。お楽しみに!