JUNIOR & SENIOR HIGH SCHOOL OF KOGAKUIN UNIVERSITY <OFFICIAL BLOG>

工学院大学附属中学校・高等学校<公式ブログ>

【デジタルクリエイター育成部】通学バス運行情報サイネージ① プロジェクト始動!

高校棟正面玄関にスクールバスや市バスの運行情報を表示する「(仮称)通学バス情報サイネージプロジェクト」が始動しました。
本プロジェクトではデジタルクリエイター育成部の有志が事務室と連携して制作を進めています。
複数路線のダイヤを一画面に整理し、発車時刻までの時間が直感的にわかるレイアウトを採用。
スクールバスだけでなく学校や近隣のバス停から出発する市バスのダイヤも一画面で確認できるデザインで、生徒が放課後や下校時にスムーズに移動できる環境づくりを目指しています。
最終的には事務室のみで運用できるようにすることで、学校に長く残すことができる「持続的なプロジェクト」として位置づけています。

今回は、デジタルクリエイター育成部チューターの清水先生から、本プロジェクトのいきさつと現在地、制作の模様をお伝えします。

1, きっかけ
さかのぼること12月、マイクラ班所属の高校2年生たちがMakeRoomにこのようなバスダイヤディスプレイを設置しました。

▶ディスプレイの様子。出入り口付近の見やすいところに設置されています。

スクールバスは行事などによって通常のダイヤとは異なる「臨時便」が運行されることがあり、この場合生徒たちは帰宅する便を調べなければなりません。

ダイヤ自体は学校公式Webサイトに掲載されていますが、毎回パソコンから閲覧するのは手間であるということで、生徒のアイデアでこのようなディスプレイが設置されました。

ただし、ディスプレイのもととなるダイヤ情報は作成した生徒が入力する必要があり、運用の手間となっていました。

そんな中、この話を聞いた事務の方が興味を持ち、ダイヤ入力などの運用に協力してもらえることとなり、本プロジェクトが始動しました。

2, 事務室との打ち合わせ
ダイヤを表示する画面側(フロントエンド)はおおむね完成しているため、ダイヤ入力などの運用をどう行っていくかを打ち合わせました。

普段の作業環境などを検討した結果、事務の方でもデータ処理に適した形で入力ができるよう、スプレッドシートを活用する方向でまとまりました。

3, バックエンドの設計
データ処理しやすい形でスプレッドシートのデータをもらうことができても、その画面への反映を手動でやっていると、事務のみで自立した運用をすることはできません。

そこで、フロントエンドにデータを提供するバックエンドの構築を行うこととしました。

プログラミング班にGoogle Apps Scriptというスプレットシートなどと連携できるサービスでWebアプリを構築したことがある生徒に参画してもらい、入力されたデータをWeb APIとして取得できるようなバックエンドを構築することとしました。

▶このようなフローを作成し、各モジュールを作成しています。

4, フロントエンドの改修

バックエンド側で用意したAPIからデータを取得するように修正してもらいます。また、事務からの要望で、諸事情でサイネージの表示を止める機能を追加してもらいます。

設置するサイネージが縦型のため、レイアウトの調整なども行ってもらいました。

5, これから

今後はバックエンドの構築をどんどん行っていくのと並行し、スプレッドシートを実際に事務の方に使ってもらい、フィードバックを得ることで運用をしやすくしていく予定です。
また、デジタルサイネージが用意でき次第、実際にアプリを起動して実機での動作を確認する必要もあります。
もととなったアプリを作った生徒が、高校3年という忙しい時期に入る前である「4月初旬の完成」を目標として、プロジェクトを加速させていきます!

(文・写真:デジタルクリエイター部 チューター 清水 大輔)

良いUIは、ただ“美しい”だけではなく、使う人の動きを想像し、迷いを減らし、行動を支える設計であること。
今回の通学バス情報サイネージは、単なるダイヤ表示ではなく、生徒自身が学校のインフラをデザインする挑戦でもあります。
情報をどう整理し、どう見せるか。
その問いに向き合った経験は、これからのものづくりにも確実につながっていきます。
日々の通学を支えるこの小さな画面の裏側には、生徒たちの設計と試行錯誤の積み重ねがあります。

通学バス情報サイネージは、現在、デジクリの拠点Makeroomでテスト運用を行いながら最終調整を行っています。
正面玄関に新しい景色が生まれる日も、もうすぐです。(広報室)