Upgrade to Pro — share decks privately, control downloads, hide ads and more …

なぜロゴを変えるのか / for-designer

なぜロゴを変えるのか / for-designer

引越しや庭木の剪定などの出張・訪問サービスのプラットフォーム「くらしのマーケット」を運営する、みんなのマーケット株式会社です。
これまでの「くらしのマーケット」のロゴの変更目的をまとめました。

## エントリー
全職種で積極採用中!下記リンクより応募ください!(カジュアル面談も歓迎)
https://www.minma.jp/recruit

「話を聞いてみたい」もOKです!
応募フォーム→https://herp.careers/v1/minma/2qUQhRIRUr0Y/apply

More Decks by みんなのマーケット株式会社 / Minma Inc.

Other Decks in Design

Transcript

  1. なぜロゴを変えるのか
 みんなのマーケット株式会社 
 デザイナー・みそさく 
 1

  2. はじめに
 くらしのマーケットのロゴはこれまで、 「2015」「2016」「2022」と3回の変更を行なっ ています。
 
 「2015」の変更は記録が残っていないので 不明ですが、今回は私が行なった 
 「2016」「2022」のロゴ変更の目的 をまとめ

    ます。
 2
  3. 2016年のロゴ変更の目的
 よく見ると微妙に変わってますね、 
 好みが変わったのでしょうか? 
 
 意味はあるのでしょうか? 
 3

  4. 2016年のロゴ変更の目的
 まずは2016年の世の中の流れ 
 
 このロゴ変更をしたのは、Googleの「モバイルフレンドリー」によって web閲覧の環境が「パソコン」 から「スマートフォン」にはっきり変わった タイミングです。 
 


    モバイルフレンドリーとは、2015年4月21日にGoogleが全世界で実装したアルゴリズムです。 モバイルフレンドリー アップデートとも呼ばれます。 スマートフォンでの閲覧に適していないページの順位を引き下げる仕組みです。
 
 この変化に対応するためのデザインの役割は 「 スマホでも使いやすいか 」 と 「スマホでも表示が 速いか」 の2つを確保することでした。 
 
 
 4
  5. 2016年のロゴ変更の目的
 「使いやすいか」=「ユーザビリティ」の前にこのロゴには問題がありました。 
 右の図のように「ユーザビリティ(使いやすいか)」は「アク セシビリティ(そもそも使えるか)」の上にしか成り立たない 性質を持っています。そもそも「使えない」のに「使いやす い」わけがありません。 
 
 5

  6. 2016年のロゴ変更の目的
 ではアクセシビリティ的にどんな問題があったのかという と「色」です。白背景の上でロゴの色が見づらい状態でし た。
 「見づらい」の基準は「W3C」の「WCAG (Web Content Accessibility Guidelines) 2.0」の定義を使用しています。


    
 W3Cさんいわく「見やすさ」を数字であらわしたので、最低 「3」 は達成してね、といった感じです。
 
 変更前のロゴの色の「見やすさ」は 「2.4」 でした。 
 6
  7. 2016年のロゴ変更の目的
 
 オレンジ色はそもそも、白の上で見づらい色「黄色」の隣の 色なので、見やすくするには黄色の反対側にある「赤」を 混ぜるか、「黒」を混ぜる必要があります。 
 7

  8. 2016年のロゴ変更の目的
 ということで、「赤」と「黒」を混ぜることで 
 「見やすさ」を 「3.0」 まで 引き上げました。 
 サイトの色はロゴを基準に、ボタン などの色を決めているた

    め、このロゴの色変更によりサイト全体の「色」の「アクセシビ リティ」の問題を解消しました。 
 8
  9. 2016年のロゴ変更の目的
 続いて、「表示が速いか」という点でもこの↓ロゴには問題がありました。 
 web閲覧の環境が「パソコン」から「スマートフォン」に変わったことで、サイトを速く表示するためのいろん な工夫が始まりました。画像の形式の変化もその一つです。「高」解像度のスマホがどんどん出るので 「高解像度できれいな画像を作れ!でも画像サイズは絶対軽くしろ!」と言う矛盾した要求がデザイナー に突きつけられ、それを満たすためにSVGを使うようになりました。 
 
 SVGとは超ざっくり言うと「点」と「線」の情報をコードで保存したものです。

    
 では旧ロゴの「点」の数をご覧ください。 
 9
  10. 2016年のロゴ変更の目的
 その数なんと 「2613個」 でした。SVGにする意味がないくらいデータが重かったので、 
 点の数を 「207個」 まで減らしました。90%OFF! 
 10

  11. 2016年のロゴ変更の目的
 と言うことで
 
 2016年のロゴ変更の目的は、スマートフォンが主戦場に変わったことに対応するために「スマホで も使いやすいか」と「スマホでも表示が速いか」を解決するためでした。 
 
 続きまして、2022年のお話しです。 11

  12. 2022年のロゴ変更の目的
 また地味に変わりましたね、ロゴ変更が楽しいからやりたくてやってるのでしょうか? 
 12

  13. 2022年のロゴ変更の目的
 ブランディングの変化 
 
 これまでのロゴでは、くらしのマーケットの「認知 度」が低かったので「親しみやすさ」の印象をロゴ に込めていましたが、CMをたくさん放映している 今は「認知度」の次のステージ「利用意向率」を上 げるため「ちゃんとしている」印象をロゴに込めま した。手書き風のラフな線は排除し、文字もかっち

    りした印象に変更しました。 
 13
  14. 2022年のロゴ変更の目的
 耐久性の低さ
 
 2016年のロゴ変更後、イベント・CM・SNSなどこれまでロゴを使用していなかった媒体での使用が広 がり「ロゴの耐久性」が低いことに気づきました。ここでいう「耐久性」とは、ロゴが小さくても認識でき るか、暗い背景の上でも見やすいか、他のアプリアイコンと並んだ時に目立てているか、など「どこで 使ってもロゴとして機能しているか」です。 
 
 そこで、耐久性を上げるために「線」を太くして、「色」から黒を抜いて赤を足しました。

    
 百聞は一見にしかず、見てもらえるとわかると思います。 
 14
  15. 2022年のロゴ変更の目的
 少しずつの差ですが、全ての環境で 右の新しいロゴの方が認識しやすい ですよね。
 15

  16. 2022年のロゴ変更の目的
 と言うことで
 2022年のロゴ変更の目的は、「ブランディングの変 化」と「耐久性の低さ」を解決するためでした。 
 
 ロゴ変更というと右の図で言う「ライカビリティ(好き かどうか)」を追求することと思いがちですが、その 下の「アクセシビリティ」と「ユーザビリティ」をしっか り補強するための変更でした。

    
 おもしろいと思っていただけましたら、 最後に我々のプロダクト、 
 会社についてご覧いただけますと幸いです! 16
  17. 私たちのプロダクト 生活の「困った」を解決できるプロが集まる プラットフォーム「くらしのマーケット」 頼める出張サービスの種類 事業者の数 300種類以上!
 70,000事業者を突破!
 エアコンクリーニング、引越し、庭木剪定..などの生活関連サービス 日本全国の事業者が登録、売上を伸ばしている 17

  18. 私たちのビジョン 正直者が馬鹿を見ない世界を作る
 テスト前に必死で勉強したのに、先輩から過去問をもらっていた友達が自分よりいい成績を取った…
 会社のことを思って地味な仕事も引き受けてきたのに、上司に気に入られている同期が昇進した…
 
 世の中では、不条理なことが起きます。
 でも、悪賢い人が得をして、正直な人が損をする世界なんて嫌です。
 
 江戸時代の思想家、石田梅岩は「二重の利を取り、甘き毒を喰ひ、自死するようなこと多かるべし」
 つまり、悪賢い者には必ず報いがあると説きました。


    さらに「実の商人は、先も立ち、我も立つことを思うなり」とも表し、
 まず相手の利害を優先し、その結果として自身も利益を得ることが商人の本文だと説きました。
 
 私たちは、先も立ち、我も立つ、正直な人が報われる世の中を作ります。
 18
  19. 私たちのミッション 「人と人」が関わるサービスを、
 安心して取引できる仕組みを提供する
 私たちは、くらしのマーケットを通じて、
 世の中のあらゆるサービスをインターネットで安心して取引できる仕組みを提供していきます。
 インターネットでモノを買う時、みんなが楽天市場やAmazonを利用するように、
 サービスを買う時は、みんながくらしのマーケットを利用してくれる…そんな世界を目指します。
 
 多くのベンチャー企業が、自社の成長をアピールしますが、いちばん重要なことは、
 その会社がその時に「どれだけ成長しているか」ではなく、その会社が今後「どこまで成長できるか」です。


    
 みんなのマーケットは巨大な市場に挑んでいます。私たちと一緒に、大きく成長していきましょう。
 19
  20. 書いた人 2015年 みんなのマーケット入社。デザインチーム(全4名)のリー ダーをしています。「くらしのマーケット」のブラウザ、アプリ全てのデ ザインをしています。ここ数年はCM作成にも関わっています。 
 美曽作 孝裕(みそさく たかひろ) デザイナー

    最高のサービスを提供している出店者を
 表彰する「くらしのマーケットアワード」
 でアームレスリング大会の審判をする私
 20