読者です 読者をやめる 読者になる 読者になる

LIFULL Creators Blog

「株式会社LIFULL(ライフル)」の社員によるブログです。

HOME'Sロゴの話

f:id:homes_designers:20160121172953p:plainこんにちは。HOME'Sブランドチームの田中です。

2015年12月15日を皮切りに、HOME'Sの各サービス上でひっそりと差し変わったものがあります。HOME'Sロゴです。

HOME'Sロゴは、これまでもレッドからオレンジになったり、線が微妙に変わったりとマイナーチェンジはありましたが、今回の変更でロゴの見栄えはがらりと変わりました。

ポイントは「小判が取れた」ことと「文字が変わった」ことです。

今日はそんな新しいHOME'Sロゴの経緯についてお話させていただきます。

 

 

 

HOME'Sの歩みとロゴ

 

「HOME'S」の名を冠するサービス・コンテンツは、HOME'Sの20年ほどの歩みの中でたくさん生まれてきました。

 

2015年12月にリニューアルを遂げた「HOME'Sリノベーション」。

高齢者向けの住まいを探せる「HOME'S介護」。

収益物件検索や、不動産投資のサポートを提供する「HOME'S不動産投資」。

トランクルーム専用サイト「HOME'Sトランクルーム」。

不動産業務をより円滑にするプロ向けサービス「HOME'S PRO」。

 

まだまだ他にも沢山あり、これからも増えていくでしょう。

そして、それら全ての接点上でハンコのように刻印され、ブランドイメージをつなぐ最も重要な役割を果たすのがロゴです。

f:id:homes_designers:20160128163905p:plain

文字を囲う「小判(社内での呼び名です)」から黄色い楕円がポンと閃いたような形のロゴになったのは2006年1月ですので、旧「小判型ロゴ」は使われ始めてから10年ほどが経ちます。

しかし10年という年月でサービス規模も運用体制も変わっていき、ロゴもその歩みとともにルールや形態の調整を重ねていました。そして今回、サービスの拡大に合わせ、微調整だけでは解消できない課題に対処するため、現状に合わせた新しいロゴ形態の模索が必要でした。

ですので今回のロゴの変更は「リニューアル」ではなく「アップデート」という言葉を使っています。シンボル自体のコンセプトはそのままに、もともとのロゴが孕んでいた問題点を洗い出して抽出し、解消することが狙いでした。

 

 

旧ロゴが持つ問題点とその解消について

問題点は、大きく分けると「可読性」「汎用性」「拡張性」という3点に分けられました。

 

①「可読性」の問題

f:id:homes_designers:20160128163929p:plain

旧ロゴは、小判とアポストロフィーが合体している形状のクセ、メッセージやシグネイチャーの影響で、線や要素が多くなり肝心のHOME'Sの文字が読みづらくなっていました。

これらを解消するために、要素をそぎ落とし、文字の周囲の空間を整理して読みやすくする必要がありました。

 

 

以下は、2015年10月~12月の一時期だけ使われていたロゴマークです。

f:id:homes_designers:20160121230149p:plain

旧ロゴをver1.0、新ロゴをver2.0とすると、ver.1.1というべきバージョンでしょうか。

「可読性」の解消にのみフォーカスしたもので、小判を広げ、開発中のロゴタイプを実験的に利用しています。HOME'Sをある程度認知されている方で無ければ、パッと見では違いを意識する事のない程度の差です。

 

放映中だったCMの最後の「止め」部分と、PC版トップページでのみ差替えたところ、ロゴ認知は前月比昨対比ともに向上が見られました。

ロゴ認知はあらゆる接点から影響を受ける指標なので一概には言えませんが、数値が大きく変動する理由として他に考えられるものがなかった事もあり、胸をなでおろす結果でした。文字としての読みやすさと、シンボルとしての認知には関係があると言えそうです。

 

 

 

 

②「汎用性」の問題

旧ロゴはその形状のクセから、レイアウトで困る場面がよくありました。

まず、オレンジベタ面に配置できない点。色を反転してヌキにすると印象が変わりすぎてしまう事が理由です。そういう時は白い背景を敷かないとロゴが配置できませんでした。形状が複雑なので、矮小スペースも苦手だったりします。

f:id:homes_designers:20160128163941p:plain

しかし「小判」を取るとこれが解消されます。

 

そもそもHOME'Sロゴのコンセプトは、アポストロフィー部分の黄色いマークに宿っていました。ポンと生まれる黄色の楕円が、住まいにおける「発見」、つまりHOME'Sをご利用いただく方々に提供すべき価値を象徴しています。

 

