少ないと思います。より良いデザイン。

管理可能な意思決定と思考プロセスにより、UIデザインのワークフローを改善します。

適切に設計されたUIは、一連の重要な決定の結果であり、エクスペリエンスを直感的にするだけでなく、ユーザーにとっても審美的に喜ばれます。意思決定プロセスをより合理化することにより、ワークフローを容易にし、最適な結果を生み出す可能性を高めることができます。

設計プロセスで利用できる可能性が多いほど、実行とフィネスに必要な思考が増えます。

アメリカの心理学者バリー・シュワルツは、選択肢の排除が不安を大いに減らすことができると選択のパラドックスで書いた。彼は、私たちには標準と基準があるべきだと主張しましたが、より良い何かがあるかもしれないという可能性については心配しません。それは消費者という文脈でしたが、デザインの決定にも当てはまると思います。

最大化戦略は、実際には完璧主義者ではなく、最適なエクスペリエンスを集合的に作成する最も有利な意思決定を可能にすることです。

1.変数の制限

すべての潜在的な変数を考慮して高忠実度の概念を作成し、多くの可能性がある場合、それらを早期に制限および定義する必要があることが明らかになります。利用可能な選択肢の数を減らすと、決定が容易になります。

経験を積むことで、特定の変数グループを制限することで、コンポジション全体にどのような相乗効果があるかを予測しやすくなります。

選択肢を減らすことは、独創性を減らすこととは関係ありません。事前定義されたルールを中心にコンセプトを作成することは制限ですが、設計者として独自のルールを確立し、それらのルールを完全に制御できることを前提としています。

スケールと間隔

UIデザインのあらゆる側面は、リズムを促進し、プロジェクトの成長に合わせてスケールとスペースの一貫性を維持するのに役立つシステムを中心に展開する必要があります。私が使用するのが好きなシステムの1つはモジュラースケールです。これにより、任意の比率からスケールを作成して、コンポジションの要素またはネガティブスペースのサイズを測定または設定できます。

比率を選択すると、モジュラースケールにより、スケールと間隔の定義が容易になります。

グリッド、タイポグラフィ、垂直方向の間隔、レイアウトの全体的な寸法の変数を管理可能なレベルまで減らすことができますが、心地よい審美性とリズムも提供します。 UIの設計ははるかに簡単です。

グリッド

グリッドシステムは、コンテンツが水平面内で整理される方法を制限するのに最適であり、UIに関しては非常に簡単です。ただし、グリッドは多くの場合、あまり考えずに選ばれ、万能サイズになります。ほとんどのデザイナーが気付いていないのは、コンテンツを中心に構築されたグリッドシステムを作成する方が良いということです。

グリッドシステムはレイアウトの変数を削減します

これは、理想的には、コンテンツシナリオを事前に明確に理解し、特定のグリッドのコンテンツをより適切に提供する方法を描くことを意味します。特定の間隔の規則と要件があるロゴや特定の固定単位の広告など、既存の資産とブランドガイドによるビジネス上の制約を考えてください。

コンテンツの種類も要因です。ショップ、ニュース出版物、ブログのレイアウト、または簡単なスプラッシュページのレイアウトには大きな違いがあります。画像が多いレイアウトと単語が多いレイアウト。目をスキャンするパターンと、それらが視覚的階層にどのように影響するかを理解することは役立つでしょう。

ビジネスおよびコンテンツの制約を事前に理解しておくと、グリッドシステムを選択してレイアウトを決定するのが容易になります。

タイポグラフィ

タイポグラフィはUIデザインの最も重要な側面であり、Webの最大95%を占めることができ、コミュニケーションの原動力になると主張します。

モジュラースケールのようなシステムはサイズとリーディングに適用できますが、フォントファミリとスタイルも制限できます。 UIは、2つのファミリと2つの重みを超える必要はありません。ルールは、正当化とタイトルケースの処理方法に拡張することもできます。

パレットで熱心になりがちです。小さい範囲のトーンは、十分で一貫した視覚効果を生み出すのに大いに役立ちます。通常、出発点に必要なのは5つのスウォッチだけです。

Adobe Color CCなどのツールを使用すると、パレットを簡単に事前定義できます

ほとんどのブランドは、原色またはアクセントカラー、およびそれを補完するいくつかのニュートラルまたは対照的なトーンを組み込む必要があります。特に最初は、1トーンの15の色合いは必要ありません。小さいうちから始めて、1日か2日後に日陰を増やした方が良いでしょう。

画像

画像をUIに組み込む方法は、主にコンテンツのコンテキストによって決まります。それが何であるかの大まかな概念がある場合、比率、サイズ、形状、および処理の変数を使用して、画像の開始点を作成できます。それほど多くは必要ないかもしれません。

イメージ変数を制限すると、一貫性が強化され、長期的にイメージ資産を管理しやすくなります。図像についても同じことが言えます。

