アイコンは、モバイルアプリケーションのクリック率 (CTR) に関して非常に重要な役割を果たしてます。 現実世界と同様に、App Storeでも第一印象はとても重要な意味を持っています。 App StoreとGoogle Playには200万種類以上のアプリが存在するため、最適化されたアイコンを用意し、競合他社のアプリから自社のアプリを目立たせることが重要です。この記事では、アプリアイコンを目立たせるためのヒントを 9 つに渡ってご紹介させていただきます。
誰もがユーザーの関心を集め、アプリをダウンロードしたくなるようなアイコンを作成したいと考えるはずですが、 実は単に個性的なアプリアイコンをデザインするだけでなく、アプリの主な機能を表現するようなアイコンを作成することが重要なのです。 それでは、最適なアプリアイコンをデザインするために重要となる9つのヒントを見ていきましょう。
F[包括的なガイドラインに従って、iOSとAndroid上でのアプリ製品ページのすべてを最適化しましょう (英語)]
1. デザインはシンプルに
人は、自分の欲しいものを手に入れるために必要な最も簡単な方法を求めています。 そのため、アイコンは分かりやすくシンプルなものにする必要があります。 直感的に理解できないような、複数の機能や多数のディティールを持ったアイコンは好ましくありません。アイコンが複雑すぎるとユーザーが混乱してしまい、アプリの内容が伝わらなくなってしまう可能性があります。
たとえば、Google Playで上位に位置する無料ゲームは、1つのオブジェクトのみに焦点を当てたシンプルなデザインを特徴としています。
デザインがシンプルなアイコンの例。日本のGoogle Playでの無料ゲームパズルカテゴリのトップ 5です。
2. 鮮やかな色を使う
アプリの色を選択する際は、まず自社ブランドに合った色であるかどうかを確認します。 その後で、検索結果の中でアイコンが目立つようにするにはどうすればよいかをじっくりと考えてみましょう。鮮やかな色はアプリにポップな印象を与えるため、ユーザーの注意を引きつけやすくなります。色の数も多くなりすぎないようにします。メインカラーは1色から2色で十分です。シンプルなアイコンは、複雑なアイコンよりもはるかに多くのコンバージョンをもたらします。
下の例では、PicCollageとPicsartの明るい色彩が競合アプリとの違いを際立たせています。また、Zaimやマネーフォワードもユーザーの注目を一目で集めています。
鮮やかな色を使用して目立たせることに成功しているアプリの例。 日本のApp Storeでの「写真加工」と「家計簿」のライブ検索結果です。
また、競合アプリを研究し、そのカラーパターンを分析してみましょう。 この手順をスキップすると、アプリアイコンが競合と同じようなデザインになってしまうという問題が発生します。 工夫を凝らして、アプリを際立たせるような配色やデザインを選び抜きましょう。
たとえば、Google Playで「news」というキーワードで検索してみると、上位にランクインしているニュースアプリのうち4つが赤をメインカラーとして使用していることが分かりました。その結果として、どのアプリも目立たなくなってしまっています。
アメリカの Google Playでの「news」のライブ検索結果。 ほとんどのアプリが赤色を使用しているため、目立たせることができていません。
各カテゴリの上位にランクインしているアプリにおいて、最も使用されている色を見つけましょう (英語)
また、アプリにライトとダークの両方の外観を採用するのも有効です。ライトモードのインターフェースとダークモードのインターフェースでは、使用されている色調が大きく異なります。ライトモードでは上手く機能している色でも、ダークモードでは見づらくなってしまう可能性があります。
3. 文字を入れすぎない
アプリアイコンは、それ自体でユーザーに理解してもらえるのが理想です。「百聞は一見にしかず」ということわざがありますが、これはアプリアイコンの作成についても言えることです。 アイコンは、一般的に言葉が入っていない方が良い印象を与えます。 言葉を無くすことでより多くのクリックを生み出し、混乱も少なくなります。
モバイルデバイスでは、アプリが比較的小さく表示されることにご注意ください。文字が多いとアイコンがごちゃごちゃしてしまい、何のアプリなのかが分からなくなってしまいます。また、新しい国でアプリをリリースする場合にテキストを使用すると、ローカライズに関連する問題が発生する可能性があるため、注意が必要です。
たとえば、カジノゲームでは、様々な色を組み合わせて使用したり、アイコンにテキストを入れたりする傾向があります。元々のカジノが五感を刺激するためにこのようなデザイン採用していることが理由ではありますが、このような派手なデザインはアプリストアではごちゃごちゃした印象を与えてしまうため、検索結果の中でアプリを目立たせる場合には必ずしも効果的ではありません。
アプリストアで文字が原因で読みにくくなってしまっているアイコンの例。日本のApp Storeでの「カジノゲーム」のライブ検索結果です。
4. ブランド力が強い場合にのみロゴを使用する
アプリの開発者が、自分たちのブランドのロゴをアプリアイコンとして使用するのはどうだろうかと考える場合があります。この方法を使用すると、より強力なブランドロイヤルティと強いイメージを生み出すことができます。 理想的なケースではありますが、あなたのブランドがすでにかなりの人気があり、卓越したビジュアルアイデンティティを保有している場合 (例: Nike、Snapchat、Vine、Spotify、Tinder など) には、とても効果的です。
ただし、一般的に広く知られていないロゴについては、追加はお勧めできません。ユーザー対してアプリを即座に認識させることがアイコンの目的ですが、ロゴが認知されていなければ注目を集めることができず、ユーザーはアプリをスキップしてしまいます。
たとえば、「配達」と検索した場合に上位表示されるアプリは、名前やロゴがよく知られている有名なブランドばかりです。 こういったブランドがアイコンにロゴを使用することで、ユーザーが検索結果の中からアプリをすぐに認識できるようになります。 一方で、ユーティリティーアプリはアプリストアでのブランド認知度が低い傾向にあります。 そのため、ブランド名やロゴを使用するよりもアプリの内容がシンプルに表現されたアイコンを使用する方が効果的です。
フードカテゴリの中でアイコンにロゴを使用しているアプリと、ユーティリティーアプリを比較した例。日本のApp Storeでの 「配達」および 「バーコード」のライブ検索結果です。
5. ダークモードに対応したデザインを用意する
iOS 13で、Appleは最もユーザーの期待を集めていた機能の1つである「ダークモード」を発表しました。 ダークモードでは、画面、コントロール、メニューなどを含むシステム全体の外観がすべて暗くなります。そして、アイコンをデザインする際にはこのモードを念頭に置いておきましょう。白や黒の背景に溶け込んでしまわないように、アイコンを目立たせる必要があります。最初から色の設定を頭に入れておくことで、後に発生する問題を最小限に抑えることができます。
App StoreのライトモードとダークモードでのAmazon Musicのアプリアイコンの比較。
6. 季節に合わせてアイコンをアップデートする
ハロウィーン、クリスマス、正月などの特別な休日に合わせてアイコンを更新することは、とても重要です。 これにより、常に新しい機能を実装し、ユーザーとのコミュニケーションを図っていることをユーザーに対してアピールすることができます。 ユーザーは、企業が時間と労力をかけて季節に合ったアップデートを公開してくれることに好感を持ってくれるはずです。
こういったアイコンのアップデートについては、必ずしもデザインを一新する必要はありません。 たとえば、Trivia Crackを例に挙げてみましょう。 このアプリのアイコンは、季節や特別な行事に合わせて頻繁に変更されます。すべてのアイコンが似通っていて親しみやすいにもかかわらず、季節感が際立っていることにお気付きになるかと思います。
Trivia Crackは、アイコンを頻繁に更新することによってユーザーの共感や関心を集めています。
App StoreとGoogle Playでのゲームアイコンの主なトレンドをチェックしましょう (英語)
7. 競合他社のアイコンとの差別化を図る
アイコンを作成する前に、競合他社の動きをチェックしてみると良いかもしれません。 他社のアプリよりも自社のアプリが優れている点については、ユーザー目線で考えなければなりません。競合アプリをチェックすることにより、アイコンの差別化や改善につながるヒントを得ることができます。アイコンに独自の価値を持たせることによって競合他社との差別化を図ることが、最終的な目標なのです。
次の例では、ナンプレde懸賞が他のクロスワードパズルゲームとは異なる色調を用いることによって、検索結果の中で目立つことに成功しています。 また、「クッキング」で検索を行うとハンバーガーのピクトグラムを使用したアイコンが検索結果の上位に表示されます。検索結果の中で目立っているの唯一カレーのデザインを採用したクッキングママゲームです。
差別化を図ることで競合アプリよりも目立つことに成功したアプリの例。日本のApp Storeでの「数独」と「クッキング」のライブ検索結果です。
8. 競合他社のA/Bテストから学ぶ
AppTweakを使用すれば、競合他社のA/Bテストをチェックし、効果的な手法を学び取ることができます。タイムライン機能を使用することで、アプリがA/Bテストを実施しているかどうかを自動的に識別します。そしてそれをさらに掘り下げて、どのバージョンに対してテストを実施しているのかを把握することも可能です。
さらに詳しく説明するために、GardenscapesがA/Bテストをアイコンのデザインに対してどのように活用しているのかについて、簡単な調査を行いました。Gardenscapesはアイコンを何度も変更しながら様々な背景、感情、状況、色をテストし、アプリへのトラフィックを最も増やすことができるアイコンについて調査を行っていました。
Gardenscapesでは、コンバージョン率を高めるためにアイコンのA/Bテストを採用しています。
9. デザインをテストし、そこから学ぶ
アイコンをデザインする際には、個人的な好みや偏見がコンバージョン率に影響を与えないように注意しましょう。 アイコンのデザインについては常にA/Bテストを実施し、ユーザーにアプリをダウンロードしてもらうために最も効果的なアイコンを把握しましょう。
色や背景などを含む様々な要素や、その他数多くの特徴や個性などについてテストを実施することが可能です。
アイコンのデザインは難しいものですが、これらのヒントがみなさんのストレスを少しでも軽減できたならば嬉しい限りです。コンフォートゾーンから外に飛び出し、恐れることなく自分のブランドと本当に共鳴するアプリアイコンを創造していきましょう。 みなさんが作成したアイコンを見るのが、本当に楽しみです。
Related posts
Rina Yoshida
Rina Yoshida
Rina Yoshida
