見出し画像

満天の星が降る夜空をかける彗星へ、ありったけの祝福を。

すいせいこーど

こんにちは、プレセぺです。

この度星街すいせいYouTubeチャンネル100万人達成記念寄せ書きウェブサイトのデザインを担当させていただきました。

この場をお借りしまして、サイトを制作するにあたって考えていたことや完成までの経緯などお話できればと思います。

はじまり

星街すいせいがもうすぐ活動3周年を迎え、寄せ書き冊子企画の制作が佳境に入った3月の初め頃から、私達は来る彼女のYouTubeチャンネル登録者数100万人達成に向けてなにかできないかと、構想を練り始めました。

そんな時、ふと思い出したのが以前50万人記念の時に制作のお手伝いをさせていただいたファンサイト。オンライン形式の寄せ書きページが併設されていて、そこに行けばいつでもみんなが贈ったメッセージを読むことができる、というものです。

メインサイトはすいせいこーどの中長期企画としてリニューアルする予定になっていますが、それとは別で100万人記念の寄せ書きサイトを作るのも面白そうだ、という風にすんなり決まりました。

ただ、やるならあの時にはなかったことをやりたい。できれば前回よりもっとすごいものを作りたい。

そんな思いから、動的サイトの構想を最初の打ち合わせ段階でミリナノさんより提案されました。掲示板みたいな感じで、いつでもメッセージを贈れるようにするという考えです。

いままでの寄せ書き制作では、メッセージの配置作業が一番時間掛かりました。メッセージと送った人のニックネームやアイコンが合っているか確認しながら、一個一個手動でメッセージ枠に配置していくしかありませんでした。そのため寄せ書きメッセージの募集には締め切りを設けるしかありませんでした。

それを解決するために、私達はいつでも参加できる寄せ書きを作ることにしました。そして、バックエンドの構築にはほーせんさんが担当し、今までにないオンラインならではの寄せ書きを実現してくださいました。

画像6

サイトデザイン

寄せ書きサイトをデザインするにあたって、一番最初に取りかかった作業は全体の方向性と雰囲気を決めることでした。

すいちゃんの100万人達成をお祝いするために、すいせいこーどでは寄せ書きサイトとは別で、記念動画を作る企画があります。（こちらの動画まだ制作中ですが、本当に素敵なクリエイター陣が集まっていますので、完成をとても楽しみにしています。）

せっかく２つお祝い企画をやるのですから、完全に分けるのも勿体ないと思い、記念動画の内容や要素をちょっとだけ取り入れてみました。動画に載るフレーズやイラストなどを使わせていただいて、それを軸にメインカラーや使用する書体も決めていきました。

画像1

全体的に柔らかい色合いをベースに、ちょっとだけかっこよさもあるポップな雰囲気を目指しました。また可愛らしさを意識して、直角要素をあまり入れすぎないよう意識してビジュアルを決めました。

イラストは候補としてすいせいこーどオリジナル衣装とノンストップ・ストーリーアイドル衣装の二パターンがありました。どっちもすごくかわいくて悩みましたけれど、最終的にサイト公開時はアイドル衣装を使うことにしました。

画像2

制作するにあたって最も気を付けたのは、どんなウィンドウで開いたとしても綺麗に見えるようにすることでした。サイトをデスクトップ画面で見る人もいれば、タブレットやスマホで見る人もいます。人によってそれぞれ見ている環境が異なりますから、どんな状態でも気持ちよく見れるようにレイアウトをまとめました。

画像3

寄せ書きのメッセージフレームのデザインには特に時間を掛けて慎重に行いました。メッセージやイラストと合わせた時くどくならないように、そして画面いっぱいにメッセージが並んでいても目が疲れないように、バランスと余白を整いました。手作業の組版とは違い、今回メッセージの配置はコードで行いますので、文字数やアイコン・イラストの有無によらず、綺麗に表示されるように作りました。

サイトの背景には「満天の星が降る夜空をかける彗星へ、ありったけの祝福を。」「天球にきらめく青い光が、いつまでも輝き続けますように。」二つのフレーズに合わせて星図を作りました。個人的なこだわりポイントは上下二層に分かれた構造ですね。アニメーションの回転スピードは特に気合を入れて調整しました。

フロントエンドの面では特に色々細かい注文をしたりと、コーディングを担当していただいたセラさんにはご無理なお願いを沢山してきたと思いますが、いつも丁寧に対応していただいて本当に感謝しかありません……！

画像5

画像6

最後に

思い返せば、すいちゃんの100万人達成をお祝いしたくてただただ一生懸命作りましたが、新しい試みにチャレンジしたり、今までの寄せ書き企画とは違う部分も多かったので、最後まで手探りの連続でした。

寄せ書きサイトが公開され1週間が経とうとしています。沢山の方が参加し、メッセージを贈ってくださいました。みんなのメッセージを読みながら、感謝の気持ちと嬉しさを噛み締めています。

すいちゃんと星詠みの皆さんにとって、私達が作ったプレゼントが素敵なものでありますように。この寄せ書きサイトを通して、皆さんの言葉と想いが少しでもすいちゃんに届けられたら嬉しいです。

2021年7月13日
プレセペ@Praesepe5011


いいなと思ったら応援しよう！