11
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

こそぷろ(子育てプロトタイピング) #protooutAdvent Calendar 2023

Day 15

「やだー!!!!!!」だけじゃわからないので、今のきもち押してみて!!

Last updated at Posted at 2023-12-14

あなたの気持ちがわからない…

こんにちは、3歳息子の育児に奮闘中のワーママです。
イヤイヤ期を経て、自我が強く強く育まれている息子。
たくさんおしゃべりするようになりましたが、まだまだ自分の気持ちは説明できず
「やだーーーーーー!!!しないーーーーーー!!!」 
が多く、お出掛け先だと対応に手を焼いてしまいます…😭

すこーしだけ息子の気をそらしつつ、今どんな気持ちになっているのか、それがなんでなのかお話しできるきっかけを作れないかな…?
と「きみのきもち」LINE Botを作ってみました。
(着想はとある絵本からいただきました!)

今の気持ちを教えて?LINE Bot「きみのきもち」

使用ツール

  • LINE Deveropers
  • リッチメニューエディタ
  • Make(旧integromat)
  • Googleスプレッドシート

リッチメニューの設定

10個の領域を設定していきます。

image.png

全アクション「メッセージ」で下記のように登録しました。
① おはなし聞いてくれる?
② ⸜(*ˊᗜˋ*)⸝ワーイ
③ (*•ᴗ•*)
④ (´・ω・`)
⑤ (×_×;)
⑥ (っω<。)
⑦ ๐·°(৹˃ᗝ˂৹)°·๐
⑧ ((o(。>皿<。)o))
⑨ (`‐ω‐´)
⑩ ⁽⁽(੭ꐦ •̀Д•́ )੭*⁾⁾

リッチメニューの設定は以上です!
(並んでるとちょっと和む…笑)
API呼び出ししておしまい!

詳しい手順はこちらの記事で↓↓↓

LINE Botの仕組みづくり

リッチメニューで送られるメッセージと連動する仕組みをノーコードツールのMakeを使って作ります。
image.png
2つのルートに分岐させます。

お顔ボタン押したときのルート

「今の気持ちはどれ?」と聞いてお顔ボタンを押してもらうとランダムに画像が返ってくるように設定します。

リッチメニューの②~⑩に登録した顔文字に使用されている最初の記号をフィルターに設定します。

以降のモジュールの詳細設定はこちらの記事をご覧ください!

Googleドライブの画像をLINEで表示できるようにする方法

お顔ボタンを押すと画像がランダムで返ってくるようにGoogleスプレッドシートには、リッチメニュー②~⑩の顔文字とそれに対応するように画像のURLを入力しておきます。

ファイルの共有設定を、リンクを知っている全員が閲覧できるように変更します。

そして リンクのURL!
ここがめちゃくちゃポイントです。
Googleドライブに保存した画像のURLをそのまま載っけてもLINE上には表示されないのです…。

なんでそのままじゃダメなの…?

LINEモジュール内の設定でメッセージタイプとして「Image」を選択するのですが、送られるURLは画像形式にしてくださいと注意書きがあります。

Googleドライブに保存してある画像のURLは
https://drive.google.com/file/d/{固別のID}/view?usp=drive_link
という形になっているので画像ファイルだと認識されず表示されない…、というカラクリのようです。

URLの加工方法

Googleドライブに保存してある画像のURLは
https://drive.google.com/file/d/{固別のID}/view?usp=drive_link
という形になっています。これを…
https://drive.google.com/uc?id={個別のID}&{拡張子}
に加工してあげると表示されるようになります!
image.png

詳しくは下記サイトをご参照ください!

真夜中に困っていた私にこれを教えてくれた恩人さま…ありがとうございます😭

ユニコーンちゃん押したときのルート

ユニコーンちゃんを押すとChatGPTがめっちゃ寄り添ってお話しを聞いてくれるモードになります。

フィルター設定はお顔ルート以外全てに反応するようにDose not start withにして顔文字の頭文字の記号を登録しています。

image.png
各モジュールの詳細設定は下記記事を参考に作成しました!

ChatGPTのプロンプト

あなたは、パパママから絶大な支持を得ている共感が得意な
プロのスーパー保育士です。
チャットボットのように振る舞ってください。

私の発言に対して、1回に1つずつ返答します。
説明文は書かないでください。
一度に複数の会話を書かないでください。
あなたの一人称は「ぼく」です。

私は保育園に通う年齢の子供です。
私が自分の感情について話しかけてきますので、応答してください。
私は、自分の感情の処理方法について未熟でどのように振る舞うべきかわかっていません。
私の感情や今の状態に共感してください。
怒りや悲しみを抱いている場合には、どのようにすることで気持ちを落ち着けることができるか、子供にもわかりやすい易しい言葉で教えてあげてください。
あなたは「私の味方」の役割に徹し、常に私の目線に沿って語ります。

会話は落ち着いた優しい口調で、全てひらがなで記してください。
私の会話文の長さの3倍の長さの文字数以下で、話すものとします。

プロンプトはpromptiaさんからお借りして作成しました!
ChatGPてぃ先生を目指してプロンプトをアレンジさせていただきました^^

息子の反応

出先で大きい声を出して欲しくないな…というときに、スマホを差し出し「今どんな気持ちなのかお顔押してみて?」というと、キョトンとして怒っているボタンを押してくれました。
連打で。
画像が出てきても無反応。
感情をお天気になぞらえて気持ちを落ち着けるように話をしようと思っていたのですが、ボタンを押すことで無心になっているようでした…笑
まぁ、気を逸らせた…と言うことで、成功…かな(笑)

本当はこういうことができれば良かったかな…?

怒っている、泣いている時の顔って息子は自分ではあまり見たことがないはず…?
ランダムに返ってくる画像は、息子自身の怒っている・泣いている・笑っている姿でも良いかもしれないな~と思いました。
その方が、ボタン連打じゃなく画像が出るの待ってくれるかな…笑

息子に好きなように触らせてあげたいけど、ツールの無料枠がすぐやられそうです(笑)
それを気にせず連打して楽しい何かも開発してあげたいです!笑

ここまでお付き合いいただきありがとうございます^^

11
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
11
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?