実際に必要な画像の比率とサイズのバリエーションはいくつですか?

2.以前のスタイルガイドの作成

UIプロジェクトが概念的に成長するにつれて、スタイルガイドまたはパターンライブラリを作成して維持することがますます重要になります。これにより、プロジェクトの規模を拡大し、リズ​​ムと一貫性を維持するための設計原則が確立されます。事前に変数を定義している場合、それらを文書化するのに良い方法です。スタイルガイドを使用すると、スタイルガイドを使用しない場合よりも、将来の意思決定が容易になります。

プロジェクトによっては、スタイルガイドの作成は贅沢であり、非常に多くの場合、今後の参照を目的としています。これが、ほとんどのスタイルガイドが土壇場で、またはプロジェクトの完了後にまとめられる理由です。しかし、将来の設計と開発を支援するためのスタイルガイドの合理化と推論はたくさんありますが、実際には概念化の初期段階で忠実度を高めるのに役立ちます。

基本的なスタイルガイドを最初から作成することは、設計上の決定を減らすための原則を早期に確立するだけでなく、今後プリンシパルを進化させ、強化するためのインフラストラクチャとしても役立ちます。

最初に作成しても、完全である必要はありません。いずれにせよ、スタイルは初期段階でより進化する傾向があり、プロジェクトが大きくなればなるほど、境界はより明確になります。

3.モジュールベースの優先度と適応

Brad FrostのAtomic Designなどのモジュールベースの設計システムでは、特定の重要な領域からレイアウトを作成できます。モジュールは、さまざまなレイアウト全体で再利用可能になります。インターフェイスはページではなくシステムとして扱われ、パターンベースの設計と開発がプロセスの大部分を占めます。

これは優れた方法論であり、UIデザインをより管理しやすくしますが、より効果的にするためには、重要な領域に優先順位を付け、他のすべてを適応させる必要があります。これにより、視覚的な一貫性が確保されます。

キーエリアを特定する

私たちのデザインは重要な部分を中心に展開する必要があります。各エリアの優先度は、インターフェイス内のコンテンツまたは機能によって決定され、本質的にパズルの鍵となります。

最初に重要な領域に焦点を当てることにより、その後の領域は曲がって確立された環境に適応する必要があるため、その後の設計上の決定を減らしています。

キーエリアに焦点を当てる

優先度の高い領域が特定されると、重要な部分に重点を置き、完成するまで細かく処理します。重要性の低い分野に適応する前に、直感的ですべての要件を満たしていることを確認することです。

4.みんなのために機能させる

デザイナーは何千年もの間、1つのこと、つまり効果的なコミュニケーションを行うことに努めてきました。視聴者との視覚的および聴覚的なコミュニケーションを改善するための方法を継続的に改革し、微調整しています。

できるだけ多くのユーザーからの情報へのアクセスが増え続けているため、できるだけ多くの種類の人々へのアクセシビリティを最大化することが不可欠になっています。

アクセシビリティは変装の祝福です

より多くの視聴者に対応することは、より多くの仕事のように聞こえます。また、アクセシビリティを革新への障壁と見なすことは魅力的です。ただし、最新の標準に準拠することは、特にそれらが第二の性質になった場合、変装の祝福になる可能性があります。

設計用語でのこの例には、ボディコピーで最小フォントサイズ、コピーと背景の間のかなりのコントラスト、またはタッチデバイスでより大きなリンク可能領域が必要なことが含まれます。

障害だけではありません

アクセシビリティは、一部の人が暗示するように障害に対応しているだけでなく、最新の機能や拡張機能をすべてサポートしていないレガシーデバイスやブラウザを使用しているユーザーにも対応しています。これらの標準を意識し、それらを遵守することは、設計上の決定を自然に減らします。

5.試行およびテストされたパターンの使用

実際、ユーザーは、長年の練習と博覧会で吸収した何百もの一般的なデザインパターンに準拠していると、直感的なインターフェイスを見つけます。典型的な金型から脱却し、新しい領域を踏み出すとすぐに、新しいパターンが大衆にとって完全に直感的になるまでに時間がかかることがあります。

オリジナルのUIパターンを作成する時間と場所がありますが、一般的なテクニックを敬遠しないでください。それらは理由があるため成功しています。

銀色の裏地は、再発明の心配を減らし、美学に専念するためのものです。確立されたパターンに基づいてオリジナルの作品を作成することはまだ可能です。

成功する設計パターンを知り、統合すればするほど、設計者として行う必要のある選択は少なくなります。何がうまくいくかを必ずしも考えているわけではありませんが、何がうまくいくかを考えています。

最終ノート

これらのアプローチの中には、個々に思考や意思決定を大幅に削減したり、設計を大幅に改善したりしないものがあります。ただし、それらを一緒に組み込むことで、その過程で適切なフィードバックを得ることができ、より良いUIの設計が大幅に簡単になります。

Twitterでフォローしてください