チェンクロ非公式WEBオンリーイベント「義勇軍大芋煮会」の告知サイトを制作させていだだきました。

サイト概要
・イベントの情報配信、情報まとめ系サイト
・イベント当日はピクリエさんと同時に、こちらのサイトも会場として使用
・主催者様が更新できるシステムを構築

担当した部分
WEBデザイン、コーディング、システム構築（ＣＭＳ）、セキュリティ対策など
華やかなメインイラストはいぬきちさん作です！
動く灰の骸ちゃんは、いただいたイラストを元にgif動画にしました。

サイトはこちら

 

初校デザインと趣意

●レイアウト

内容は範囲を絞って中央に寄せたレイアウトにしています。
これはスマホとPCで見た目の差異が少なくなるため ページを更新した際に、確認・調整の手間が省けるかと思います。

●デザイン

イベントなのでシンプルになりすぎないように…とは思いましたが、 灰の骸くんを入れると思ったより賑やかになったので、 他の部分はスッキリとさせて内容の見やすさを優先しました。 実際のブラウザ上ではそこかしこに動きを取り入れて ドンチャン感（？）を出そうと思っています。

●ナビゲーション（右側のリンク）

クリックで該当の箇所まで下にスクロールします。 このナビゲーションの項目名は編集可能、追加も可能です。 細かい詳細ページをまだ整理しきれていないので、項目名は変えるかもしれません・・

 

サイトの更新方法　解説動画（提供用）
※本人音声による説明です。ご注意ください

 

特設サイト専用イベント会場ページ

・イベント開催時のみオープンする会場ページ
・サークル参加者と配布物などを一覧で表示

こちらは主催者様よりご提案いただて作成した、ピクリエ会場が上手く利用できない方などに向けた会場ページです。

提案イメージ

お品書きボタンクリックで、サークル情報をポップアップ表示

これにより、ページを遷移せずにサークル情報を全て確認することができます。
ピクリエに登録してない方でもイベントを楽しめるという、とても面白いご提案でした！

 

サークル情報編集システム

サークル参加者は各自管理画面よりサークル情報を編集することができます。

管理画面は無駄な情報を省いてシンプルにしたつもりです。
サークル参加者さんはピクリエの方も編集する必要がありましたので、なるべく似た仕様、項目を取り入れました。

ただピクリエさんのお品書き設定は「画像orテキスト」で選べましたが、テキストを選んだ時の情報量が、個人的に少ないな～と感じました。
１商品毎にサムネイル画像などの項目を追加、それを10商品まで登録することができます。

 

交流掲示板の設置

こちらも主催様からのご提案で、画像を投稿できる掲示板を設置しました。

・画像は1コメントにつき１枚までアップロード可能
・メールアドレスを入力して「返信があった場合通知する」にチェックを入れた場合、返信時にメールが届きます
・サークル参加者のみ管理画面からアイコン（アバター）、メールアドレス、サイトを予め設定しておくことができます。

なるべくシンプルで使いやすい掲示板を目指しました。

 

感想

芋煮会は今回で3回目だったので、今までの告知方法を念頭にサイト構造を考えました。

主催者様にとりあえず必要だと思う情報ページを追加してもらい、それで増えすぎたとしても、
後から簡単に整理もできるような仕組みを想定しています。

自分は更新のしやすさやサイトの見やすさを重要視するタイプで
映えるデザイン考えるのは苦手なんですよね…味気ないかもしれない…
デレステみたいなコテコテしたの憧れる

作ってみたかった告知サイトが作れて楽しかったです！
ありがとうございました！

 

追記

会場ページと掲示板は後付けで構築させてもらいました。
大変だったけど楽しかったな…

主催様には確認作業とかすごく手伝っていただきました。
スマホだと文字被ってるぞ～とかね、見つけてもらって。
全デバイス幅考慮するって大変なんですよね…！拘りたい部分でもあります。

イベント当日はサイトを「見やすい」とか「凄い」っていうお声をいただいて大変うれしかったです。
ご利用いただきありがとうございました！