webデザイン未経験者が、dp9の五月祭で診断サイトのトップページを作ってみた話

こんにちは、2020年入会、東大1年のsatoです。冬ですね。寒くなりました。秋はもういなくなってしまいました。うう…。

さて、私がdp9の五月祭に参加したのは、もちろん風薫る五月…、ではなく、残暑厳しい九月のことでした。五月祭はコロナで延期、そしてオンライン。普段とは違う五月祭に、先輩方が苦慮されているのがわかりました。先輩方、ありがとうございました。この記事では、webデザイン未経験の私が、dp9のオンライ五月祭の企画の1つ、「色のメリハリ×デザイン展」のトップページを作った様子をお伝えします。お付き合いくださいまし。

と、その前に1つだけ。きっと皆さん、こう思われたのではないでしょうか。

webデザイン未経験ってどうせ謙遜でしょ？

いいえ違います違います。断じて違います。むしろ、私はデザイン自体をほとんどしたことがありません。私がデザインに興味を持ったのは、受験が終わってから、つまり2020年3月のこと。高校生の時は、デザインのデの字も知りませんでした。UIって何？　とか、デザインの4原則って何？　とか、そういうレベルで知りませんでした。dp9に入ってからも、企画のブランディングを少ししたことはあれど、webとか紙媒体のデザインをしたことはなく、まさにこの五月祭が、私の初めてのwebデザインだったのです。

「色のメリハリ×デザイン展」って何?

いよいよ本題に入りましょう。五月祭です。dp9では「メリハリ×デザイン展」と題して、4班に別れ、それぞれメリハリと、鳴き声、昔話、UI、色のいずれかに関するwebサイトを作りました。私は色班に所属していました。色班では「色のメリハリ×デザイン展」として、2つの企画を行いました。1つは、質問に対してお客さんの選んだ色に応じて、お客さんのメリハリ度を測定するもの。

私のメリハリ度は32%でした。低いですね。「思い切って、部屋の中の要らない物を捨ててみませんか?」厳しいですね、刺さります。

もう一つは、テンション、シチュエーション、場所に関する質問に対して様々なお客さんが選んだ色を瓶に貯めていくというもの。

瓶が素敵ですよね、いい形してます。

この2つの企画を行う「色のメリハリ×デザイン展」、そのwebサイトのトップページを、私が作ったんです。こんな感じ。

とりあえず作ってみた

色班では、webサイトの各ページを5人で分担して作ることになりました。そこで私はトップページを作ることを選びました。なぜなら、簡単そうだったから（笑）。考えてみてください、トップページ以外は、選択肢を選ぶボタンとか、診断結果表示部分とか、トップページに戻るボタンとか、色々付けなきゃいけなくて大変そうじゃありませんか？　それに比べて、トップページ。ボタンは、各企画に飛ぶ4つのボタンしか要りません。楽そう。
という訳で、作り始めました、トップページ。作るといっても、良い方法を知っている訳ではないので（未経験者だから）、適当な方向に突っ走るまでです。そうするしかないもんね。開き直りました。まず、展示とか展覧会といえば、美術館で、ホワイトキューブかな、と思って作ったのがこれ。

どうでしょうか？　どうって、素人の感覚だけで作っているんですからね、伸びしろだらけですよね（笑）。

洗練されていく

先輩からフィードバックをいただきました。まず、下のパレットの方が良いとのことでした。気になる点は、3つ挙げられました。1つ目に、タイトルのある部分とボタンのある部分が同列に見えてしまうこと。確かに。なんというか、言われてみればそうだった、というのは一番実力差を感じる指摘ですよね。次に、ボタンに色が付いていると、各企画でお客さんが選ぶ色に影響が出るのではないかということ。例えば、ボタンが青いと、お客さんも青を選びがちになるとか。これには、思わず唸ってしまいました。なぜなら、私が最初に作ってみたときには、お客さんの使用する状況を考えもしていなかったから。そして最後に、ボタンのホバーを考えること。webサイトって動くのでしたね、そういえば。作っているときには考えもしませんでした。
という訳で、作り直しました。それがこれ。ボタンのホバーは、白から灰への色の変化としました。

そして最後に、先輩の手直しが加わって、完成したのがこれです（再掲）。

パレットの手を入れるところや、パレット上の絵の具をイメージした色の部分は、お客さんを惑わせてはいけないということで無くなりました。また、トップページに続くページとの兼ね合いも考えて、webサイトの背景は薄い灰色に。

千里の道の一歩目

こうして私はトップページを作った訳ですけれど、振り返れば、本当に作れて良かったと思っています。というのも私は、初めてのこととなると、どうしようどうしようと悩むばかりの質なのです。何かきっかけが無いと何にも始められやしないのです。なので、この五月祭で、とにかく一つ作らせてもらえて、さらにフィードバックまでいただけたことは本当に良かった。千里の道の一歩目を踏み出せたかな、といった感じですね。
実は、今回の五月祭は、コロナの為に、準備期間がとても短かったのです。それにも関わらず、何も知らない私にトップページを作らせてくれた先輩方に、改めて感謝です。そして、いつか私もデザインが上手くなって、dp9に貢献できるようになるといいですね（望遠）。

文: sato（東大,2020入部）