LINE謎の作り方のステップや必要な作業環境をわかりやすく解説

LINE謎は、LINEの自動返信機能を使った謎解きゲームです。ユーザーが送信した謎解きの回答や特定のキーワードに反応して、新たな謎を送ったり自動メッセージを返したりすることが可能です。

LINE謎はブランディングやマーケティングへの効果が大きく、公式アカウントで謎解きを導入する企業も増えています。

今回は、LINE謎の作り方や必要な作業環境についてできるだけわかりやすく解説します。プログラミングに疎い方でもLINE謎の大まかな構築方法を理解できるようになるので、ぜひご一読ください。

担当者必見の「商品や施設、自治体をアピールできる謎解き」とは？
⇒無料お役立ち資料を受け取る

LINE謎の作り方は細かいステップに分かれます。「木を見て森を見ず」ではなかなか内容の理解が得られないので、まずは大まかな手順を把握することが必要です。LINE謎の大まかな構築方法は次の通りです。

1. 企画を考える
2. 環境作り・コーディング
3. デバッグ

各手順について、次で詳しく解説します。

1．企画を考える

まずはどんなコンセプトにするか、ストーリーはどう練るかなど、企画を決めていきましょう。出てくるキャラクターのデザインなども考案する必要があるため、別途プロモーション動画を作成し、イメージを固めてみてもいいかもしれません。

同時に出題する謎に関しても、イメージを形作る必要があります。難解な内容の謎も図で示せば、一目で概要を把握できるようになります。Googleスプレッドシートの図形描画機能などを活用すると便利です。

2．環境作り・コーディング

LINE謎は、ユーザーが送信した答えや特定のキーワードに対し、自動返信機能を使って、新たな謎を出題したりメッセージを送信したりする仕組みです。自動返信機能の構築（BOT）を指しているのがこのパートです。

LINE謎で実現したい内容にもよりますが、シンプルに一問一答を積み重ねる形であれば、GAS（Google Apps Script）の利用が適しています。基本的なコードは決まっているため、ひな形のようなものを入手すれば、特定の部位をいじるだけでプログラムを開始可能です。

文言を入れる部分にフォロー時のメッセージや謎解きの回答を入れていきます。詳しくは後にスクリプトの画像を共有するので、こちらをご確認ください。

3．デバッグ

デバッグとはコンピュータのミスを見つけ、修正を行う作業です。謎が好きな友人や知人に共有し、デバッグの協力してもらうといいでしょう。デバッグ版を公開したら、LINEと接続し、実機に搭載するという流れです。

商品や施設、自治体のプロモーションにお悩みの方必見！お役立ち資料を無料配布中
⇒お役立ち資料を受け取る

こちらではLINE謎の詳細な構築方法を紹介します。手順が少し複雑ですが、できる限りわかりやすく解説するよう努めましたのでぜひご覧ください。

1．事前準備

いきなりプログラミングを構築するのではなく、いくつか準備が必要です。事前準備の中身は「公式アカウントの作成」「LINE Developersの登録」「LINE Bot Designerのインストール」の3つになります。

LINE DevelopersはLINEの開発者として権限を付与してもらうことを指し、LINE Bot DesignerはBOTの構築に必要なツールです。それぞれの具体的な手順をチェックしましょう。

公式アカウントの作成

公式アカウントは、企業や団体が消費者に対する宣伝を目的に構築するツールです。LINEが提供するアカウント作成ページへ行き、「非認証アカウントを開設する」のボタンをクリックしてください。

ログインの際は普段使用している個人アカウントのメールアドレスやパスワードでOKです。公式アカウントの作成において必要となるのはアカウント名、メールアドレス、業種の3つです。

アカウント名には謎解きのタイトルを入れるようにしましょう。確認画面で内容に誤りがないことを確認したら、「完了」を押下し、作成完了です。

LINE Developers登録

LINE Developersに登録し、LINEの開発者としての登録を行います。すでに持っているLINEアカウントで登録できるため、新たなアカウント登録は不要です。QRコードをかざすだけで簡単に認証が可能です。

LINE Bot Designerのインストール

LINE Bot Designerはプログラミングの知識なくして、簡単かつ時間をかけずにLINE Botのプロトタイプを作成できるツールです。希望のシナリオに沿う形で、自由にBOTを構築できます。

