『Web 制作の発注&パートナーシップ構築ガイド』発売中

カロアデザインコロアじゃなくて、カロアだよ

キャリアの地図2023 |ONE CAREER PLUS

Client

ONE CAREER PLUS

Scope

  • /

    デザイン

  • /

    アニメーション制作

  • /

    Studio実装

Overview

プロジェクト概要

次のキャリアが見える転職サイト「ONE CAREER PLUS」が、集めた転職事例や体験談を「キャリアの地図」として総まとめする年末恒例の企画サイト。今年は掲載企業数の拡大だけでなく、ポッドキャストや記事などのコンテンツも充実させ、職種別にもキャリアパターンが見れるようになるなど、大きくアップデート。ユーザーの投稿により「キャリアの地図がつくられる」ことをコンセプトに、投稿・閲覧増加と顧客獲得につながるシェアしたくなるサイトを目指した。

キャリアの地図2023 |ONE CAREER PLUSの画像

制作のストーリー

キャリアの地図2023のキャプチャー画像

こだわりの世界観、メタファーの設計

「キャリアの街」をアイソメトリックのイラストレーションで立体的に表現し、乗り物は「あなたのキャリアはどこへでも行ける」ことを感じさせる軽やかなメタファーとして配置しました。

また「ONE CAREER PLUS」というプロダクト名の認知度向上のため、ベースカラーが青であることや、各所にロゴを配することで、昨年度よりもプロダクトとの親和性向上を目指しています。

キャリアの地図2023のキャプチャー画像

ビジュアル/インターフェイスのこだわり

キャリアの街が作られていくワクワクさを、建物や看板、人が降ってくるようなモーションで演出。STUDIOの出現アニメーションを細かく調整し、検証を重ねました。

看板がクリックできることをユーザーに認知してもらうために、コントラストの調整・時間経過で動くループアニメーションをJavaScriptを用いて実装しています。

ONE CAREER PLUSのブランドを崩さないよう、ベースであるブランドカラーやフラットで親しみやすいテイストを踏襲しました。

CMSにてデータを活用

1500を超える企業をCMSにて一括管理しています。モデルを連携し、自動でセクションやカラーが切り替わる動的ページを生成できるよう、caroaにてデータベースを設計して運用の効率化も実現しました。


2022年から2023年のアップデート点

「キャリアの地図」は2021年から毎年テーマを掲げ、年末に行われている企画で、初回よりcaroaで携わらせていただいています。そのため毎年公開後の課題を両者で洗い出し、翌年のプロジェクトに活かしていき、年々価値を向上させています。

1つのページに集約し境界を取り除く

昨年は企業や領域(規模/業種/経験者/未経験者)などが全て別ページに表示されており、ユーザーが領域を飛び越えて他企業を知ることができなかったです

そのため今年はより多くのユーザーが、境界を失くし知るきっかけが増えるように、1ページ1スクロールの街並みにまとめあげました。

プロダクト自体の知名度向上施策

「キャリアの地図」という毎年の企画コンテンツ自体は知名度が上がっているものの、プロデュースしている「ONE CAREER PLUS」というサービス名の認知がまだまだ浸透しておらず、機会損失へつながっていました。

本企画サイトを起点にプロダクトに直結させるよう、今年は各所にONE CAREER PLUSへのリンクを街並みに溶け込むよう自然に仕込みました。ぜひ探してみてください。

ブランドのメッセージ訴求

昨年は江戸の街をフラットに並べ、ページごとに街が分断されていましたが、今年は立体的なアイソメトリックの手法を取り「1つの街」の中でシームレスに移動できることを実現しました。

その結果キャリアの街を俯瞰/一望し、「あなたはどこへでも行ける」というONE CAREER PLUSからのメッセージを強く感じさせるようにしています。

ONE CAREER PLUSらしさ

昨年は世界観が「和」によっており、2022年独自の企画色が強く出ていたが、今回は原点回帰として「ONE CAREER PLUS」のカラーやサービスらしさを意識し、プロダクトへの親和性を高めました。


本プロジェクトの成果

キャリアの地図2023を通して得られた成果をご紹介します。

リリース後の話題性に加え、掲載企業内での採用活動の二次利用に

公式X(旧:Twitter)のポストは54,000Views超。ONE CAREER PLUS プレスリリースのいいね1200超を達しました。

SNSのエンゲージメントもかなり多く、「スクロールするのが楽しいUI」「キャリアの透明化に一貫してアクションしていることが伝わる」「見ていてワクワクするしずっと触っていたい」などのコメントがありました。

今年は掲載/協力企業数を128社と増やし、そのうち6社では自社サイト掲載や採用利用されました。

1ヶ月半という超短期間でリリース

企画段階を除き、要件定義、ラフ、デザイン制作、実装〜リリースまでを「1ヶ月半」というスピード感をノーコードWeb制作プラットフォーム「STUDIO」を活用して実現しています。

STUDIOではデザインと実装を一部ハイブリットに行ったり、CMS機能を最大限活用して同時に、チームメンバーは該当期間にフルコミットするような体制を築き、ONE CAREER PLUS×caroaのチームワークを十二分に発揮できたからこそ、この短期間で企画の実現ができました。

STUDIO DESIGN AWARD 2023で3冠受賞

「みんなでつくる キャリアの地図2023」が、STUDIO DESIGN AWARD 2023で、「S5-Style賞」「Designship賞」「ソーシャルいいね賞」と史上初のトリプル受賞をいたしました。

各賞の講評では、「ビジュアルおよびインターフェイスが非常に見やすく高品質である」「CMS機能の利活用により大量のデータを見事にひとつの体験に落とし込んでいる」「STUDIOのバリューが十分に引き立てられた設計となっている」「いい意味で『STUDIOらしくない』アプローチで、デザインの新しい次元に挑戦している」「STUDIOの活用による事業への有益性、そして社会への影響度が高い」と評価をいただきました。

ビジネス成長のためのデザインなら、カロアに

ビジネス向けのデザインパートナーとして、企画や戦略からアウトプットまでトータルでサポートいたします。社内にデザイナーがいない、もしくは少なくてお困りの方、もっとデザインの価値を上げたい方はぜひご検討ください。

関わったプロジェクトを見る

資料をダウンロードする

相談する

Studioでのサイト制作、相談はご相談ください

カロアは国産最大級のノーコードツールWeb制作プラットフォーム「Studio」のゴールドエキスパート。そのため、他社と比べて圧倒的な経験と実績をもとに、「自社内で運用しやすい」コーポレートサイト、採用サイト、BtoBサイトを制作いたします。

StudioでのWebサイト、ホームページ制作の理想の形は、立ち上げを「カロア」にお任せいただき、運用は自分達でおこなっていただくことです。

制作のご依頼、WordPressからStudioへの移行などありましたらご検討ください。

Studioでのサイト制作実績を見る

Studioでのサイト制作、移行を依頼する

資料をダウンロードする

Studioの使い方を体系的に学びたい方は

カロアでは豊富な実績をもとにした、実践型Studio実装スクールを運営しています。
現場で活躍している講師がオンラインで直接講義し、課題に対してフィードバックを1対1で行い習得していくプログラムになっています。
ノーコードツールのStudioを使ってWebサイトを作ってみたいデザイナー、ディレクター、営業、人事、広報のみなさまをお待ちしています。

カロアキャンプを見る

Recruit

デザイナーやプロジェクトマネージャーなどを中心に積極採用中です。
ご興味のある方は以下をご覧ください

募集ページ