企画番号：１０
企画タイトル：拡張機能の用いた manaba course
およびポータルの改善

活動報告書No.10 manaba 機能改善制作

Y200309脇 耀鋭

Y202003 クアン ダフィド
Y200500平西 美穂

概要
1. 活動目的および背景
当活動では、龍谷大学や他大学でも用いられている manaba に目を付けた。様々な機能が存在する manaba を、感覚的・視覚的にわかりやすくすることによって、新入生も在校生にもさらに使いやすくすることで、円滑な大学生活を送ることを目的としている。
2. 計画(1) レポート・テスト締め切りの期限時間による一覧色分け(2) 拡張機能におけるポップアップ表示/通知数の表示(3) manaba の時間割における 1Q、2Q のコース一覧での選択分け(4) アコーディオン UI により、視覚における情報の削減(5) manaba からポータル/シラバス/龍谷大学 HP に飛べるようにリンク設定(6) ドラッグアンドドロップでファイルアップロード
3. 方法・経過
当活動では、manaba の機能を増やすために、chrome の拡張機能を用いて行う。
各機能のコードを作成するにあたって manaba ページのソースコードを調べ、ネットを活用し、必要な知識を学習しながら作成を行う。機能のほとんどは manaba ページにコードを追加していく形になるため、web ページから情報を取る、スクレイピングが必要不可欠となる。
3. 成果
計画上で上がっていた案の 5 以外のすべてを実装することが可能となり、誰でも制作したサイトから拡張機能をダウンロード、利用することが可能となった。
4. 総括
メンバーの誰もが拡張機能制作に未経験だったため、手探りの状態であったが、ネットから情報を探す、また、大学で学習したことを生かし、目に見える成果として結果を残すことが出来た。

1

報告書
1. 活動目的および背景
manaba とは、授業支援システム（LMS）であり、その「シンプルで使いやすい機能」は、学生視点から見ると、直感的に使いやすいが、逆にあれば便利な機能もないのがわかる。
そこで、当活動では、龍谷大学や他大学でも用いられている manaba に目を付けた。様々な機能が存在するこの manaba を感覚的・視覚的にわかりやすくすることによって、新入生も在校生にもさらに使いやすくなる。最終的に、円滑な大学生活を送ることを目的としている。
2. 計画
当活動では、知能情報メディア課程、電子情報通信課程、応用化学課程という、課程の違うメンバーが揃っている。そのため、はじめのミーティングで拡張機能の方向性、及び内容を決めた後に、各々するべきことを記述していく形で進めていく。
(1) レポート・テスト締め切りの期限時間による一覧色分け(2) 拡張機能におけるポップアップ表示/通知数の表示(3) manaba の時間割における 1Q、2Q のコース一覧での選択分け(4) アコーディオン UI により、視覚における情報の削減(5) manaba からポータル/シラバス/龍谷大学 HP に飛べるようにリンク設定(6) ドラッグアンドドロップでファイルアップロード
以上のような拡張機能を manaba に追加することによって、学生生活がより豊かになるものだと考えた。基本的にシステム構築部分は、脇、ダフィドが行っている。その他、平西は、簡単なシステム部分やポップアップデザイン等を担当する形で本活動を行うことになった。
本活動は、必ず月 1 でのミーティング時間を取っている。それまでに前回定めた個人の課題を行い、一人で解決できない点や、相談すべき点をそのミーティングで話合う、という流れを取って行った。
3. 調査方法
追加する機能を決めるにあたり、まずアドバイザーが事前にアンケートを取った結果を参考にメンバーで決定。その後、chrome の拡張機能を用いて作成を行う。
2

この作業では、各機能のコードを作成するにあたって manaba ページのソースコードを調べる必要があり、自らの知識で補えないものはネットを活用し、必要な知識を学習しながら作成していた。機能のほとんどは manaba ページにコードを追加していく形になるため、web ページから情報を取る、スクレイピングを行いつつ、作業を行っていった。
4. 活動経過〇 1 回目のミーティング
拡張機能で出来ることをメンバー間で出し合い、本活動で行うことの流れを決定。
〇 2 回目~4 回目のミーティング
表 1 活動内で個々の担当
脇・レポート・テスト締め切りの期限時間による一覧色分け
・manaba の時間割における 1Q、2Q のコース一覧での選択分け

・ アコーディオン UI により、視覚における情報の削減
ダフィド