LINE Bot Designerはすべてのメッセージテンプレートに対応しています。LINEアカウントを持っている方であれば、無料で誰でも利用可能です。

2．LINE上で開発者登録を行う

ここでは、上で紹介した開発者登録の詳細とその後に行うべきステップについて見ていきます。LINE Developersに初ログインした際は、名前とアドレスを入力するだけで開発者アカウントを作成できます。次に新規プロバイダ（アプリを提供する組織）の設定作業に移ります。本名や所属企業名を入力してください。

次にチャネルの基本設定を進めていきます。チャネルの基本設定に必要な項目はアイコン、チャネル名、チャネルの説明、プライバシーポリシーURL、サービス利用規約URLです。

そして、先ほど作成した公式アカウントにMessaging APIチャネルを追加します。こちらはLINEアカウントをBOTモードで使用するために、必要なステップです。

LINE Official Account Managerにおいて「Messaging APIの利用」を有効化すると、チャネルを作成可能です。操作の途中でプロバイダーの選択画面が表示されますが、他のチャネルと連携するつもりであればチャネルと同じプロバイダーを選択する必要があります。なぜなら後から変更できないからです。

Messaging APIチャネルの設定では、LINE Developersを使用します。LINE Official Account Managerへログインした時と同様のアカウントでLINE Developersにログインしてください。先程と同様、プロバイダーを選択してチャネルが作成しましょう。

これはBOT用のチャネルになります。BOTを作成したりサンプルを開発したりするためには、別途チャネルを設定する必要があります。

BOTの登録では必要な情報を追加していってください。アプリ名を入力する箇所がありますが、これはBOT自体の名称です。LINEでコミュニケーションを取る時の表示名は後から変更できるので、この時点では気にしなくて大丈夫です。ここまでのステップで、LINE Botの設定はいったん終了します。

3．使用する言語「GAS」の準備をする

BOTのプログラムを格納し動作させるために使用するGAS（Google App Script）を準備します。GASとはGoogleが提供する、JavaScriptとの互換機能を持つスクリプト環境です。

GASを利用するには、事前にGoogleアカウントの登録が必要になります。Androidのスマホを持っていれば、通常アカウントの登録は済んでいるはずです。

JavaScriptを構築できるエンジニアがいれば、おおむね問題なくGASを使用できるでしょう。GASの使用方法は、まずGoogleドライブにアクセスし、新規でスプレッドシートを開いてください。メニューバーから「ツール」→「スクリプトエディタ」と進みます。

なぜスプレッドシートを開いたかというと、GASはスプレッドシートと連帯して管理されるためです。GASを開くことができたら、画面左上に出てくるプロジェクト名を記載し、「公開」→「アプリケーションとして導入」をクリックします。

アプリケーションの実行を自分に設定し、アクセスできるユーザーを全員に設定してください。これらはGASのプログラムを公開するために必要な作業です。最後にウィンドウに記載されるURLの記録を忘れずに行ってください。LINEからのデータはここに送付されるのです。

4．LINE BotとGASを連携させる

LINE Botの管理画面を開き、先程対応したチャネル設定画面に進みます。メッセージ送受信設定において、Webhook送信の項目を「利用する」に変え、Webhook URLに先の工程で記録したURLを入力します。

次にアクセストークンを発行してください。トークンはBOTからユーザーへメッセージを送るために必要になります。GASからLINEのAPIへのデータ送信を可能とするため、アクセストークンと基本情報のChannel Secretを保存してください。

最後にLINE Botの自動応答メッセージ機能を「利用しない」に変更しましょう。LINE Botは標準機能として定の文言を返信する機能が備わっているためです。

5．LINE Botのスクリプトを実装する

GASの画面に移行し、ユーザーと応答形式のスクリプトを実装していきます。この時のスクリプトはJavaScriptで記載可能です。

あいさつメッセージ

あいさつメッセージとはユーザーに友達追加された際に、自動で送付するメッセージを指します。

引用：【LINE謎】LINEで遊べる謎解きの作り方と開発方法まとめ

以上のテキストで「友達追加ありがとうございます！」と書かれた部分を変更すれば、オリジナルのメッセージを構築できます。

応答メッセージ