小判はそのコンセプトを強調するためのもので、言ってみれば無くても成立します。

ただ小判を取ってしまうと印象も運用感覚もがらりと変わるため、長年使ってきた蓄積を考えると当然リスクもありました。それでも今後も拡大するサービスや、web、マス、イベントなど利用シーンがいっそう多岐にわたっていく事を考慮し、外すことを選びました。

f:id:homes_designers:20160128163953p:plain

 

 

 

 

③「拡張性」の問題

これも小判に関わる話です。

以下は旧ロゴの時に使用されていたパターンと新ロゴを比較する図です。

f:id:homes_designers:20160128164016p:plain

旧ロゴは文字を並べると読みづらく、続く言葉によってはロゴの後にまたHOME'Sと書かざるを得なかったりします。「HOME'S○○」という名称と相性が悪かったことがわかります。

これはHOME'Sの文字が白ヌキになっている事が最大の要因でしたので、小判をなくすことで解消されます。こうして今後生まれていくサービスにも対応できるようになります。

 

 

 

 

 

制作プロセス

 

ロゴの制作プロセスですが、まず旧ロゴをひたすら研究するところから始めました。

f:id:homes_designers:20160121214331p:plain

上げるとキリがありませんが、上記はその研究の残骸の寄せ集めです。のちにver.1.1に繋がる小判研究の足跡も見られます。

 

文字を調整する作業は計算と目視の繰り返しで進行しました。

肝であるアポストロフィーを強調するため文字自体のクセは抑え、でもちょっとだけ引っかかる。そして何より「読みやすく、使いやすい」こと。

「発見」を別の方法で表現するような案も初期にはありましたが、プロジェクトの主旨からしてそういった案は消えていきました。主役は馴染んだあのアポストロフィー。文字は引き立て役。そうして旧ロゴのイメージをベースに調整を重ねました。

香水を選ぶとき、コーヒー豆を嗅ぐことで鼻をリセットしながら試用するという話がありますが、もしも目に効くコーヒー豆があったら1kgくらい欲しかった時期です。

 

以下はFIXに向けて最後に比率を揃えて固めようとした段階です。しかしまだアポストロフィーが相対的に大きかったり、いくつかFIX版との違いが見られます。「綺麗なモノには法則がある」という精神で整理していたもののうまくハマらず、ああ、最後は目視しか無いんだな、と悟った瞬間でもありました。

f:id:homes_designers:20160121175207p:plain

この後、もう何度か目視の最終調整を回して完成します。

 

 

 

ただし、この小判無しの新ロゴだと動画や写真を背にした時「視認性・可読性」が損なわれたり、オレンジ以外の濃色背景時にブランドカラーを保持できません。

なので実は、こういうパターンも存在します。

f:id:homes_designers:20160122154224p:plain

 

 

 

運用ルール

 

ロゴの利用ルールも整理しました。

これまでは禁止事項によって成り立っていた"ロゴレギュレーション"を、禁止ではなく考え方を簡潔にまとめる方針で"ロゴガイドライン"として刷新しました。「こう使っちゃダメなんだな」より「こう使ってみたいな」と思ってもらえるようにまとめるイメージです。

f:id:homes_designers:20160121190032p:plain

上記は余白ルールのページ例です。新ガイドラインは、とにかく「説明しない」ことを重視しています。ルール自体もシンプルにし、またグループ社員はもちろん社外の方にも読みやすく分かりやすい表現に終始することで、より自由に利用できるようになりました。

ただしガイドラインは運用していく上で必ずチューニングが必要になります。旧ロゴのレギュレーションも、運用する中で生まれた課題に対して都度ルールを新設しながら肥大していった背景があります。

そのため初版において平易な表現で、考え方の明示に徹することはガイドラインの土台としての意味もあります。

 

 

最後に

長々と書きましたが、要はアップデートであり「小判が取れた」ことと「文字が変わった」ことが今回の顛末です。しかしロゴは影響範囲が非常に広く、一つの調整がサービス全体の印象形成に関わります。

当然、差替え作業は多くの仲間の協力がなくてはできませんでした。ただ幸いなことにHOME'Sの開発/制作ワークフローはかなりの割合で社内完結しているため、差替の進行はおそらく一般のケースよりスムーズだったのはないでしょうか。手前味噌ですが、こういう所はHOME'Sの良いところだと思います。

今後HOME'Sロゴを利用して「HOME'Sらしい」画をつくる際に、イメージを膨らませる一助になって欲しいです。そうして、たくさんの人に親しまれるシンボルになったら良いなと願っています。