ブログ

なぜ「大学祭実行委員会」が「ウェブシステム」を作るのか —— PortalDots の存在意義と導入方法

楽しいから。

2021/05/30

こんにちは、大学祭の運営を支援するオープンソースのウェブシステム「PortalDots」を開発している Soji です。

先日、PortalDots の最新バージョンとなる PortalDots 3 をリリースし、ブログでも PortalDots 3 の新機能をご紹介しました。本記事では、大学祭実行委員会の内部でウェブ開発を担当されている委員(=大学祭エンジニア)の皆さまが PortalDots の導入や開発に興味を持ってもらえるよう、PortalDots の存在意義についてお話ししたいと思います。

そもそも PortalDots とは何か

PortalDots の紹介は、以前ブログでも書いたのですが、ここではキーワードを使って PortalDots を紹介します。

PortalDots は「大学祭ウェブシステム」

PortalDotsはスマホでの表示にも対応している「大学祭ウェブシステム」

そもそも「大学祭ウェブシステム」という言葉に馴染みがない方のほうが多いかもしれません。試しに、Google などで「大学祭 ウェブシステム」と検索してみてください。すると、いくつかの大学祭のウェブシステムが検索結果に表示されるかと思います(ここでは具体的な大学名の明言は避けます)。この検索結果に出てくるウェブサイトこそが「大学祭ウェブシステム」です。大学祭によっては、単に「参加団体向けウェブサイト」と呼んでいるところもあります。

ほとんどの大学祭ウェブシステムは、概ね以下のような機能を備えているようです。これらの機能は PortalDots も備えています。

  • ログイン・ユーザー登録機能
    • ユーザー登録の際、その大学の学生(教職員)であることを確認するため、大学が発行したメールアドレスの入力を求めるウェブシステムが多い
  • 企画参加登録機能
    • 大学祭に出展(出店)する企画の参加登録を受け付ける機能。企画の基本情報の入力フォームだけでなく、副責任者を招待 URL を使って招待する仕組みを備えているウェブシステムもある
  • お知らせの掲示・配布資料PDFの提供
    • 大学祭に参加する企画に向けて、お知らせを掲示したり、参加企画向けの会議で配布した資料のPDFを掲載している
  • 申請の回答受付フォーム
    • 大学祭当日に来場者に向けて配布するパンフレットに掲載する企画情報を募集したり、大学祭当日に大学構内へ入構する車両の情報を登録させたりするための申請受付フォーム。このフォームは、ウェブシステムにログインしないと確認できないことが多い
  • お問い合わせ受付機能
    • 参加企画からのお問い合わせを受け付けるメールフォーム
  • 実行委員向けの管理画面
    • お知らせや配布資料を掲載したり、ウェブシステムに登録されたユーザー情報や、申請の回答を確認したりできる実行委員向けの管理画面があると思われる

PortalDots は「大学祭運営に必要な情報を一元管理できるデータベース」

「場所情報管理」機能を利用すれば、大学祭当日に利用できる教室などを一元管理できる

先ほど、PortalDots は「大学祭ウェブシステム」であると紹介しました。大学祭ウェブシステムとは、つまり「大学祭実行委員会と参加企画の間のコミュニケーションを支援するウェブシステム」と言い換えられると思います。

しかし、PortalDots は単なる大学祭ウェブシステムではありません。PortalDots は「大学祭運営に必要な情報を一元管理できるデータベース」でもあります。

「データベース」の役割を果たす PortalDots の特徴として、以下が挙げられます。

  • 場所情報管理
    • PortalDots には、委員会と参加企画間のコミュニケーションとは関係のない機能もいくつかあります。例えば「場所情報管理」がその一例です。大学祭当日に利用可能な場所の一覧の管理は Excel ファイルで行っている委員会が多いと思います。しかし、Excel ファイルは自由に複製が可能なため、「どのファイルが最新の場所情報なのかわからなくなる」という問題が起こり得ます。そこで、場所情報を PortalDots に全て登録し、「PortalDots に載っている情報が一番最新である」と委員会内で周知すれば、「どのファイルが最新の場所情報なのかわからなくなる」という問題を解決できます。
  • 高度な絞り込み(検索)機能
    • PortalDots 3の新機能として「新しいスタッフモード」というものを挙げました。これこそ PortalDots の重要な機能である「データベース」を強化する新機能です。PortalDots の「企画タグ」という機能を使って、予め企画を「模擬店」「ステージ企画」のように分類しておけば、絞り込み機能を使って「ステージ企画」のみをリストアップすることが可能です。絞り込みの条件は複数同時に設定できますので、「模擬店」のうち、「5月10日以降に参加登録した企画」のみを絞り込む、といった使い方も可能です。

