5万回のA/Bテストから見えたコンバージョン改善 「顧客に刺さる」表現のポイント
バナーやボタン、ポップアップは、ちょっとした違いで成果が変わってきます。この資料では注意を引く見せ方・訴求のポイントを、クイズ形式で解説していきます。
Sprocket アートディレクターの渡邉です。今回は、デザインチームが2023年に取り組んだブランドデザインの刷新プロジェクトについてご紹介します。企業ロゴは単なる「会社の顔」ではなく、その形や色には、会社の想いや理念が詰まっています。Sprocketの新しいロゴはどのようなプロセスで生まれたのか、そのデザインの舞台裏をお伝えします。
2023年以前のSprocketの旧ロゴには、いくつかの課題がありました。
これらの課題は、ただ単に見た目の問題にとどまらず、ブランドとしての一貫性やコミュニケーション効果にも影響を与えていました。特に、デジタルプラットフォームが多様化する現代では、様々な媒体で効果的に機能するロゴデザインが不可欠です。
ちょうどこの時期、Sprocketではビジョン・ミッション・バリュー(VMV)も刷新しました。創業当初からの想いを改めて言語化したこのタイミングで、ロゴも一新することには二つの目的がありました。一つは社内全体にVMVを浸透させること。もう一つは「私たちは何者で、どこへ向かっているのか」という本質的な問いへの答えを、視覚的に表現することでした。
良いコーポレートアイデンティティは三つの要素から成り立っています:MI(Mind Identity:理念や思想)、BI(Behavior Identity:価値観や行動規範)、そしてVI(Visual Identity:視覚表現)。この三位一体が調和して初めて、効果的なブランドイメージが確立されるのです。デザインチームの挑戦は、この三つを一貫させることでした。
良いデザインは偶然生まれるものではありません。特に企業ロゴのような重要な要素は、綿密な計画と体系的なプロセスを経て生み出されます。Sprocketのロゴ刷新プロジェクトは、以下のような段階を経て進めていきました。
まずはSprocketの新しいVMVを徹底的に分析しました。
Vision: Connect, Empower, Boost(想いがつながり、力を与え合い、高みに向かえる世界を)
Mission: データとテクノロジーを活用して人間心理を解明し、本質的な人間理解を深める。それをもとに、ユーザーと企業の関係性を成長させる最適なコミュニケーションを創造する。
Value: 信頼し尊重する、探究し還元する、突破し結果を出す
インプット段階で特に重視したのは、言葉の背後にある本質的な意味です。単に表面的なキーワードを拾うのではなく、それぞれの言葉が指し示す本質的な価値や方向性を掘り下げました。例えば「Connect(つながり)」は単なる接続ではなく、深い共感と相互理解に基づいた関係性を示しています。このような深層的な意味を読み解くことが、後のデザイン展開において重要な指針となりました。
また、この段階では過去から現在に至るまでの会社の歩みも振り返りました。「本来のおもてなしの実現」から「世界観に共鳴する関係性の実現」へとビジョン表現が変化してきた過程や、「人間心理のメカニズム+テクノロジー」「ユーザー・企業が高め合う関係」といった変わらない価値観も確認。創業者の「一生懸命な企業、一生懸命な顧客、を繋げて認め合い高め合える状態を作る」というゴールも改めて認識しました。
デザインチームは、VMVから抽出したキーワードを広げ、その後パターンを見出していきました。この過程では、言葉同士の関連性や階層構造を明らかにしていきました。
これらの言葉を分析し関連付けていくと、「つながり」「力を与え合う」「ブースト」「コミュニケーション」といった言葉が特定のパターンに収束していくことに気づきました。そこには成長と発展の循環的なプロセスが見えてきたのです。また「データ」「テクノロジー」は、この循環を支える不可欠な土台(ベース)だという理解に至りました。
この段階でのひとつの大きな気づきは、単線的なプロセスではなく、循環的・螺旋的な成長モデルがSprocketの本質を表現するのに適していることでした。一度きりのつながりや成長ではなく、継続的に高め合うプロセスこそがSprocketが目指す世界ということです。
キーワードの整理と分析を経て、詳細な検討の結果、Sprocketの本質はこう定義されました。
「テクノロジーをベースにサイコロジーを解明して、リレーションシップをグロースさせる存在」
この定義は、Sprocketの事業領域を端的に表現すると同時に、その存在意義と独自性も明確にしています。テクノロジーという冷静で論理的な基盤と、人間心理という温かで複雑な要素を融合させ、人と企業の関係性を育てていくという、Sprocketならではの立ち位置を示しています。
この本質を視覚的に表現するために、「Sprocket Spiral」というコンセプトが誕生しました。この表現には、継続的な上昇と進化、そして循環的な成長のイメージが込められています。静的な存在ではなく、動的で発展的なSprocketの姿勢を表すのに最適な概念です。
また、この段階では「正統進化」という考え方も生まれました。単に過去を否定して新しいものを生み出すのではなく、これまでの歴史やアイデンティティを尊重しながら、より本質的な方向へと進化させていくというアプローチです。これは「革命」ではなく「進化」というSprocketの姿勢を表しています。
「競合に埋もれないロゴを作る」という目標のもと、市場に存在する数百のロゴを分析しました。特にSaaS業界や関連するテクノロジー企業のロゴを集め、デザイン傾向、色使い、形状、印象などを多角的に評価しました。
このリサーチでは、単に見た目の傾向を調べるだけでなく、「なぜそのデザインが効果的なのか」「どのような要素が記憶に残るのか」という点も深く考察しました。
更に、競合他社のロゴを5段階で評価する独自の指標も作成し、「目立ち度」という観点から客観的な分析も行いました。
そこから見えてきたポイントは:
コンセプトを形にするため、まずは多数のラフスケッチを作成しました。この段階では、できるだけ多くのアイデアを生み出すことが重要です。デジタルツールではなく、まずは紙とペンを使って感覚的なスケッチを行いました。
スケッチにおいては、以下のようなポイントを意識しました。
数百に及ぶラフスケッチの中から、可能性を感じるものを選出し、デジタル化。より精密な形で検証を重ね、最終的に7つの候補案へと絞り込みました。
これらの候補案は、オリジナリティが高く、塗り面積が多く、コンセプトを表現できているという条件を満たしていました。次のステップでは、これらをより実践的な観点から評価していきます。
7つの候補案を、実際の使用環境(ウェブサイト、印刷物、名刺など)に配置し、実用性を検証しました。これは「紙の上では良く見えても、実際の使用環境では効果が薄れる」ということがよくあるためです。
各案について、以下のような観点から評価しました。
この検証プロセスを経て、バランスが良く、汎用性が高いA案とB案の2つが最終候補として残りました。また、両案ともに今までは単なる歯車だったものが本来あるべき「想いがつながり」「力を与え合い」「高みに向かえる」という動き(回転してスパイラルが生まれる)が加わり進化するという冒頭で生まれた考え方「正統進化」というアプローチで作られています。
最終候補の2案について、さらに細部の調整と洗練を行いました。この段階では、微細な形状の調整、バランスの最適化、視認性の向上など、デザインの完成度を高めていきました。
各案のメリット・デメリットを詳細に比較、更に競合他社のロゴとの比較検証をした上で、社内での意見も集めた結果、「シンプルでありながらも独自性があり、動きを感じる」B案が最終的に選ばれました。B案は「やや複雑なA案よりシンプルでスタイリッシュ、ユニークで躍動感も出た」という評価と、重要な指標であった「目立ち度」をクリアして、Sprocketの新しいシンボルマークとして決定しました。
シンボルマークの確定後、次のステップとしてロゴタイプ(文字部分)の検討へと移ります。
シンボルマークだけでなく、「Sprocket」という文字(ロゴタイプ)も企業アイデンティティの重要な要素です。ロゴタイプの開発では、以下の点を特に重視しました。
様々なフォントスタイルを検討した結果、明快さと読みやすさを考慮してサンセリフ体(装飾のないすっきりした書体)をベースにすることに決定しました。
Avenir、Futura、Gill Sans、DIN、Brandon、Myriad、Inter、Montserrat、Opensansなど、様々な候補の中からテストを重ね、最終的にAvenirのHeavyというウェイトが選ばれました。Avenirは現代的でありながらも安定感があり、シンボルマークとのバランスも良好でした。
そのままでは角が立っていて、丸みのあるシンボルマークとの相性がいまひとつだったのでさらに親和性を高めるために「p」「o」「c」「e」を正円に加工、さらにフォント全体の角を丸くしました。
文字間隔(カーニング)や配置についても入念な調整を行い、視覚的なバランスと読みやすさを最大化しました。特にシンボルマークとロゴタイプの間隔は、近すぎず遠すぎない「ちょうど良い距離感」を探求。様々な組み合わせを試し、最も調和の取れた配置を見つけ出しました。
ロゴの形状が決まったら、次は色彩の決定です。色は感情や印象に大きな影響を与える要素であり、慎重に選定する必要があります。
Sprocketのアイデンティティで重要な「テクノロジー」の表現に最適な色を探るため、テクノロジー関連の視覚イメージを広く収集・分析しました。様々なテクノロジー企業のビジュアル表現を調査した結果、青系の色が最もテクノロジー感を表現できることが分かりました。
さらに、単なるテクノロジー表現にとどまらず、Sprocketの持つ温かみや人間性も表現するために、「テクノロジーをベースに→サイコロジーを解明して→リレーションシップをグロースさせる」という流れを表現する色使いを検討しました。その結果、「ブルーからオレンジにブーストしていく」配色を採用しました。
ブルーは冷静さ、信頼性、論理性を象徴し、オレンジは活力、創造性、親しみやすさを表現します。この補色関係にある色の組み合わせが視認性を高め、活力ある印象を与えると考えました。
そして最終的に以下の色が決定しました。
このカラースキームは、単に視覚的に目立つだけでなく、Sprocketの企業としての特性や価値観も反映しています。
新しいSprocketのロゴには、多層的な意味が込められています。
単なる歯車(スプロケット)から、「想いがつながり」「力を与え合い」「高みに向かえる」という動きを表現した形状への進化。これは「正統進化」と呼ばれるアプローチで、原点を尊重しながら新たな価値を付加したものです。
また、色彩面では青からオレンジへのグラデーションが、テクノロジーから人間性へ、データから関係性へという移行を表しています。これはSprocketが「テクノロジーで、人と企業が高め合う関係を作る」というミッションを視覚的に表現しています。
実際のビジネスシーンでは、ロゴは様々なシーンや媒体で使用されます。一定のルールを定め、正しい運用をするためにガイドラインを策定しました。
ロゴのバリエーションやアイソレーション(余白)、禁止事項などを定め、どのような状況でも最適な見え方を確保できるようになっています。これを元に、社内外での一貫した使用を促進しています。
新しいロゴは、Sprocketのビジョン・ミッション・バリュー(VMV)を視覚的に体現したものです。
このロゴを通じて、Sprocketが目指す世界観が、より多くの人々に伝わることを願っています。今回のプロジェクトは、単なる見た目の刷新にとどまらず、企業としての本質と向かうべき方向性を再確認し、視覚化するプロセスとなりました。
ロゴデザインは終着点ではなく、むしろスタート地点です。このビジュアルアイデンティティを基点に、Sprocketはこれからも「テクノロジーで、人と企業が高め合う関係を作る」という使命に向かって邁進していきます。そして、このロゴが象徴する「つながり」「力を与え合い」「高みに向かう」という価値観が、関わるすべての人にポジティブな影響を与えていくことを期待しています。
5万回のA/Bテストから見えたコンバージョン改善 「顧客に刺さる」表現のポイント
バナーやボタン、ポップアップは、ちょっとした違いで成果が変わってきます。この資料では注意を引く見せ方・訴求のポイントを、クイズ形式で解説していきます。
サービス資料ダウンロード
Sprocketの特徴、MA・CDP・BIの機能、コンサルティングサービス、事例などをご紹介します。
導入検討の相談・見積もり
新規導入、乗り換えのご相談、MA・CDP・BIの各ツールの比較などお気軽にお問い合わせください。
03-6420-0079(受付:平日10:00~18:00)