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
540
LINE BotとLIFFを使って謎解きアプリを作った話
Kazumasa Yamamoto
October 21, 2020
Tweet
Share
More Decks by Kazumasa Yamamoto
See All by Kazumasa Yamamoto
ユニークビジョンの Rust 活用事例
fill9120
0
480
Rust & AWS X-Ray による分散トレーシングの実現
fill9120
0
1.8k
Rust製プロダクトを 3年以上運用して得たノウハウ
fill9120
0
600
Messaging APIを駆使した ChatGPT ボットのUX改善
fill9120
0
320
Rust を開発言語として採用してからの取り組み
fill9120
1
1.7k
ストラクチャードコミュニケーション
fill9120
0
81
Cloudflare PagesにVue.jsアプリをデプロイしてみた
fill9120
0
510
Rustでディープラーニング
fill9120
0
320
Rustで定数式を扱う
fill9120
0
360
Other Decks in Technology
See All in Technology
EM完全に理解した と思ったけど、 やっぱり何も分からなかった話 / EM Night Fukuoka #1
hirutas
0
280
web-application-security
matsuihidetoshi
1
190
エンジニア候補者向け資料2024.04.24.pdf
macloud
0
3.4k
Improve Your Development Workflow with Gemini Code Assist
meteatamel
0
130
本当のAWS基礎
toru_kubota
1
630
AWS学習者向けにAzureの解説スライドを作成した話
handy
3
190
IaCジェネレーターとBedrockで詳細設計書を生成してみた
tsukasa_ishimaru
4
890
今日からできる!簡単 .NET 高速化 Tips -2024 edition-
xin9le
7
3.9k
20分で完全に理解するGrafanaダッシュボード
hamadakoji
5
890
IPUT App Dev. Co. -Overview 2024/4
iputapp
0
130
生産性向上チームの紹介
cybozuinsideout
PRO
1
920
プロンプトエンジニアリングでがんばらない-Agentic Workflow へ-近藤憲児
kenjikondobai
6
1.2k
Featured
See All Featured
What's in a price? How to price your products and services
michaelherold
238
11k
Designing on Purpose - Digital PM Summit 2013
jponch
111
6.5k
How STYLIGHT went responsive
nonsquared
92
4.8k
Imperfection Machines: The Place of Print at Facebook
scottboms
261
12k
Facilitating Awesome Meetings
lara
43
5.6k
How GitHub (no longer) Works
holman
305
140k
Agile that works and the tools we love
rasmusluckow
325
20k
Learning to Love Humans: Emotional Interface Design
aarron
267
39k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
14
1.5k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
21
1.4k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
26
2.3k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
8
1.3k
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読込、シェア機能