ムサラボの公式Webサイトが2024年4月1日に開設されてから早4ヶ月。
本日、8月19日にWebサイトを新しくしました。
この記事では、どのようにしてリニューアルするに至ったのか解説します。
何故Webサイトをリニューアルする必要があったのか？
元々のWebサイトはSTUDIOで主にmasakiさんが作成してくれていました。
STUDIOは通常無料で使うことができますが、このWebサイトには制作したゲームの画像などをたくさん入れる必要があり、これ以上画像を挿入すると無料の範囲を超えてしまうことが判明いたしました。
Webサイトを今後も運営する以上、画像を増やさないわけにはいきません。
しかし、一介の大学生にとってSTUDIOの有料プランは非常に高く、手軽に手を出せるものではありませんでした。
そこで、ムサラボでプログラマをしている私Miriが新しくWebサイトを作り直すことになりました。
どのように作成したか
4月〜
問題が出た当初は、Web開発によく利用されるフレームワーク（Vue.jsやReactなど）のうちからどれか選択して作ることを検討していました。
そのため、HTML、CSS、JavaScriptを学びながら元々のWebサイトの模倣サイトを作っていました。
その時に作成したデザインカンプ（完璧なものではありません）はこちらになります。
しかし、そうしているうちに以下の疑問点が生じました。
- 何度も記事を投稿できるようなサイトを構築できるのか
- 複数人で記事を投稿できるようなサイトを構築できるのか
- 上が可能だとしても、記事を執筆する人にもコーディングの知識が必要になるのではないか
私は普段はゲームを制作しておりWeb関係の知識に厚いわけではなかったため、考えていた方向性では上の疑問点が解決できるように思いませんでした。
また、ムサビゲームラボはゲーム制作サークルですが、ほとんどの人はグラフィッカーとして活動しており、コードを書ける人ばかりではありません。
これらの状況から、WordPressを使用することにしました。
8月〜
大学も夏休みになった8月5日からWordPressを学習し、ムサビゲームラボのWebサイト用テーマを自作いたしました。
まず、後々WordPressを使用することを見越した書き方で、HTML、CSS、JavaScriptを使用してWebページを複数作成しました。
飛べないひつじさんには、この時にCSS関係で私が解決できなかったバグを直していただきました。
本当に感謝しています。
その後、ローカル環境を構築し、HTMLをPHPに書き直す形でオリジナルテーマを制作いたしました。
WordPress側が勝手に設定するクラスの影響を受けて思ったようなレイアウトにならなかった部分は、検証ツールを利用して1つ1つ修正していきました。
部員のみんなが記事を投稿しやすいサイトを目指して
双子の妹であり、ムサラボのメンバーの壺華（Yuri）に本番環境でのWebページの制作をしてもらいました。
これにより、妹のようにコードが書けない人でもムサラボらしいWebページを構築できることを確認しました。
遂に公開へ
8月19日までほぼ不眠不休で制作し、結果としてこのようにリニューアルすることができました。
ムサラボに所属する皆さんの画像をたくさん載せることができて、とても嬉しく思います。
今後も新しくなったWebサイトからどんどん情報を発信させていただきますので、お楽しみに！