・ 拡張機能におけるポップアップ表示/通知数の表示
・ manaba からポータル/シラバス/龍谷大学 HP に飛べるようにリンク設定・ ドラッグアンドドロップでファイルアップロード

平西・計画/(1)、(2)、(3)における表示デザインの決定。
・ポスターセッションの際に公開するサイトのデザイン決定。
・拡張機能としてのアイコンの設定。
・ポスター/報告書の作成。
・その他、細かな css などの学習による、manaba ページにリンク添付のボタン作成

以上のような形で三か月、一か月ごとのミーティングで進捗を話し合う形で活動を進めていった。
〇 5 回目のミーティング
ダウンロードサイトを開設する準備を始めた。学園祭で展示するポスターや、学生にとっての必要な機能の再確認、また、自分たちの技量でどのくらいが出来るのかを確かめ、ポスター作製に取り掛かった。
3

5. 成果ポスターセッションでさらにわかりやすく理解してもらうために、サイトを作成。以下から、ダウンロードも可能にしてある。
ダウンロードサイト：https://exm.waki.tech/※ポスターセッション時には、ウェブストアの申請が通過できず、github でβ版を配布することとなった。現在は申請を通過したため、上記のダウンロードサイトから閲覧、ダウンロードが可能。
以下、制作した機能についての詳細・実装例を記述。
(1) レポート・テスト締め切りの期限時間による一覧色分け
期限が近くなると、緑→黄色→赤に変化する。色の変化は、以下のようになっている。

赤：期限まであと 1 日。
黄：期限まであと 3 日。
緑：期限まであと 7 日。

図 1 期限色分けの表示(2)拡張機能におけるポップアップ表示/通知数の表示

manaba を開いていなくてもブラウザから拡張機能のアイコンから通知数の確認をすることが可能。また、通知のポップアップから manaba、及びポータルサイト、龍谷のプリントアウト機能のウェブページに飛ぶことが出来る。
こちらも(1)と同じように、期限で色分けされるようになっている。
図 2 ポップアップの表示4(3) manaba の時間割における 1Q、2Q のコース一覧での選択分け
manaba の時間割の上部分に、今までは前期後期のみしか行うことが出来なかったが、クオーターで時間割が条件付けされるように設定。但し、クオーター分け導入は龍谷大学では、先端理工学部のみなので、その学部生が利用するものとして制作をした。
図 3 クオーター分け表示(4) アコーディオン UI により、視覚における情報の削減
manaba 上にある「お知らせ」などの欄を枠に含まれた記号を押すことで収納が可能となる。全て閉じることによって、manaba ページが情報を整理された状態で利用することが出来る。

図 4 情報の削減の具体的表示(5) manaba からポータル/シラバス/龍谷大学 HP に飛べるようにリンク設定
ポータル、シラバスは、manaba のページではなく、ポップアップから飛べるようにリンクを設定したが、シラバスは時間でセッションタイムアウトしてしまうため、リンクを設定することが難しく、当活動では作成が出来なかった。

5

(6) ドラッグアンドドロップでファイルアップロード
提出物を「ファイルを追加」からする必要はなく、ファイルからドラッグで選択することが可能になった。変わらず、「ファイルを追加」ボタンからでも追加することは可能。

図 5 ドラッグアンドドロップ表示

6. 総括
拡張機能というものにあまり触れていない学生でもわかりやすくダウンロード出来る仕様となっている。内容は、2.計画で記述されている(5)以外の機能すべてが含まれているものとなった。
(5)で出来なかったことは、manaba とシラバスをリンクさせることである。シラバスは２時間でタイムアウトしてしまうことや、そのために、URL がサインインからサインアウトまでの時間で管理されていることでリンクが変わってしまうことにより、manaba との紐づけが難しいと結論付けた。
しかし、制作においては、拡張機能制作がメンバーの誰もが未経験だったことや、拡張機能そのものが最新版になっていたこともあり、あまりデータがなく手探りの状態から、5 つの機能を付けられたことは大きな成果と言えよう。自分たちで考えなければならないところも多かったが、その中で、大学内や個人で学習したことを生かし、目に見える成果として結果的に残すことが出来る結果となった。
7. 参考文献[1] 「manaba Enhanced for Tsukuba」
https://github.com/mkobayashime/manaba-enhanced[2] 「manaba +R++」
https://github.com/ygkn/manaba_R_incremented

6