始めに
モバイルアプリをデザインする上での良い出発点は、プラットフォームガイドラインを学ぶことです。iOSとAndroidのそれぞれには、アプリがどのように見えるべきか、どのように動作するべきかを詳細に定めたデザインパターンがあります。
ガイドラインは、ユーザーと共通の視覚言語を話す手助けをしてくれます。それにより、アプリがネイティブのように感じられ、親しみやすい体験を提供します。
どの程度それらに従うかはあなた次第です。AirbnbやUberのような多くの大きなアプリは、それぞれ独自の視覚スタイルを持ちながらもネイティブのように感じられます。しかし、これまでにアプリをデザインしたことがない場合は、できる限り近くに従うことをお勧めします。それにより、各プラットフォームの感覚を得ることができるでしょう。
iOSガイドライン
iOSガイドラインは、Appleの「ヒューマンインターフェースガイドライン（HIG）」という、より広範なデザインガイドラインの一部です。これは、Appleエコシステム向けの直感的で視覚的に魅力的なインターフェースをデザインするための青写真です。HIGは、シンプルさ、ナビゲーションのしやすさ、テキストの読みやすさ、UI要素の直感的な使用、コンテンツへの集中を推奨しています。
始めるには、この6分間のWWDCビデオを見て、ウェブサイトを通じて調べることをお勧めします。別の素晴らしい方法は、iOSのUIキットに深く入り込み、さまざまなコンポーネントを組み合わせて試すことです。
Androidガイドライン
Appleと同様に、Googleにも独自のデザイン言語とパターンがあり、それを「マテリアルデザイン」と呼びます。情報とアクションの階層を作り出すために、鮮やかな色彩やグラフィック要素、動きを使用することを奨励しています。
マテリアルは、要素の重要性を高揚感や影を使用して伝えるために奥行きを使用します。このアプローチは、視覚的な手がかりでタッチに反応することで、アプリを物理的な世界に似せることを目的としています。
Googleは、ガイドラインを探究し、コンポーネントを学ぶための専用のウェブサイトを制作しました。
デザインツール
画家が筆とキャンバスを必要とするように、アプリデザイナーは適切なツールが必要です。FigmaとSketchは、デザイナーにとっての定番エディタとなっています。これらには学習曲線は高いですが、習得すると強力な機能を提供します。
どちらもベクトルベースであり、アイコンから複雑なマルチスクリーンインターフェースまで、すべてをデザインできます。どちらも幅広いプラグインのエコシステムを備えています。Figmaはブラウザベースであり、MacやPCどちらでも使用できる一方、SketchはMac専用のネイティブアプリです。
次にお勧めするツールは、Bananiです。これは、シンプルなテキストプロンプトからモバイルアプリのUIを生成するAIです。編集ソフトを学ぶために何時間もかけずに、数分でさまざまなアイデアを探ることができます。
アプリをデザインする際、アイコンが必ず必要になります。Appleは、SF Symbolsという専用のアプリをリリースしました。これを使って、プロジェクトのために必要なアイコンを何でも見つけることができます。
UXの基本
どのインターフェイスデザインにおいてもそうですが、良いモバイルデザインはユーザーの問題を最良の方法で解決することです。アプリは一貫性のある外観やフィーリングを保ち、シンプルで直接的な言語を使用し、ユーザーのアクションにすぐにフィードバックを与えるべきです。
Nngroupは、デザインパターン、情報アーキテクチャ、インタラクションデザイン、その他多くのUX関連トピックを学ぶための素晴らしいリソースです。
Growth.designは、インタラクティブ漫画の形でケーススタディの驚くべきコレクションを持っています。日々使っているアプリを詳しく見ていきます。私は、熟練したデザイナーであるにもかかわらず、時々心理学の原則をリフレッシュするためにそこに戻ってきます。
画面上のすべてのデザイン要素は目的を果たします。色の選び方からタイポグラフィまで。要素は一緒に機能して、ユーザーをアプリ内で誘導し、複雑なものをシンプルに感じさせます。
インスピレーション
参考を見つけ、インスピレーションを保つことはデザイン作業の大きな側面です。それによって、最良のパターンを見つけ、アイデアの流れを維持します。
デザイナーは、自分の作品をDribbbleやRead.cvのようなプラットフォームに投稿しています。参考にするだけでなく、デザインコミュニティへの素晴らしい紹介にもなります。Pinterestはインターフェイスデザインに焦点を当てていませんが、あらゆる視覚的インスピレーションを見つけるのに素晴らしいものです。
確立されたパターンを再利用する方が、新たに車輪を発明するよりも良い場合が多いです。この目的のために、Bananiをおすすめします。これは他のアプリからの10万以上の画面のコレクションを持っており、インスピレーションや出発点として使用できます。
まとめ
デザインの美しさは、あなたのアイデアが現実化するのを見届けることにあります。この記事がモバイルアプリをデザインするための出発点の概要を提供できたことを願っています。
UXをより深く掘り下げたい場合、私はキーとなるUXデザインの法則と原則の概要も作成しました。
