Comfortable PandAをリリースした話

この記事は Kyoto University Advent Calendar 2020 の9日目の記事です。 今年作った京大のPandAを便利にするアプリケーションについて書きたいと思います。

はじめに

はじめまして、京大電気電子工学科2回生のdas08です。
趣味でプログラミングとかしているごくごく普通の大学生です。

中学校のときにクラスメイトだった友人からプログラミングの面白さを教えてもらって以来、今に至るまですっかりこの沼に浸かり込んでしまっています笑。最近は学科の友人の影響でHaskellやSwiftに少し手を出してます。

京大の学習支援システム『PandA』

さて、本題に入りたいと思います。

京大にはオンラインで課題の提出や授業資料が見れるPandAという学習支援システムが用意されています。

コロナの影響で対面講義が不可能になった今年度はこのPandAとZoomを併用したオンライン講義が行われています。

PandAを使うことでオンライン上で課題の提出とその成績の確認などが完結できるためとても便利なサービスなのですが、PandAには発行されているすべての課題の一覧を見る手段がなく、また課題が出されたことに気づかない(いわゆるサイレント課題)ことがよくありました。

履修している講義が数個程度であれば、毎日講義ページにアクセスして課題が出ているか比較的簡単に巡回できます。しかし、一般的な京大生であれば半期で10-15程度の講義を履修していると思うので毎日定期的に講義ページを巡回して課題をチェックするのには莫大な労力がかかってしまいます。

そこで、課題マネジメントを容易にするために『Comfortable PandA』というアプリケーション(ブラウザ拡張機能)を作りました。 Google ChromeやFirefoxといったブラウザにインストールするだけで使えて特別な設定もいらないアプリです。

12/9日現在1600人近いユーザーが使用してくれています。

Comfortable PandAのユーザー数(12/09/20時点)

Comfortable PandAの機能

Comfortable PandAには次のような機能を実装しました.

  • 締め切り残り時間による講義タブの色分け
  • 新規課題を知らせる通知バッジ
  • 発行されている課題一覧の表示
  • 提出管理用のチェックボックス
Comfortable PandAの画面

提出締切に応じて赤黄緑の3色に色分けすることで視覚的に優先順位をつけやすくしました。
また前回のアクセス時との課題の差分を調べ、新しい課題が発行されている場合には講義タブの左上に赤丸の通知バッジを表示するようにしました。これでもうサイレント課題なんて怖くなくなりました。

画面の右側には課題の一覧を確認できるサイドメニュー(愛称: miniPandA)(上の写真の右側のやつ)を設置しており、簡単に課題の一覧を確認することができます。
自分のメモを課題一覧に追加することもできます。

開発話

少し専門的な話になりますが、Comfortable PandAの開発についてちょっとだけお話します。

開発に使用した言語はJavascript(とHTML+CSS)です。初めてのJavascriptでしたが幸いにも大きなバグを踏むことなく書き上げることができました。
課題を取得→前回アクセス時の課題と比較→データを表示 がスムーズに実装できたのでデバッグを含めて4日ほどで公開することができました。
(フレームワークを何も使っておらず、後先考えず書いてしまったためソースコードは見るに耐えないものになっています。。)

公開後はTwitterでエゴサしつつバグ修正をしたり需要があった機能を実装したりしていました。デベロッパーにとってユーザーフィードバックは何よりも大切だなぁとしみじみと感じました。
最近はユーザー数が増えてきたのでPandAに負荷をかけないよう長めのキャッシュ機能を実装しています。

(余談) Comfortable PandAの開発と時期を同じくして何人かの有志たちがPandA関連の便利ツールを開発していました。

  • PandA CLIツール
  • Google Calenderに課題を追加するツール
  • Twitter風PandAスキン
  • PandAのWindows用アプリ などなど・・・
    PandA開発界隈が盛り上がっていて楽しかったです。皆どれほどPandAに不満があったかがよくわかりますね!

まとめ

京大の学習支援システムPandAをより一層便利にするブラウザ拡張機能を作った話を長々と書きました。
色々と便利な機能を実装したので興味を持ってくれた方は是非使ってみてください!

Comfortable PandAのダウンロードはこちらから!