ようかんBot総まとめ

Transcript

1. None

2. ⾼校の同級⽣250⼈に使われるLINEBot を開発/運営して⾒えてきたもの ようかん（@inoue2002） 普通科

3. ⾃⼰紹介

4. ようかん（井上陽介） ⾃⼰紹介 • 滋賀の普通科⾼校3年⽣（現在進⾏形） • 陸上競技部キャプテン（過去形） • LDGKオンラインハッカソン LINE賞受賞 •

   レッドハッカソン2020 奨励賞受賞 • 「⾼校⽣主催のIT勉強会」を主催(#⾼校⽣ミーティング) • 今までに40くらいLINEBotをリリースしてる • LINEDCによくいる⾼校⽣エンジニア • ポートフォリオ( youkan.me ) • Twitter（＠inoue2002 ） → • LINE Green Badge貰った

5. ＃LPF_REVUP_O

6. @inoue2002

7. 今⽇の発表の要約とまとめ！ • ⾼校三年間開発/運営したサービスの総まとめ発表 • LINEAPIを使った⾼校⽣の事例紹介 • LINEAPIを使った開発の参考になる部分があると嬉しい！ • ⾼校⽣らしく⾃由に喋ります！ REVUP最後の登壇セッションとなります。

   みなさんお疲れだと思いますのでぜひリラックスして聞いていただけると嬉しいです とか⾔いつつもコミュニティカンファレンス！いつもの感じでゆるーくやっていきます！ ←この30分僕が喋ること

8. 本編スタート▶

9. 普通科⾼校⽣の 情報共有にある壁

10. どこでも誰もがやってそうな会話①

11. どこでも誰もがやってそうな会話②

12. 僕は思った。これが全校で展開されてるんじゃないか。って。 同じ情報が複数の場所で やりとりされるんじゃない？

13. それが頻繁に起こっている可能性 ⽉ ⽕ ⽔ ⽊ ⾦ ⼟ ⽇ 漢字テスト 英単語テスト

    課題提出 英⽂法テスト 課題提出 週末課題 ⽉曜の漢字テストの範囲教えてー 次のコミ英の提出物なんだっけ ⾦曜⽇の課題の範囲くれー！

14. 送る側 負のサイクルの始まり始まり 聞く側 送るのめんどくさい いつ⾃分が聞く側に なるかわからないか ら送るしかない k 毎回毎回申し訳ない 聞いてからの時差

    お互いのモチベが下がっていく可能性もある

15. なんか⼀括で共有できた⽅がよくね？ ⼤勢の前で発⾔するのは抵抗が多い⼈も結構いる グループLINEでいいやん→ そこで.. 共有は⼀回だけでいい&みたい時に待ち時間無しで⾒れたらいい感じ✨

16. • ⾼校⽣みんなが導⼊しやすい • 広めやすい • 開発/運営しやすい • ⾼校⽣の普及率ほぼ100パーセントのLINE • QRコードやトークからアカウントをそのまま共有できる

    • LINEBotを使うことでみんなが慣れたチャットUIをベースに開発できる どこに作ろうか・・・

17. そうして出来上がった 新しい情報共有ツール「ようかんBot」

18. 実際に⼆年半同級⽣は使ってくれたの？ ３１０ ２５１ 割と⼝コミが広がってみんな使ってくれるようになった

19. 三⽇前に⼤型アップデートを迎えたばかり！ 実際にLIVEDEMOしていきましょう！↑

20. DEMO①クラス設定をする DEMO⾼校 ⼀年⼀組で登録する

21. DEMO②画像を共有する（教える側）

22. DEMO②画像を共有する（教える側） アップロードするLIFFが開く ↓ 画像の種類を選択する ↓ 画像を選択してアップロードする

23. DEMO②画像を共有する（教える側）（動画が⾒れなかった時⽤） LIFFが開く 画像の種類を選択 画像を選択する 画像の種類を選択

24. DEMO③画像を確認する（聞く側）

25. DEMO③画像を確認する（聞く側） 共有された画像を⾒るLIFFが開く ↓ 知りたい画像を選択 ↓ 保存ボタンを押してトークに保存

26. DEMO③画像を確認する（聞く側）（動画が⾒れなかった時⽤） LIFFが開く 画像を保存 トークに残る

27. DEMO④画像を確認する（聞く側）

28. DEMO④画像を確認する（聞く側） 「時間割を確認」を押す ↓ 秒で時間割を送ってくれる

29. DEMO④画像を確認する（聞く側）（動画が⾒れなかった時⽤） ボタンを押す 秒で返してくれる

30. DEMO⑤拡散

31. DEMO⑤拡散 ボタンを押す ↓ QRとかURLとか⾊々送ってくれる

32. DEMO⑤拡散 スクリーンショット LINEで送信 URLをコピペで共有

33. DEMO⑥お問い合わせ 特にお問い合わせアカウントなど を設けず、頭に#をつけるだけでお 問い合わせできる お問い合わせグループにNotifyでお問い合わせがくる

34. DEMO⑥お問い合わせ（まとめ）

35. この⼤型アップデートはほぼ完成形？ • この形になるまでに⼆年かかった • プログラミング未経験から運営を始めた • 最初は全て⼿動で更新していた • なかなか使ってもらえなかった •

    運営コストやみんなに使ってもらうための課題が⼭盛り どんなふうに進化していったのか振り返っていきます

36. LINE BOOT AWARDS 2018 LINEBotの魅⼒に刺激を受け、なんにもできない状態でLINE＠を触ってみた

37. LINE＠のみで動く第⼀号 ⾃分で準備して、LINEオフィシャルアカウントマネージャーで更新

38. ⼀年⽣の間に100⼈を超え、来年もやることにした ⾼校⽣への宣伝は 基本インスタ 友達からの⼝コミ 陸上部→各クラス→いろんなグループに⼝コミで広がる

39. 時間を重ねるごとに登録者が増えるが、だんだん限界に近く • いろんな⼿を使って宣伝 • あだなが「ようかんBot」になったりする （ほぼ⼿動やし完全Botではなかった • なかなか200に到達しない →ユーザーの声を聞いて満⾜度や期待をあげたい

40. 初めてユーザーの声に⽿を傾けてみた

41. ⾊々課題がわかってきた

42. きっとこれなんだよなぁ（Webhookってなんやねん）

43. とりあえず教えてもらう • ネットで調べまくった • ハンズオンに参加した

44. 基本知識がついた/LINEBotが作れるようになった

45. 記事を⾒ながらコピペで実装（GAS）Google Apps Script • キーワード応答からリッチメニュー に • 画像のアップロードをGdriveに • キーワードの応答はスプレッドシート

    →以前より運営もしやすく →ユーザーも少しは使いやすく

46. ついに本物のBotなった！⾼2夏 • アイコンは同級⽣に書いてもらった • 登録者が結構増えた • G driveに権限を与えて運営を増やせる • 学校の先⽣から連絡を頼まれたり

47. また⾊々問題点が.. GASは応答が若⼲もっさり

48. AWSLambdaを⽤いたサーバレス構成を学習 ぶんせんせい本当にありがとう！！

49. さらにLINEAPIドキュメントが読めるようになった&技術⼒が上がった • Flexメッセージ • Quick Reply • nodeJS ⾊々思い通りにできるようになってきた できることが増えてUI・UXが爆上がり

50. None

51. Lambdaを使うようになってまた⾊々成果が 約⼀週間で900回応答とか

52. コロナ休校のせいで仕事を奪われた

53. 泣きそう

54. 休校明け、ユーザーは帰ってきたけど、僕が忙しくなり運営が疎かに

55. 気がつけばそんな中登壇⼆週間前w このままじゃ登壇できない

56. アップデート内容を考える lineBotは設計図を作 ると開発しやすい

57. ということで今週頭に開発、四⽇前リリース、週末登壇が実現しました

58. • みんながアップロードできるから運営コスト０ • LIFFを使い倒してDB５つ、エンドポイント７つ • 同級⽣だけでなく、他学年、他校までも使えるように • 今後使ってもらいつつ⾼校⽣の情報共有の壁壊したい • 三年間の知⾒や経験がとっても活かせたものができた

    最終形態のまとめ

59. アーキテクチャ

60. 同時並⾏で⽣まれた副産物

61. 同時並⾏で⽣まれた仕事 学校内で技術を認めてもらえて、本当にありがたい

62. 同時並⾏で⽣まれた仕事

63. 同時並⾏で⽣まれた経験

64. LINEコミュニティとLINEAPIで⼈⽣がたぶん変わった

65. LINEBot開発したことないけどしてみたい⽅！

66. ご質問/感想などをお待ちしています！ slido ＃lpf_revup_o

67. ⾼校の同級⽣250⼈に使われるLINEBot を開発/運営して⾒えてきたもの ようかん（@inoue2002） 普通科

68. 時間があればスライド

69. ようかんBotに遊び機能

70. LINEPAYガチャガチャを 作ってみた話 v2 ＠ LIFFアプリ LT祭り 2020/10/20 ようかん(＠inoue2002)

71. みなさん、ガチャガチャを⾃作したくなることありますよね！

72. - 先⽇段ボールでガチャガチャを作った

73. 結構いいね付く 決済

74. 加川さんの影響を受けました ちなみに・・・

75. None

76. Botデザインしてみた⚒

77. 試作品 最新版

78. %&.0

79. None

80. 最新版 デザインはまだですw

81. 最新版_裏側

82. LINEPAYAPIを初めて使った • ドキュメントはわかりやすいが、仕組みがむずかった • 近頃ソースコードと記事（qiitaかZenn）書くのでお楽しみに

83. ΞʔΩςΫνϟ LINEBot/PayConfirm デバッグ

84. まとめ • 時間が空いたらデザインを含めて改造していきたい！ • LIFFをもっと凝っていきたい！ • LINEAPIをもっとマスターしたい！

85. LINEPAYガチャガチャを 作ってみた話 v2 ＠ LIFFアプリ LT祭り 2020/10/20 ようかん(＠inoue2002)