SHARE

NPO・団体のWEBサイトデザイン5選

spiqa_design

2023.11.24

こんにちは!コーダーのぶんちゃんです。

みなさんは、ご自分のサイト・もしくは企業のサイトを見てもらうことで、どんなことを伝えたいですか?
Webサイトを作る際には、目的や方針を明確にしておくことで、より目標を達成するために効果的な構成やデザインを制作することができます。
そして、その方針がとても視覚的にわかりやすいのが、「NPO・団体」のWebサイトです。

「NPO」とは社会貢献活動を行い、その収益を団体のメンバーに支払うのではなく、社会貢献活動にあてる団体の総称です。
まちづくりや環境保全などのさまざまな分野で、営業目的ではなく、あくまで社会に貢献することを目標としたメッセージ性の強いサイトが多いことが特徴です。


今回はNPO・団体のWebサイトを5つご紹介します。

BOLD

公式サイト:https://b-o-l-d.jp/

BOLDは、既存のルールに囚われない価値観や、制約から解き放たれた考え方を、アート、テクノロジー、野外活動の世界に求め、もっと自由に生きるための手引きとなるウェブメディア。

名前の通り、とても大胆な印象のデザインです。
記事が掲載されているサイト、いわゆる「オウンドメディア」というものです。こういったサイトの場合は、記事の内容を届けたいので、等間隔に記事が配置されるよう整頓されていたり、読みやすさを重視することが多いです。
しかし、こちらのサイトは「型にはまらない」ことが、既にこのサイトのコンセプトを体現していますね。写真が枠からはみ出ていてもいい、ボタンが縦でもいい。デザイン面ですら、こうであってもいいのかと、新しい感性に触れられるようなデザインです。すごい!

SFコミック『Between Two Normals』feat. MINAMI KITAMURA by NARRATIVE LAB

公式サイト:https://nrlab.org/

ナラティブ・ラボは、企業の垣根を越えた創発型のコミュニティー・プロジェクトです。今後起こりうる未来の世界を漫画で定義し、読み手が議論をしていく・コミュニティーを広げていくことを目的としています。

Webサイトの画期的な使い方だと思いました。
最初の導入で、プロジェクトとサイトの使い方の説明があり、(私はこのプロジェクトのことを何も知らずにこちらのサイトを見たので)最初こそ戸惑いましたが、漫画という視覚的にわかりやすい形で問題を定義して、SNSのシェア機能を使用して議論を広げるという狙いはしっかり網羅されている構成と思います。
未来のテクノロジーを想起させる周波数のようなアニメーションもかっこよく、漫画の配色ともよくマッチしています。

TAKS

公式サイト:https://taks-task.jp/

TAKSは、地域の宝である文化財の魅力や物語を発信するオウンドメディアです。

オープニングアニメーションがまず印象的で、「TASK」から「TAKS」に変わります。「文化財を楽しみ 未来に託す」というキャッチコピー同様、ロゴに矢印を加えることで世代から世代へ「託す」という意味も込められていそうですね。

全体のデザインはまるで海外の新聞のようなアンティークな雰囲気がありますが、私のお気に入りは文字の大小の差が(ジャンプ率といいます)がとても大胆な点です。英字も取り入れることで古臭くならずに、モダンな雰囲気になっているので、未来への橋渡しとなるサイトとしてぴったりですね。

みらいたうん ~SDGsとユカイな17のなかまたち~|セブンパーク天美

公式サイト:https://amami.sevenpark.jp/sdgs/

セブンパーク天美のサイト内にある、子供たちにSDGsについて知ってもらうためのサイトです。

絵本がそのままWebサイトになったようなかわいらしいデザインですね。ボタンなども全てイラストで、繊細なテクスチャはポップでかわいらしい世界観を大切に守っています。
見てもらうのは子供たちなので、上部にあるメニューはひらがなとカタカナ、漢字にはルビがふってあります。身近な例から学べる動画のコンテンツもあり、これならSDGsについて楽しく知ることが出来そうですね。

フェリシモの基金活動│フェリシモ

公式サイト:https://www.felissimo.co.jp/gopeace/fundreport/

生活雑貨などを販売しているフェリシモの基金活動に関するページです。

こちらのページがあることで、主に2つの効果が挙げられます。
①企業として基金活動を行っていることを伝えることができる
②さらなる参加を促すことができる
様々な内容の基金活動をイラストで表現しており、全体のアイコンとしても使用していることで統一感がありますね。配色もカラフルですが、イラストとトーンもマッチしていて素敵です。

まとめ

今回はNPO・団体のWebサイトを5つご紹介いたしました!

Webサイトによって目的も方針もさまざまでしたね。
さて、では改めて、みなさんはみなさんのサイトを見た方に何をしてほしいですか?
今回の記事が参考になったら嬉しいです。

サイト制作・リニューアルをお考えで、デザインのイメージがわかない…そんな時は一度ご相談してみてください。弊社はディレクターがお客様とお打ち合わせを丁寧に重ねて一からオーダーメイドでデザインをご提案致しております。

ではまた次回もお楽しみに!素敵なサイトに出会えますように!

※今回ご紹介したサイトはデザイン性が高いためピックアップして紹介させていただきました。掲載の取消をご希望の場合はご連絡いただき次第速やかに対応させていただきます。


Warning: Undefined variable $cat_id in /home/spiqadesign/spiqa.design/public_html/knowledge/wp-content/themes/spiqa-k/single.php on line 93

Webサイト・ホームページ制作なら、スピカデザインにご相談ください。

スピカデザインでは、コーポレートサイト、サービスサイト、採用サイトなど幅広いサイト制作に対応しています。デザインでお客さまの課題を解決するお手伝いをさせていただきます。 まずはお気軽にご相談ください。

スピカデザインに相談する

記事を書いた人

スピカナレッジについて

WEB制作・ホームページ制作会社
「スピカデザイン」が運営するメディアです。
WEBのプロが知識をお届けします。

株式会社スピカデザイン 公式X