PortalDots は「オープンソースソフトウェア」

PortalDotsのソースコードはGitHub上で公開している

そして、PortalDots はオープンソースソフトウェア(MIT License)として GitHub 上で公開しています。PortalDots は Laravel + Vue.js で書いています。また、Fork、Issue 作成、Pull Request 作成などの Contribution も歓迎しています。

PortalDots は WordPress のように、ZIP ファイルをダウンロードし、レンタルサーバーへアップロードすることもできます。しかし、各大学祭の運営事情は異なると思いますので、PortalDots をそのまま利用するのでは機能が不足している場合もあると思います。その場合は、GitHub 上で PortalDots の Fork を作成し、各大学祭の運営に使えるようカスタマイズして利用することもできます。

何より、PortalDots は「みんなでつくる、オープンソースの大学祭運営ウェブシステム」です。PortalDots の機能不足やバグを見つけたら、ぜひ IssuePull Request をお寄せください!皆さまの Contribution をお待ちしております!PortalDots のコントリビューションガイドラインはこちらです。

なぜ「大学祭」で「ウェブシステム」を作るのか

「大学祭ウェブシステム」を作ることによって、大学祭の運営を IT 化することができ、業務を効率化できます。とはいえ、わざわざ自前でウェブシステムを構築しなくても、既存のウェブシステム—例えば Google Forms やキントーンなど—を組み合わせて利用することで、大学祭の運営の IT 化は達成することができます。

それでもなぜ、自前で大学祭ウェブシステムを構築する大学祭が増えてきているのか。異論はあるかと思いますが、私は「楽しいから」だと思います(もちろん、既製のウェブシステムを導入する予算的な余裕がない、という理由もあり得ます)。

あくまで私の話ですが、大学祭ウェブシステムというニッチなプロダクトを開発するにあたり、必要な機能の洗い出しや UI の設計、そしてプログラムを書いて形にしていく、この一連の流れが楽しいと思っていました。インターネット上に参考になる情報が少ないからこそ、全て自分で考えていくプロセスを楽しんでいました。

では、なぜ自前でウェブシステムを作ることよりPortalDotsの導入を勧めたいか

既存のウェブシステムを導入するより自前のウェブシステムを構築するのは、「楽しいから」という意見を述べました。それでも、私は PortalDots の導入を勧めたいと思っています。これは、矛盾しているように見えます。

PortalDots の導入をお勧めしたい理由は、主に 2 つあります。

理由1. PortalDotsのコードをベースにして「本当にやりたかったこと」の開発に専念できる

PortalDots には、大学祭ウェブサイトに必要な機能+αが既に揃っている

PortalDots は「オープンソースソフトウェア」です。PortalDots は GitHub 上で公開しています。Fork して利用することもできますし、Pull Request などの Contribution は大歓迎です。

大学祭実行委員会はプログラミングサークルではないので、コードを書くことができる人が実行委員会へ加入するのはとても珍しいことだと思います。委員会内で大学祭ウェブシステムの開発を担当しているのは 1 人だけ、という状況もありえます。

1 人でもくもくと大学祭ウェブシステムを開発するのは楽しいと思います。しかし同時に、実行委員会内部からのニーズに応えていく責務もあります。先ほど述べた通り、大学祭実行委員会はプログラミングサークルではないので、「やりたいことだけをやる」では不十分です。実行委員会内部からのニーズに応えるための開発に専念するあまり、大学祭ウェブシステムの開発で「本当にやりたかったこと」をやる余裕がなくなることは十分にあり得ます。これは本当に楽しいでしょうか?

PortalDots は、先ほど述べたように、大学祭ウェブシステムに必要な機能+αが既に揃っています。面倒なクロスプラットフォーム対応も既に行っており、スマホ、Chromium Edge、Chrome、Safari、Firefox に対応しています(スマホでは一部機能に制限があります)。

PortalDots を導入すると、1 から大学祭ウェブシステムを開発するような楽しさは味わえないかもしれません。その代わり、開発リソースの大きな余裕や、既にできているウェブシステムを自分が好きなように拡張していける余地があります。半ば義務的にコードを書くという状況にはなりにくいと思います。ぜひ、PortalDots を土台に、本当に作りたかった最高のウェブシステムを作っていただければと思います。

理由2. 離れた世代間でのウェブシステムの引き継ぎをPortalDotsが担う

大学祭実行委員会の内部でウェブシステムを開発する際は、次の世代へウェブシステムを引き継ぐことも考える必要があります。そうでないと、ウェブシステムをメンテナンスできる委員が引退した後、ウェブシステムを廃止し、従来の運用フローに戻さざるを得なくなります(これも大学祭運営の醍醐味であるという意見は否定しません)。その上、せっかく労力をかけて開発するウェブシステムなので、後の世代にも引き継いで欲しいと少なからず思うのではないでしょうか(開発者のエゴかもしれませんが)。

