記事の概要
私（芝浦工業大学学部4年生）が大学3年時に1人で制作した、大学のポータルアプリ（ポータルサイトからスクレイピングして時間割などを表示する）が、大学に正式採用され、公式アプリ"ScombApp"としてリリースされるに至った経緯を時系列順に説明します。
ホーム画面
時間割画面
制作の動機
大学のポータルサイト使いにくいがち。
ポータルサイトのスマホアプリ版があれば便利そう。
他にやってる人いなさそうだし、最初に作ったらみんな使ってくれそう。
ポータルサイトの問題点
大学ポータルサイトで使いにくかった点を挙げていく。
とりあえずこれを克服することを目標にした。
ログインの時に自動補完が使えない
制作当時はBASIC認証で、スマホからだとログインの自動補完ができなかった。
毎回手打ちでパスワードを入力している人がほとんど ←！？
次の授業や教室を確認するだけでも、毎回手打ちログインが必要。
何も知らせないお知らせ
お知らせとは？
重要な通知がポータルホームで確認できない
このポータルサイトがリニューアルされた時は使えていたが、しばらくして"負荷軽減のため"とか言われて消えた
2年ぐらいこのまま放置されている。
まとめて表示されない締め切り
締め切りのある提出が課題、テスト、アンケートの3つに分かれていて、アンケートだけ別のページで確認しなければならない
シラバスとの連携不足
とっている授業のページからシラバスに飛べない
学期始まってすぐの履修キャンセルできる期間に、最終課題や授業進行、使用書籍を頻繁にみるので毎回一覧から探すのはしんどい
忘れ去られる課題
これは私の自己管理不足
課題の締め切り前に通知が欲しい
実現したいこと
現状の使いにくい点を克服する
- ネイティブのスマホアプリにしたい
- ログイン情報を保存して、ログイン画面をスキップしたい
- 締め切り系を一覧で確認したい
- 授業が開かれる教室をすぐ確認したい
- お知らせをちゃんとお知らせしたい
ターゲット
- ポータルサイトに不満を持っている本学学生
- 自分
最悪誰にも使われなくても、自分で使うからいいか
とりあえず作ってみる(大学3年生7月22日)
去年長期インターンでAndroid開発を経験したので、とりあえずそれで作り始める
Kotlinは結構好きです
独自のログイン画面からログイン
ログイン時のHTTP通信をデベロッパツールで監視
ログイン成功後にSESSIONをCookieに保存しているらしい。ふーん。
試しにCookieに過去にログイン成功したSESSIONを強制的に注入して、ログインが必要なページにアクセスしてみる
表示できた
独自の画面のテキストボックスに入力したユーザ名とパスワードのBASIC認証情報を送信
WebViewにJavaScriptを仕込み、ログインボタンを自動で押させる
無事ポータルホームにログインできた
ログインスキップ
ポータルホーム表示前に、WebView側でCookieに前回ログイン時のSESSIONを強制注入して、ログインスキップを実装してみる
ログインスキップは実装できた。
これが最初で最難関だった。
この時はログインスキップしてポータルサイトをWebViewで表示するだけでも十分かなとか思った。
ログインが必要なページのスクレイピング
ポータルサイトの情報を取得するにはスクレイピングするしかない(APIがあればなあ)
ログインが必要なサイトのスクレイピングは結構厄介
CookieにSESSIONをくっつけて、ポータルホームのHTMLを取得
あとはHTMLをJSoup🍲でごにょごにょして時間割と課題を抽出するだけ
プロトタイプ完成(大学3年生8月1日)
ポータルサイトから取得した時間割を表示。色を変えられる。
一度取得した時間割は1週間キャッシュとしてローカルで保存して、スクレイピングによる負荷をかけないようにしている。
課題とテストとアンケートを全て一覧で表示する。
締め切り前に通知してくれる
勢い余って、締め切りカレンダー画面も作った
知り合いに使ってもらう
と思ったが、Android使ってる人少なすぎる。よく考えてみたら私もiPhoneユーザだった。
デバッグ用Androidを貸して使わせてみる。
割と好感触だったので、開発続行。
製品版（非公式）の制作
アプリ名は、本家ポータルサイト"ScombZ"のスマホアプリである、ということがすぐわかるようにするため、"ScombMobile"とした。
究極の選択
製品版でiOSアプリの開発は必須。
- 案1：現在のAndroid版プロトタイプをブラッシュアップして、iOS版はSwiftで新しく作る
- 案2：現在のプロトタイプを捨てて、Flutterで1から作り直す
今後のメンテナンスとかを考えて案2を採用。後から考えてもこれは英断だったと思う（自画自賛）
Flutterで1から実装し直す(大学3年生8月8日)
Flutterの知識ゼロで実装につっこんでいったので、初期のコードは悲惨。
あとでリファクタリング地獄を見ることを知る由もない。
オリジナルのアイコン作成
プロトタイプでは仮で本家サイトのアイコンを使っていたが、リリースを見越してオリジナルのアイコンを作成
本家アイコンをモノトーンの手書き風にアレンジした
製品版（非公式）完成
時間割
時間割画面
授業詳細ウィンドウ
授業名でシラバスを自動検索して紐づけている
課題カレンダー画面
締め切り一覧画面
課題・テスト・アンケートを一覧表示
締め切り通知
お知らせ一覧画面
お知らせ表示
お知らせ詳細の取得にAJAXを使っていたのでスクレイピングで取得できなかった。
WebView上で強引に、特定のお知らせを表示するJavaScript関数を呼び出して該当のお知らせを表示させている。
時間割作成画面
時間割管理画面
時間割作成画面
時間割一覧のWebページから簡単に授業をインポートできる
シラバス検索
シラバスの全文検索を使いやすく改良した
製品版（非公式）リリース(大学3年生8月18日)
AppStoreとGooglePlayStoreで公開（現在は非公開）
Twitter（当時）でアカウントを作成し、本学学生を片っ端からフォローした後、リリース告知
好意的な意見
否定的な意見
「アプリにパスワードを入力するのが不安」と言う声が多かった ←確かに。
怪しいことしてないと証明するため、アプリのソースコードを公開
公開による軋轢
学内の一部の人たちから反感を買った
大学に交渉
大学のパスワードを入力させるため、このままだといつか大学からお咎めを喰らう
それなら先手打ったれの精神で特攻
とりあえず学生課に行った
メールで学情に問い合わせてくれとのこと
学情にメール
簡単な紹介動画をAdobePremiereProで作成し、添付。
学情の人と実際に会ってミーティングをすることになった
ミーティングと大学公式アプリ化決定
話されたこと
- すでに他大学でサードパーティ製のLMSスクレイピングアプリみたいなものは存在していて、問題になっている。
- 大学としてはちゃんとしたものかよくわからないアプリに対して、パスワードを入れることを推奨できない。
- しかし、このようなアプリがあったほうが学生のためになるのも事実。
- 今後このアプリは学情のアプリとして引き継ぎ、ここでアルバイトとして開発を続けてはどうか？
絶対無理だと思っていたから、正直驚いた。かなり柔軟な大学だと思う。
学情の開発アルバイトとして公式アプリScombApp開発開始(大学3年11月1日)
公式アプリScombAppとして機能実装や修正をしていくことになった。
時給は学生にしては良い。友人を誘って2人で開発を続けることに。
念願のAPI整備
今までスクレイピングで情報を取得していたが、公式アプリに採用されるにあたって、専用のAPIが用意された。
いらない機能削除
泣く泣く削除した機能たち👋
- 締め切りカレンダー
- 履修計画（いつか別アプリとして復活させたい）
結局プロトタイプの状態で機能的にはほぼ完成していた。もっと早い段階でリリースしていれば、無駄な機能を実装せずに済んだかもしれない。
ユーザのニーズに合わせてこのような機能を実装していくべきだった。
大学公式版リリース(大学3年3月31日)
ホーム画面
時間割画面
お知らせ一覧画面
締め切り一覧画面
累計8000ダウンロード
リリース直後はAppストアセルラン82位に乗った
大学広報からプレスリリースとして発信(大学4年12月)
複数のメディアに取り上げてもらった。
アルバイト追加募集(大学4年12月)
学生の中から、学情の開発アルバイトのメンバーを募集。
大学1年にインターンを探しているとき、どこの募集も大体実務経験必須だった。当時一切実務経験のなかった私は絶望した。実務を経験したい学生は多くいるにも関わらず、そのほとんどが実務経験必須の壁を越えられず断念していると思う。本学の学情の開発アルバイトは、そのようなやる気のある学生に実務経験を積む最初のステップとして活用してもらいたい。
まとめ
柔軟に対応してくれた大学には本当に感謝してもしきれない。この大学に入ると、こんな自由なこともできるってことをもっと全面に打ち出せば志願者増える気がする。
大学生特権は強力。多分同じことを社会人になってからやっても、ここまで注目はされていないと思う。
この記事を書いた人
佐藤衡平
芝浦工業大学大学院
https://github.com/kouheisatou/CLoTH-Gossip