デザイン組織の発信のためにWEBサイトを作った話
こんにちは。今回は私の所属する「DESIGN BASE」のWEBサイトをつくったお話をしようと思います。
どういった経緯でサイトをつくることになったのか、実際どうやってつくっていったのかを書いていこうと思うので、デザイン組織や組織を立ち上げた人、これから何をやればいいか迷っている人に、少しでも役に立ったら嬉しいです！
課題からスタート
DESIGN BASEを立ち上げたのは2021年の春です。そこからDESIGN BASEのつくりたい世界を考え、実現のために奔走していましたが、私たちが優先的に取り組んでいたのは「DESIGN BASEのメンバーが組織に愛着を持ってもらうための施策」でした。
それは、DESIGN BASEのメンバーのモチベーションが高まり走り出すことで、上記の図のサイクルが回り出すと考えたからです。そのために、メンバー専用のオリジナルグッズをつくったり、メンバー向けのお茶会を企画したりといった、さまざまな取り組みを進めてきたことで、メンバーの「組織への愛着」は少しずつ高まっていったように思います。その一方で「社外に対する発信」が後手に回ってしまっていました。
サイトができる前の社外へアピールできる唯一取り組みは、この「note」の更新で、週に１度、担当メンバーが記事をアップしています。業務での学びや趣味の話など内容はさまざまですが、どれも個人の視点のもので、「組織」のことを発信するものではありません。
新たな仲間を増やすために採用活動に力を入れよう！と思っても、自分たちがどんな組織かを知ってもらう術がないことに気づき、DESIGN BASEを発信していくために「自分たちのWEBサイトをつくる」という計画がスタートしました。
ターゲットと目的
まず初めに、誰のためにサイトをつくるのか、いわゆる「ターゲット」を考えました。いろんな人に見てもらいたいし、みんなに組織のことを知ってほしい！というのが本音ですが、前述のとおり「新たな仲間を増やすために自分たちを知ってもらいたい」という理由がサイト作成の一番の理由です。なので、ここではターゲットを、仲間になってくれる確率の高い「DESIGN BASEに興味を持ちそうなデザイナー」に定めました。
次に目的を考えます。「DESIGN BASEに興味を持ちそうなデザイナー」がサイトを見て、どういった感情になり、どういった行動をしてくれたら、サイトをつくって成功ということになるでしょうか？私たちは「新たな仲間を増やしたい」ので、ターゲットに「DESIGN BASEに入社したい」と思わせ、「応募してもらう」ことが目的です。また、応募まで行き着かなかったとしても、DESIGN BASEがどんな組織かを知ってもらえるだけでもとても大きな成果だと思います。
では「DESIGN BASEに興味を持ちそうなデザイナー」が「応募する」ために必要な、サイト上に載せるべき情報はなんでしょうか？ターゲットは、なにを知りたいと思っているのかを掘り下げていきます。
リサーチと構成
掘り下げる方法は「リサーチ」です。リサーチ対象は「現DESIGN BASEメンバー」としました。現在のメンバーはみな就職活動を経てDESIGN BASEにジョインしてくれた仲間たちなので、入社前に何を考えていてどんな情報が知りたかったかを聞くことで、サイトに載せるべき情報がわかる！と考えました。
すぐにサイトに載せるべき情報を探るための質問を考え、アンケートを作成します。
このアンケートをメンバー全員に答えてもらい、実際DESIGN BASEにジョインした人たちからのリアルな声を吸い上げていきます。得られた回答を書き出し、求められている情報はなんなのか、伝えるためにはどうしたら良いのかを議論しました。
下の図はアンケートの質問ごとに得た回答をカテゴリごとに分類しています。例えば、成長環境についての回答、仕事内容への回答…といった具合です。回答の多いカテゴリがより求められている情報ということになります。
わたしたちが行ったアンケートの結果では、特に求められている情報は、
「一緒に働くメンバーがどんな人か」
「具体的な業務内容・成果物」
「成長機会があるか」
これらはどこにも出ていない情報なので、知り得る術がありません。これこそ、DESIGN BASEのサイトで伝えないといけないものだとわかりました。
逆にそこまで求められていない情報は、
「給与体系」
「働き方」
でした。
これは、DESIGN BASEの本体である株式会社ユーザベースが「給与体系」を公開していること、「働き方」が自由な会社として少しの認知があることからだと分析できました。
次に、カテゴリごとに求められている情報を伝えるためのコンテンツを考えます。「一緒に働くメンバーがどんな人かを伝えるために、メンバー紹介のコンテンツをきちんと作ろう」「成果物がしっかりとわかるWORKSのページも必須だよね」などと会話をして、載せるべき情報を具体的にしていきます。ある程度コンテンツが定まったところでワイヤーフレームとして構造を考えていきました。
デザインと実装
今回、ノーコードでサイトが作れる「STUDIO」というツールを使ってつくることが決まりました。「STUDIO」に決めた理由は、大きく3つです。
・コードを書かなくて良い
・無料ですぐに始められる（のちに有料プランに変更可）
・サイトの運用もしやすい
STUDIOはCSSやHTMLなどWEBサイトに関する知識が少しでもある方にとってはすごく使いやすいツールだと思います！
が、わたし自身はWEBサイトの知識が乏しく、STUDIOを使った経験がなかったので、初めて触るツールに苦戦しました。
調べながら手探りでデザインするのでなかなか制作が進まなかったため、まずは使い慣れているIllustratorでデザインカンプを起こすことにしました。作成したデザインカンプがこちらです。
この時点でまだ画像が揃っていないところはグレーのダミーになっていますが、TEAMのポートレート撮影のイメージまで揃った状態です。（ポートレート撮影の詳細は別noteにまとまっているのでぜひ見てみてください！）
本来であれば、このカンプを元にわたしがSTUDIOで実装する予定だったのですが、慣れないツールに苦戦し作業が進まなかったため、STUDIOのゴールドパートナーである「株式会社gaz」さんに実装をお願いすることにしました。
デザインカンプがある状態からでしたが、アニメーションやページ構成の提案をしてくださったり、CMSまわりを詳細に設定していただいたり、とてもお世話になりました。公開まで時間のない中の特急対応も、感謝しかありません！gazさーん！ありがとうございました！
効果とこれから
今回、リサーチの部分に時間をかけ、求められている情報を整理した結果、情報のボリュームのバランスが取れたサイトになったと思います。現在は問い合わせフォームからメッセージがきたり、採用面接でサイトを見て応募したと言ってもらえたり、少しずつ効果を感じることができています。
別軸ですが「STUDIO DESIGN AWARD 2021」でノミネートしていただき、デザイン面で評価をいただけたことも、デザイン組織としてとても喜ばしい結果です！
これからもよりよいサイトになるように随時アップデートを考えていますので、ぜひぜひチェックしてみてください！
DESIGN BASEメンバーのnoteはこちらから読めます！こちらもぜひ読んでみてくださいね！
この記事が気に入ったらサポートをしてみませんか？