友達追加時と同様の手順で、送付されたメッセージに対する返信を準備してください。LINE謎においては、ユーザーから謎解きの答えが送られてきた際に返信する部分です。想定していないメッセージが送付された時の返信も可能です。（default部分に記載）

引用：【LINE謎】LINEで遊べる謎解きの作り方と開発方法まとめ

スクリプトが完成した後は「公開」→「Webアプリケーションとして導入」をクリックし、バージョンを「new」に変更すると新しくなっていることが確認できます。

返信メッセージをさらにリッチにしたい時は、LINE Bot Designerの活用がおすすめです。LINE Bot Designerのインストール完了後、プロジェクトの作成をクリックしてください。

画像や動画、テンプレートメッセージなどを設計し、JSONコードをGASにコピペすれば使用できます。LINE謎では画像を使用する場合も多いと思われるので、こちらを積極的に活用してみてください。

オウム返しBOTの作成

自分で関数を操作できる方は、一からプログラムを構築しても良いでしょう。ここでは送った内容をそのまま返すオウム返しBOTを作成します。

まずGAS上でデバッグを行えるような仕組みを整えます。Javascriptで言うconsoleと同様の働きをするLoggerの実行から始めてください。

※詳しい実行方法はスペースの都合上、割愛します。

次にGASにアクセスするための関数を定義していきます。定義するのはHTTPのGETに反応する関数であるdoGetです。

※こちらの入力方法についても、スペースの都合上割愛します。

言語が入力し終わったら、保存してアプリケーションの更新作業に移ります。前と同じく「公開」をクリックし「ウェブアプリケーションとして導入」を選択し、バージョンを「新規作成」に変更してください。この設定を失念すると、いつまでもプログラムが更新されないので注意が必要です。

「更新」ボタンを押した後、表示されるURLにシークレットモードでアクセスしてみてください。Successの文字が表示されるはずです。この過程がGASのコードを更新する手順であり、コードを編集する際は上記の手順を毎回踏む必要があります。

最後にLINEの管理画面に進み、Webhook URLで「接続確認」を行ってみましょう。成功のメッセージが出れば、LINEからもGASが確認できたことを意味します。

LINE BotのAPIではユーザーから送付されたメッセージが、WebhookAPIに伝えられます。デバッグに使用するLoggerは動作確認には使用できますが、LINEAPI経由で送られるWebhookのデータは確認できません。

そのため、スプレッドシートへデータを書き込むための関数を別途、定義する必要があります。

※こちらも関数の定義方法については割愛します

「メニュー」→「実行」→「関数の実行」→「doGet」と流れを踏み、Webhookへテキストが書き込まれたら、無事成功です。

次はdoPostという関数を定義します(定義づけのやり方は割愛)こちらの関数はPOSTのデータの中からLINE APIで使う部分を抜き出し、そこからテキストを取得するものです。

LINE Botでは自分からメッセージを送る場合と、返信する際で機能が異なることに注意してください。メッセージに対して返信する場合、tokenを取得しなければなりません。プログラムを実装し、保存→バージョンの更新を行ったら、LINE Botが動作するかテストしましょう。

返信が返ってこない時は、Loggerなどを活用してみてください。うまくいっていれば、送付したメッセージがそのまま返ってくるBOTが形成されているはずです。

LINE謎の構築方法や必要な操作環境などについて解説しました。

システム開発の用語が頻出したので、少し難しいなと感じた方もいるかもしれません。説明上必要だと判断したためこれらの用語を使用しましたが、わからない部分があれば、次の3つの大まかなステップをまず把握しましょう。

1. 企画を考える
2. 環境作り・コーディング
3. デバッグ

難解なのは、「環境作り・コーディング」の過程だといえるでしょう。まずLINE Botを作成し、使用言語であるGASと連携させる必要があります。その前提として、GoogleスプレッドシートによってGASを使えるよう準備しなくてはいけません。GASはJavaScriptを使用できる知識があれば、十分扱うことが可能です。

手を動かしてみないとわからないことも多いので、記事を確認しながら実際にやってみてください！

IKUSAでは集客イベント、歴史イベントを企画・運営しています。ご相談は無料です。内容が固まっていなくてもお気軽に「やりたいこと」をお聞かせください。
⇒まずは相談してみる