Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
LINE BotとLIFFを使って謎解きアプリを作った話
Search
Kazumasa Yamamoto
October 21, 2020
Technology
0
610
LINE BotとLIFFを使って謎解きアプリを作った話
Kazumasa Yamamoto
October 21, 2020
Tweet
Share
More Decks by Kazumasa Yamamoto
See All by Kazumasa Yamamoto
ユニークビジョンの Rust 活用事例
fill9120
0
1.2k
Rust & AWS X-Ray による分散トレーシングの実現
fill9120
0
2.4k
Rust製プロダクトを 3年以上運用して得たノウハウ
fill9120
0
830
Messaging APIを駆使した ChatGPT ボットのUX改善
fill9120
0
350
Rust を開発言語として採用してからの取り組み
fill9120
1
1.8k
ストラクチャードコミュニケーション
fill9120
0
100
Cloudflare PagesにVue.jsアプリをデプロイしてみた
fill9120
0
750
Rustでディープラーニング
fill9120
0
360
Rustで定数式を扱う
fill9120
0
400
Other Decks in Technology
See All in Technology
RayでPHPのデバッグをちょっと快適にする
muno92
PRO
0
190
入門 PEAK Threat Hunting @SECCON
odorusatoshi
0
160
生成AI “再”入門 2025年春@WIRED TUESDAY EDITOR'S LOUNGE
kajikent
0
120
AIエージェント入門
minorun365
PRO
31
18k
AWSではじめる Web APIテスト実践ガイド / A practical guide to testing Web APIs on AWS
yokawasa
8
710
ディスプレイ広告(Yahoo!広告・LINE広告)におけるバックエンド開発
lycorptech_jp
PRO
0
380
コンピュータビジョンの社会実装について考えていたらゲームを作っていた話
takmin
1
610
アジャイルな開発チームでテスト戦略の話は誰がする? / Who Talks About Test Strategy?
ak1210
1
600
php-conference-nagoya-2025
fuwasegu
0
150
生成AI×財務経理:PoCで挑むSlack AI Bot開発と現場巻き込みのリアル
pohdccoe
1
730
【詳説】コンテンツ配信 システムの複数機能 基盤への拡張
hatena
0
260
Goで作って学ぶWebSocket
ryuichi1208
3
2.8k
Featured
See All Featured
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
29
1k
4 Signs Your Business is Dying
shpigford
182
22k
Side Projects
sachag
452
42k
The World Runs on Bad Software
bkeepers
PRO
67
11k
Bootstrapping a Software Product
garrettdimon
PRO
306
110k
Producing Creativity
orderedlist
PRO
344
40k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
4
430
The Cult of Friendly URLs
andyhume
78
6.2k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
3.7k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
49
2.3k
Typedesign – Prime Four
hannesfritz
40
2.5k
Into the Great Unknown - MozCon
thekraken
35
1.6k
Transcript
LINE BotとLIFFを使って 謎解きアプリを作った話 ユニークビジョン株式会社 山本 一将
自己紹介 2 ⚫ 名前:山本 一将(@kyamamoto9120) ⚫ 所属:ユニークビジョン株式会社 ⚫ 言語:C++, Rust,
Python, Ruby ⚫ 趣味:将棋、キャンプ、DIY、野球観戦 ⚫ 実績:2015年 世界コンピュータ将棋選手権9位
動機 3 ① 妻はリアル謎解きゲームが趣味 ② 今年はCOVID-19の影響で公演に行けない 誕生日プレゼントにLINEの技術を駆使して自作しよう!
リアル謎解きゲームとは 4 小問を解いて目的を達成する 与えられたパズルや暗号を解いて 指定された目的を達成するゲーム
謎解きアプリの概要 5 ① LINE Botと友だち登録 ② 部屋の中から問題やQRコードを探す ③ LINE BotのリッチメニューからLIFFを開いて
i. QRコードを読み込んで問題を解禁 ii. シェア機能を使って問題を解禁 ④ 問題を解いてBotに答えを入力
シェア機能の概要 6 シ ェ ア し た 側 シ ェ
ア さ れ た 側 LINE Botとのトーク画面で開くLIFFアプリ シェア先のトーク画面 LIFFアプリ ヒント1 ヒント2 トークの種類、表示する人によって LIFFアプリの内容が変わる
シェア機能の技術的な解説 7 LIFFアプリ • シェア機能はシェアターゲットピッカーで実現 • シェアするLIFFアプリは誰がシェアしたかを知る 必要があるため、一意なIDをサーバに保存 (LIFF URLに上記IDをクエリパラメータで渡す)
LIFFアプリはボタンテンプレートで送信 (クエリパラメータが汚いのでURLを見えなくした) • トークの種類は liff.getContext() メソッドで取得 • 今回は1対1トーク、グループ・トークルームの 2通りに処理分けした • クエリパラメータのIDをサーバに問い合わせて シェアした側、された側に場合分け
感想 8 ① LINEならではの謎解きを作ることができた ② アプリ自体は2日くらいで簡単に作れた • LIFF + LINE
Botならフロントエンドを頑張る辛さが少ない • Messaging APIもPythonのLINE Bot SDKが使いやすい! ③ 今度は公開できるようなアプリを作ってみたい
ありがとうございました
補足:システム構成 10 AWS Cloud LIFF LIFF SDKの実行 Webhookを処理 ユーザーの情報を管理 メッセージ送信
問題表示、QR読込、シェア機能