NPOの想いをデザインで届ける|チームCLACKで届けようVol.4
Webサイトリニューアルを機に始めたリレー記事、第4弾としてWebサイトのデザインを担当してくださった、デザイナーの はせがわるか さんに想いを綴っていただきました。
-----------------
こんにちは。
フリーランスでグラフィックデザイナーをやっている、はせがわるかと申します。 今回のwebサイトリニューアルにあたり、デザインを担当させていただきました。 私からは、CLACKとの関わりとデザインについてお話しできたらと思います。
CLACKにデザイナーとして関わること
私は大学生の頃からデザインと並行して教育の分野に興味がありました。 いつかは、デザイナーとして子どもたちの可能性を広げる活動に関わりたいと思い、教育系のイベントに足繁く通っていました。それがきっかけとなり、約1年ほど前CLACKと出会いました。
CLACKの活動に関わることは、新卒でフリーランスになった私にとっても、これからプログラミングを学んでいく高校生にとっても意味のあることです。 ほんの少しだけ先を歩く私がこうしてCLACKと関わっていることが、彼らが将来のイメージを膨らませる材料になっていれば嬉しいです。
シンプルでストレートに伝えるデザイン
デザインを行うにあたってまず一番大切なことは、背景や目的を知ること。 ということで、代表の平井さんを中心に話を聞いてみるとメインとなる目的が2つあることがわかりました。
「行政や企業など関係各所に見てもらい、活動していることを知ってもらうため」と「CLACKの魅力を伝え、寄付などのサポートを集めるため」です。 この2つを念頭に置き、デザインのコンセプトをまず決めました。 それが、「シンプルでストレートに伝える」こと。
行政の方が見た時に見やすいように、また将来支援者になり得るボランティア活動や社会課題に興味を持つ人達が馴染みやすいように、このコンセプトにしました。 コンセプトができたら、具体的にイメージを作っていきます。
ロゴのリニューアルが先に進んでいたため、出来上がったロゴにも馴染むよう進めていきます。 メインのカラーはロゴから取ってくることで、ロゴとwebサイトの一体感を持たせました。
シンプルでストレートに伝えるためには、間接的な表現やお洒落な雰囲気を作るのではなく、情報量を減らし、伝えたいものを絞っていき、重要な部分を的確に伝える工夫が必要です。
文章や構成を担当するチームから上がってきた、思いのこもったメッセージを的確に端的に伝えるため、「写真選び」「配色」「イラスト作成」「フォント選び」は特に丁寧に行いました。
配色は色の持つイメージをストレートに使い、課題の部分は暗い紺色をメインに、希望のメッセージの部分はロゴの黄色をメインに。 キャッチコピーは確実に伝わるよう、本文との大きさや太さの差をつけて写真やイラスト同様目に止まるように。
イラストはシンプルな仕様にするため、色数を少なくサイト全体と馴染ませていきます。時には、的確なイメージが作れるイラストレーターさんにイラストを頼み、全体を作っていきました。
進めていく上で意識していたことは、CLACKの伝えたいこととデザインが持つイメージのズレがないか確認を丁寧に行うこと。
写真やイラストは目に止まりやすいため、ズレたイメージで進めてしまうと多くの人にズレたまま伝わってしまう。それを避けるために、都度都度チェックとフィードバックをいただき、意見をもらいながら進めていきました。
サービス内容や伝えたいイメージとデザインのイメージをぴったりにすることは本当に難しいところですが、なるべくその差が小さくなるよう心がけてデザインを仕上げていきました。
デザインを終えて
サイトリニューアルのデザインを担当させていただいて感じたことは、役割を持ってたくさんの人が関わることの強さです。関わっているほとんどの人たちが、学生だったり社会人だったりと他の活動を持っています。
そんな中でも、自分たちのできることで少しずつ関わり、CLACKという存在ができている。私が素敵だなと感じた部分であり、強さでもあるなと。 それぞれの関わりがあり、1つのCLACKができている。
この輪の中に入って、CLACKを形作ることに貢献できて私自身すごく嬉しかったです。これからも、関われる機会があれば積極的に関わらせていただきたいと思っています。
最後にこのwebサイトを通して1人でも多くの支援者が増え、CLACKが成長していくことを心から願っております。
そして、未来でCLACKに関わる人たちも応援しております。
最後まで、読んでいただきありがとうございました!
高校生をサポートする活動を「応援したい!」と思ってくれた方は、ぜひサポーターになって頂けると本当に嬉しいです。
▼月額1000円からのCLACKサポーターになる
▼過去の記事はこちら
Vol1:プロボノとして見つめるCLACKの魅力
https://note.com/clack/n/n531af0102412
Vol2:高校生たちに提供したいもの
https://note.com/clack/n/nc267f3ac9e54
Vol3:寄付が高校生に与えるチカラ
https://note.com/clack/n/nf4cf4232ef3b