デザイン

デザイン

【売れるモバイルアプリのデザインとは?】アプリデザイナー必見!注意すべきポイントを徹底解説!

1,441 views

読了時間 : 約3分27秒

モバイルアプリ市場は2016年には520億ドル規模になると言われており、Appleのアプリストアには68万ものアプリがひしめいています。市場が巨大なのも今後ビジネスのチャンスが増えていくことも確実ですが、成功するモバイルアプリには何が必要なのでしょう?

答えは革新的なアイデア、堅実なエンジニアリング、優れたデザイン、そしてアプリに込められた美学とも言えるこだわりです。

本記事ではアプリストアで人気の3つのアプリから、売れるモバイルアプリに必要なものは何か、掘り下げていきたいと思います。

 

以下の記事もぜひ参考にしてください。

モバイルアプリのUIデザインにおける基本画面パターン4つ【デザイン構成のポイントとは…】

【モバイル×アニメーション】デザイナー要確認!モバイルアプリにおけるアニメーション使用の基本的考え方!!

「モバイルアプリ」はどうデザインするべき?【ユーザの期待に応えるデザインとは】

 

 

1.Bad Piggies

 

大ヒットしたAngry Birdsで知られるRovio社からリリースされ、アプリの人気ランキングを駆け上っていったのが同社のBad Piggiesというゲームです。ゲームのメインキャラクターになっている子豚はAngry Birdsでも脇役として登場していましたが、その人気を受けてRovio社が新たに世に送り出したのが、子豚を主人公にしたBad Piggiesなのです。

アイコンを見ても、

スプラッシュ画面を見ても、

Angry Birdsの気配を一切感じさせないデザインになっています。過去作の成功に甘んじることなく、ブランドと商品に自信を持つRovio社の姿勢がうかがえますね。

 

もう少し詳しく見てみましょう。

ゲームのどの画面にも子豚たちがいて、ロゴにも子豚の鼻がさりげなく入っています。

子豚の色である緑を基調にしており、濃淡をつけることで画面に奥行きを出す工夫も見られます。

また、ゲームの最中では子豚がプレイヤーの指の動きを目で追ってきたり、うまくいったときに嬉しそうな表情を見せてくれたりなど、印象に残るような細かいこだわりや工夫が随所に見られます。

 

☆Bad Piggiesに学ぶこと:

・ブランドに幅と余裕を持たせて、ユーザエクスペリエンスを優先できるようにする

・ベーシックな色でも濃淡をつけて奥行きを出す

・キャラクターに個性を持たせること

・キャラクターを中心としたゲームの場合はキャラクターをブランディングの軸にして、キャラクターを最優先すること

 

 

2.DMD Panorama

 

DMD Panoramaはパノラマ写真が撮れる大人気のカメラアプリで、400万以上のダウンロード数を誇ります。

アイコンはテンプレートを使用したもので、ブランドの特色や機能を示唆する要素は特にありません。高画質なカメラのアイコンで無難とも言えます。ですがディテールが細かく、レトロな雰囲気で興味を惹かれるデザインになっています。

ブランドアピールは控えめで、エクスペリエンスも他のカメラアプリに比べてシンプルです。ホーム画面も必要最低限の情報しか表示していません。

唯一主張するボタンやギャラリーページは青を基調としており、ボタンアイコンも極めてシンプルです。

視覚的効果には乏しいものの、ユーザの撮影した写真を邪魔しないようなデザインと言えます。

 

☆DMD Panoramaに学ぶこと:

・アプリのカテゴリが分かりやすく、魅力的なデザインの高画質なアイコンにすること

・従来のアイコノグラフィに沿ったホイールにすること

・DMD PanoramaがUIやブランドよりもカメラを優先したように、アプリそのものではなく、ユーザエクスペリエンスに注力すること

・エレメントのデザインはシンプルで分かりやすい、基本的なデザインのものを採用すること

・アプリの全てが完璧である必要はないので、時にはデザインの細部よりも商品の早期リリースを意識すること

 

 

3.Maps+

 

Apple Mapsの代わる地図アプリとして人気なのが、Google MapsをベースにしたこのMaps+です。

個人的な話になりますが、このアプリを見つけたとき、私は特に地図アプリを探していたわけではありませんでした。アプリストアの人気ランキングを見ていた時に目に飛び込んできたのが、コンパスをモチーフにした真っ赤なアイコンだったのです。

アプリそのものはミニマムなデザインで、大げさなブランディングもスプラッシュ画面もありません。直接地図に飛ぶようになっていて、画面右下の小さなボタンを押して初めてメニューが出てきます。

アラーム設定、ルート検索、お気に入り登録、ツイート検索、設定画面などがあります。ヘルプボタンもありますが、それがあまり必要ないほどシンプルで分かりやすいUIです。

編集ボタンを使えば、メニューアイコンを使いやすい位置に動かすことも可能です。

それぞれの機能の利用回数に制限が設けられており、一定の回数に達すると有料版を勧められるようになります。

 

☆Maps+から学ぶこと:

・ブランディングやグラフィックを駆使せずとも、アプリの機能性を徹底的に追求してユーザの心をつかむこともできる

・アイコンデザインには手間暇をかけるべき

・ミニマリズムも選択肢のひとつ

・いかにユーザに投資してもらうかも考慮すること

・UIの一体感を崩さないように注意しながら、ユーザにカスタマイズの余地を与えること

・ユーザに伝わりやすいデザインで説明せずとも分かるようにする

・エレメントの工夫で満足感のあるデザインを意識する

 

 

※本記事は、The Aesthetics of a Successful Mobile App: Lessons From Three Top Grossing Appsを翻訳・再構成したものです。

おすすめ新着記事

おすすめタグ