今日の数字はなんで？来客動向のヒントをワンハンドで知りたい！

# 仕事で毎日気にすること
こんにちは！商業施設の常駐管理をしているIT素人です。
毎日商業施設にいて気になることと言えば、第一にお客さんの来館客数です。
土日祝は賑わって、平日は落ち着くなんてことはカレンダー上は当然。一方で「今日は人が多いけど思い当たる節がないなあ」or「日曜でイベントもしているのに昨年を割っている！？」なんてことも多々あります。なぜだろう？？

そんな時に最初に思いついたこと。**`LINE`で聞いて二つ返事で情報が返ってきたら素敵！**
# 使用ツール
+ Google Spreadsheets
+ Make
+ LINE Developers
+ OpenWeatherMap API
# ゴール設定
+ ターゲット：　同じ職場で働く仲間
+ ゴール設定：　客数増減に関わりそうな主要素を、LINEで即座にダイレクトにつかむことができる状態

【今回呼び出したい要素】
1. 職場周辺エリアの現在の天候
2. 職場周辺エリアのイベント情報
3. 職場周辺エリアの小学校休み情報
:::note info
今回はプロトタイプということで2024年の夏休み限定仕様です。
:::
# 完成したプロトタイプ　今日の数字なんで？
https://x.com/M8nEl0s0v8/status/1810843235276968225

# 全体像
+ `LINE`と様々なWEBサイトを接続させる`LINE Developers`の`Message API`を利用します
+ 今回`LINE Bot`は`Make`で動かします
+ 天気情報を呼び出すためには`OpenWeatherMap API`を使用しました
+ イベントや夏休みの期間情報は`GoogleSpreadsheets`に集約し、フィルタにより入力した地域ごとの情報が返ってくるように組み込みました
+ 地域は職場を中心に３分割し、３つの地域ごとの分岐を作成しました

**今回作成していく`make`の動きの全体像です。**
![【Qiita用】Makeフロー全体図.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3812402/f58e2d94-965a-fff6-ff08-63c2fe68c785.png)

# 天気情報を呼び出す

https://openweathermap.org/api

:::note info
`OpenWeatherMap API`の選定理由
+ 濃い密度で都市座標が存在。呼び出す都市座標を細かく設定可能
+ 天気状態に加えて、気圧、湿度、風速等細かい情報を取得可能
+ メールアドレスの登録で即座に無料でAPIキーの取得が可能
:::
【天気情報APIの呼び出しの流れ】
`APIキー`を取得し、都市名から座標すなわち緯度、経度を取得します。
1 . 最初に座標を取得するためのAPI（`Geocoding API`）を使用し、任意の都市について緯度と経度を取得

**座標を呼び出すためのAPIコード**
```
http://api.openweathermap.org/geo/1.0/direct?q={city name}&limit={limit}&appid={API key}
```
2 . 次に都市の現在の天気情報を取得するため、１で取得した緯度(`lat`)と経度(`lon`)を用いたAPIを使用

