Logos Yiying

スタートアップのロゴを改善する、7つのコツ

今回は、500 Startupsのアクセラレータープログラムのバッチ20の中で、Creative DirectorのYiying Luが主導した、『クリエイティブなロゴのためのデザイン攻略ワークショップで得た、ヒントとフィードバック』のまとめをご紹介します。このワークショップの目標はシンプルで効果的なデザインの実践を通じて、スタートアップのブランディングメッセージをよりよく伝えることです。


以下に、実際にBatch 20のスタートアップのロゴを手直しした事例とともに、デザインハックの7つの方法を紹介します。

1. 色にコントラストをつけて、より見やすくする

Obie.AIの事例 – チームのデータにアクセスするSlackbot

コメント:特にアプリアイコンとして使用した場合にも、ロゴをより見やすくするために、より良い色の組み合わせを選びましょう。 Adobe Kuler(無料)を使用すると、カラースキームを作成したり、確認することができます。

提案:この会社の場合、プロダクトはSlackbotであるため、ロゴアイコンはSlack上で40×40ピクセルの画像となり、非常に小さくなります。そのため、新しいカラースキームを使用することで、ユーザーがアイコンを認識しやすくなり、モバイルフレンドリーになります。

2. ロゴの要素を統一することで、ビジュアルの一貫性を保つ

Via Global Healthの事例 – 救命救急が必要な人々と、これまでそうした人々に届いていいなかった医療資源を繋げるプラットフォーム

コメント:会社名は「VIA GLOBAL HEALTH」ですが、「VIA」の部分はテキスト「GLOBAL HEALTH」と視覚的に分断されてしまっています。 「VIA」は社名よりもシンボルのように見えるため、ユーザーは会社の名前を「GLOBAL HEALTH」と混同してしまうリスクがあります。

私は彼らに以下の二つの提案をしました

提案①:現在の( “VIA”の部分を分離している)円を消して、代わりにAを矢印のようにする。また、”GLOBAL HEALTH”のAも同様に矢印にし、Viaと統合する。

提案②:VIAはシンボルのままにし、その横にもう一度Viaを含めた会社名全体をテキストで書く

3. ブランドネームをより認識してもらいやすくするために色を加える

Cybewriteの事例 – オンライン保険における、引受業務とプライシングのための機械学習ソリューション

コメント:Cybewriteという会社名は通常しない綴り(Cyberのrがない)です。私は会社名のうち、2箇所をそれぞれ違う色にして目立たせるよう勧めました。

加えて、万年筆の真ん中の線と「Cybewrite」の文字を太くすることで、ロゴが小さく表示された時でもより読みやすくしました。

4. 特定のロゴの要素を強調し、ロゴを際立たせる

Win-Winの事例 – 一週間に渡るトーナメント戦でプレイすることで、好きなプロアスリートやインフルエンサーとの経験を競うことができるスポーツゲームプラットフォーム。ユーザーのトーナメント参加費は慈善事業へ寄付される。

コメント:元々の黒と白のロゴは、アプリとウェブサイトの背景となじんでいて、目立っていません。私はロゴを背景から際立たせるために、金色でWの周りの六角形を強調させるよう勧めました。金色はまた、金メダルと紐付き、ゲームやスポーツの要素をより表現してくれるでしょう。


5. ロゴの名前部分とアイコン部分を揃える

Hyphenの事例 – チームのインサイトを、リアルタイムに経営陣や人事に結びつけるサービス。

コメント:現在のロゴのアイコン部分はあまりにも抽象的すぎるので、「チームのインサイトを、リアルタイムに経営陣や人事に結びつける」というブランドメッセージを補完するものではありません。 私はロゴ文字の端にドットを追加して、「チームと経営陣の点と点を結びつける」というメッセージを視覚的に伝えることを提案しました。