PortalDots の導入に加え、PortalDots の開発に少しでも参加していただければ、PortalDots はそのコードを後の世代にも引き継ぎます。マニュアルはオープンソースとして整備し、情報が古くならないように可能な限り努めます。そうすれば、ウェブシステムの開発者が委員会に所属しない状態になっても、PortalDots の導入を継続できます。さらに後の世代になって、ウェブシステムの開発ができる人が委員会に入れば、世代を超えて PortalDots の開発を継続できることになります。

また、PortalDots の開発に参加すれば、自分の大学祭だけでなく、他の大学祭でも同じ機能を使ってもらえるかもしれません。自分の知らない大学祭で使ってもらえるかもしれないと考えると、少しワクワクしませんか?

PortalDotsを導入する2つの方法

ここまで PortalDots とは何かについて説明してきました。ここからは PortalDots を導入する方法を説明します。

方法1. ZIPファイルをサーバーにアップロードする (WordPressライクな方法)

Cyberduck(FTPソフト)でPortalDotsのファイルをアップロード

PortalDots の機能をそのまま使いたい場合や、もし PortalDots の機能不足を感じても PortalDots へ直接 Pull Request を送ればいいやと考えている場合にお勧めの方法です。

PortalDots のマニュアルでは、本記事投稿時点で「ロリポップ!レンタルサーバー」と「コアサーバー」に PortalDots をインストールする方法を 1 から紹介しています。また、これら以外のレンタルサーバーであっても、PHP 7.3 以上、MySQL 5.6 以上、Apache (または LiteSpeed) がインストールされているサーバーであれば PortalDots を利用できます(PortalDots 公式サイトなどでは MySQL 5.7 以上が必要と書いていますが、お知らせの参加企画向けの全文検索機能が使えないことを除けば MySQL 5.6 でも動作します)。

具体的なセットアップ方法はマニュアルをご覧いただくとして、PortalDots のセットアップ方法を大まかに説明すると以下のようになります。

  1. PHP 7.3 以上、MySQL 5.6 以上、Apache (または LiteSpeed) に対応したサーバーを用意する
  2. サーバー提供会社のマニュアルを参考に、メールサーバーやデータベースサーバーの設定(ホスト名、パスワード、ポート番号など)を確認する
  3. PortalDots をダウンロードし、ZIP ファイルを展開する
  4. FTP ソフトなどを利用して PortalDots をサーバーへアップロードする
  5. アップロードした PortalDots の URL にアクセスし、表示されるインストーラーの指示に従う
  6. インストールが完了したら、メール配信を利用できるように CRON の設定をする (レンタルサーバー会社によって設定方法が異なります。詳細は PortalDots の LINE 公式アカウントまでお問い合わせください!)

方法2. PortalDotsをForkしてカスタマイズする

Fork ボタン

PortalDots を導入するもう 1 つの方法は、PortalDots を GitHub で Fork した上でカスタマイズしたものを利用する方法です。こちらは Git や GitHub、カスタマイズするためには Laravel と Vue.js の知識が必要です。

この「方法2」は、まだ PortalDots のマニュアルに掲載できていないのですが、わかる人に向けて方法を大まかに説明すると、以下のようになります。(かなり大雑把に書きました。わからないことがあれば、気軽に PortalDots の LINE 公式アカウントまでお問い合わせください!)

  1. PortalDots の GitHub ページにアクセスし、画面右上の「Fork」ボタンをクリックしてリポジトリを Fork する
  2. PortalDots の GitHub ページにある README を読み、開発環境をセットアップする
  3. Fork した GitHub リポジトリに対してコードをカスタマイズする
  4. composer installyarn installyarn prod を実行し、生成されたファイルも含めてサーバーへアップロードする
  5. 本家 PortalDots のリポジトリの新しい変更を取り入れるには、Fork 先のリポジトリのページにある「Fetch upstream」機能を実行する

PortalDots は、既に必要な機能を備えた大学祭ウェブシステムであると同時に、全ての大学祭プログラマーの「本当にやりたかったこと」を実現する場でありたいと思っています。1 から作るからこその楽しさというものもありますが、既にできているものを拡張していく楽しさというものもあると思います。

興味がある方がいましたら、GitHub での Issue や Pull Request の作成、または PortalDots の LINE 公式アカウント私の Twitter までお声がけください!

最後までお読みいただきありがとうございました。

Takahashi, Soji

エンジニア、UIデザイナー。 サブスク管理アプリSubma 学園祭運営支援ウェブシステムPortalDots などを開発している個人開発者です。 もっと詳しく