**指定した座標の天気情報を呼び出すためのAPIコード**
```
`https://pro.openweathermap.org/data/2.5/forecast/climate?lat={lat}&lon={lon}&appid={API key}`
```

# イベントと学校休み情報を抽出する
`LINE Bot`からの応答で二つ目にイベント、三つ目に夏休み情報を返すように設定していきます。
イベント情報をWEBサイトから抽出できたら、最新の情報をきれいに見せることができると思ったのですが、今回は関連するイベント情報を自力でまとめ、取捨選択したうえで`GoogleSpreadsheets`にリストアップしました。

**赤枠の`GoogleSpreadsheets`で抽出します。**
![イベント.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3812402/5da8e73f-a65a-b658-ffcd-e5d77b194a33.jpeg)

:::note warn
【要検証ポイント①】
<strong>使用した`GoogleSpreadsheets`は`Get Range Values`で適切か</strong>
:::

**シート内の該当セルの範囲を`Range`に入力します。**
![イベント情報抽出.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3812402/f2351755-b869-b160-2113-2558e66f1d13.png)

# 天気情報を置換する
`OpenWeatherMap API`は英語で記述されています。数値以外のパラメータを返す時は、日本語に置換したいと考えました。
そこでさらに、返された3桁の天気コードから日本語へ置換する手順を挟みます。

**赤枠の`GoogleSpreadsheets`で置換を行います。**
![天気情報置換.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3812402/6b21c6c5-006d-0c79-62d8-d97365ab31a4.jpeg)

天気コードは`OpenWeatherMap API`内で[リスト](https://openweathermap.org/current#list)が公開されているため、それを基にシート内で再リスト化しました。

**シート内の該当セルの範囲をRangeに入力します。**
![天気情報置換.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3812402/1a8d04a1-a3cb-ed75-8c50-be562f1c25ed.png)

# 応答を設定する
必要な情報の呼び出しと抽出、置換までの動きが完成しました。
入力に対する`LINE Bot`からの応答を作成していきます。

ここは多少時間を要したところで、天気情報APIから返される数値は、デフォルトでは3桁での表記になっていたり、時間表記も英語かつ秒単位まで表示されてしまいます。
職場の仲間に向けてわかりやすい表記にするため、`Text and binary functions`のオプションを使用しました。
時間表記をわかりやすく（年月日）するためには`formatDate`を使用し、天気数値単位を2桁表記にするためには`substring`の機能を使用しました。
何度も実験して、一目でわかる形にまで ~~自分の中で及第点がとれる形に~~ 成形しました。

**返された値を使用して、`Text`内でメッセージを組み立てていきます。**
![Text　binary functiion.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3812402/aeb3b765-68f1-ceb7-38c1-547d061a43c2.png)

**メッセージを分割するために`Add item`で次の`Text`内でイベント、休みの情報を入力していきます。**
![イベント設定.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3812402/b06530ce-d3fa-73f6-1353-e9c35cbea309.png)

# フィルタを設定する
今回は3つの地域についての情報を、入力されたメッセージテキストに合わせて返すため、3つに分岐する形をとりました。
テキストによるフィルタを作成することで、入力された地域に合わせた条件分岐をするように設定しました。

::: note warn
【要検証ポイント②】
フィルタの条件設定は適切か
![フィルター設定.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3812402/76062739-1ebf-5139-58c3-aecbbb83567c.png)
:::

**赤枠の`Router`で条件分岐を行います。また規定外のメッセージテキストが入力された場合には、無効のメッセージを返すように設定しています。**
![フィルタ.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3812402/91dd5ddf-9400-eda4-5fa6-b248c0f3f0f7.jpeg)

# 要検証ポイント
作成の過程で、2点満足していない点があります。
基本的な要素のような気もしますが、合理的な方法があるはずのため改善していきたいです。

:::note warn
【要検証ポイント①】使用した`GoogleSpreadsheets`は`Get Range Values`で適切か
:::
⇒　いろいろ試してみたのですが、`Get Range Values`で数値を取得する際に思うようにいかず`GoogleSpreadsheets`のほうをmakeの設定に合わせるという手法でパワープレーになってしまいました。

`Raw`からの値のみ返ってくるため、すべてひとつひとつの値をひたすら羅列しています。。

![【Quiita用】googlespreadsheet課題.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3812402/092126c0-8bb1-5e24-9a60-98b7df0311b1.png)


::: note warn
【要検証ポイント②】フィルタの条件設定は適切か
:::
⇒　複数フィルタをかける際にうまく機能せず、こちらもパワープレーとなっております。
`Add OR rule`でひたすらフィルタをかけるテキストを個別設定しています。。
![フィルター設定.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3812402/97f2355a-90ad-b1be-abd1-934214c645eb.png)

# 初めてプロトタイプを作成してみて
`make`の機能を理解しつつ進めるのはなかなかに試行錯誤の連続でしたが、「こんなこともできるのでは？」って勝手にアイデアだけが膨らんでいくのは楽しかったです！
プロトタイプの実用性としては、自力で集めて成形したデータを基にしているため正確性などに不安が残る出来ですが、アイデアを形にするという視点では及第点だったかなという自己評価です。
今回は自分で抽出した数値データ単体を基にしているため、期間限定でしか使えない仕様でしたが、リアルタイムな情報を返すことができたら非常に有用だと感じました！