また、ロゴのアイコン部分は、単独でソーシャルメディアのアイコンとしても利用されても十分に関連し意味が伝わらなくてはいけません。現在のアイコンでは、ソーシャルメディアアイコンとした時にただの横棒とその下に曲線があるようにしか見えません。創業者は、これはハイフン(2つ以上のものを繋ぐもの、社名でもある)とその下にある独善性をイメージしていたのだと言っていましたが、このロゴを見る人達に彼らが伝えたいことを理解させるにはあまりに抽象的で不明瞭でしょう。

私は先ほどの修正でドットを追加し「結びつける」という意味を表すようになったロゴ文字の最初の「H」をソーシャルメディアアイコンとして使うことを提案しました。

6. 大文字と小文字で読み間違えるのを防ぐ

Urban Logicの事例 – 都市計画をより迅速に、より安く、より正確にするために、機械学習による分析を行うスタートアップ

コメント:現在のアイコンは統計を表していますが、小文字の緑色の「l(エル)」は大文字の「I(アイ)」と混同する可能性があります。 私は、混乱しないよう、小文字の「 l(エル)」の下に横棒を追加するか、または現在の丸いエッジのついた “UL”を角を尖らせて丸みのないフォントに変えることを提案しました。

7. 誤解を生むような文字の置き換えをしない
RapidCFOの事例 – ファイナンスのための会話型ボット

コメント:会社名は “RapidCFO”ですが、”O”の部分が矢印の加工で輪の途切れた円になっているため、ユーザーが会社名を “RapidCFC”と混同してしまうリスクがあります。

私の提案は、文字 “C”に文字 “O”の元の矢印の加工をし、文字 “O”を完全な円に戻すことです。 また、この会社はファイナンスを扱っているので、緑色のような第二のブランドカラーを持つことで、ユーザーの認知を強化するのに役立ちます。

追加のノウハウ:加えて、ドルの$やポンドの£、ユーロの€、中国や日本の¥といった国際的な通貨シンボルをロケーションに合わせて追加するのも良いでしょう。以下のようにGIF動画にしてしまうのも良いかもしれません。

今回の事例からの学びを要約すると、スタートアップのロゴデザインを改善するには、7つのデザインハックがあります:

  1. 色にコントラストをつけて、より見やすくする
  2. ロゴの要素を統一することで、ビジュアルの一貫性を保つ
  3. ブランドネームをより認識してもらいやすくするために色を加える
  4. 特定のロゴの要素を強調し、ロゴを際立たせる
  5. ロゴの名前部分とアイコン部分を揃える
  6. 大文字と小文字で読み間違えるのを防ぐ
  7. 誤解を生むような文字の置き換えをしない

500 Startupsではサンフランシスコとシリコンバレーで、『500 Seed Program』を開催しています。スタートアップのオンラインマーケティングや顧客獲得、デザイン、UX、リーンスタートアップといった分野の実践と評価指標を強化しています。また、昨年に引き続き今年も神戸市と共同で、500 KOBE Acceleratorを開催します。お申し込みはこちらから!

また、こちらの関連記事も是非御覧ください。
「スタートアップのグロースを加速する、7つのデザインシンキング」


Yiying Lu氏は現在、500 Startupsでクリエイティブの指導を行っています。彼女はクリエイティブの分野で10年以上の経験を持ち、また数々の受賞歴を持つアーティストでありデザイナーです。New York Times、Forbes、NBC News、TIME、CNN、BBC、TechCrunch、The Huffington Postといった一流メディアが彼女のプロジェクトを掲載しました。さらに、Microsoft Next 100シリーズでは、「イノベーションを導くリーダー、トップ10」に選ばれました。Yiying氏の詳細については、TwitterLinkedinMediumでフォローして御覧ください。

吉澤美弥子

慶應義塾大学看護医療学部卒業。在学中に海外のヘルステック企業やデジタルヘルス企業に関して取り上げる、HealthTechNewsを立ち上げ、2016年売却。外資系証券会社の株式リサーチ部で、TMT市場に関わる調査アシスタントなどを経て、500 Startups Japanに参画。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

We're Hiring! 500の投資先で働いてみませんか?Apply Now
Search