UIおよびUX 2019の設計動向

J.HUAによるイラスト



1年前、モバイルUIのデザインの傾向を予測しました。 今年、私たちはモバイルインターフェイスの境界を越えることに決めました。なぜなら、モダンなデザインのナンバー1トレンドがコンテキストだからです。 これ以上一般化する必要はありません-現在はすべてがコンテキストに関連付けられています。

テクノロジーの開発と、ユーザーに提供される製品がどのように機能するかについての理解が深まりつつあるようです。

遅かれ早かれ、私たちは販売するものだけでなく、私たちが生産するすべてのものを作成するために使用されるユニバーサルデザインの哲学を開発します。 私たちの国のイメージでさえ、あらゆるものに優れた設計ソリューションが必要です。 しかし、将来については話しましょう。 2019年のインターフェース設計の主な傾向を見てみましょう。



軟膏にハエがなければ、単一のトレンドはできません。すべてが適度に良好であることを忘れないでください。

強力なブラウザ

ブラウザは、単にインターネットを閲覧する手段ではなく、ユーザーに影響を与える手段です。 ブラウザはさらに高速で、強力で、魅力的です。

• ベンチマークとベンチマークは、ほとんどの一般的なブラウザでパフォーマンスが大幅に向上することを示しています。
• 速度の向上は、 ストリーミングコンパイルを通じて設計に大きな影響を与えます。 Mozillaによると、新しいコンパイラーは前のコンパイラーの10〜15倍高速です。
• 最新のブラウザはすべて、WebGL 2テクノロジーをサポートしています。これにより 、3Dテクスチャ、オブジェクトレンダリング、フラグメント深度、頂点配列を新しいレベルに引き上げることができます 。

モバイルデバイスとPCの両方のブラウザの機能は、概念設計と現実のギャップを埋めるのに役立ちます。

evolutionoftheweb.comが2012年に停止したことは非常に残念です。 この回路は素晴らしい





はい。ただし、これらのブラウザーの調整はすべて、業界全体の発展ではなく、個々の製品のプロモーションを目的としています。 インターネット上で非常に多くのことが行われているため、ブラウザ開発者がすべての問題に対して普遍的なソリューションを考案することは困難です。



ブラウザがどれほどクールであっても、作成が不十分なサイトにアクセスすると、無能なUXがそれを台無しにします。 ブラウザの可能性を解き放つには、より優れた設計ソリューションが必要です。

多くのサイトの嫌なデザインのため、ブラウザは悪いソフトウェアのように見えます。

意味のあるアニメーション

ブラウザーの新機能のおかげで、アニメーションは本格的な設計リソースになり、オブジェクトの単純な動きがなくなりました。 インタラクティブデザインとして知られる分野には、心理学と生物学の要素だけでなく、デザインの多くの側面が含まれています。



この方向が2019年にさらに発展することは間違いありません。 複雑さは、デザインにおけるアニメーションの主な特徴です。 それがなければ失われるであろう膨大な量の情報を運ぶのは、要素と遷移の動きです。

以前は、画面間のスペースには所有者がいませんでした。 今ではあなたのものです。

Zhenya Rynzhukによるブログデザイン



クライアントをより深いレベルで関与させるとは、インターフェースとのやり取りの瞬間にクライアントを同伴し、1秒も失わないことを意味します。 デザイナーは、悪いマーケティングによってだめになるまで、空のスペースを使用する機会を熱心に取り上げます。



しかし、インタラクティブデザインの関心はさらに広がります。 今日、それはブランディングの不可欠な部分となっています。 ロゴは、経験の影響下で私たちの想像力の中で形成されるトーテムと同じです。 正しい方向に向けることで、この想像力を自由に制御してみませんか？





エドゥアルド・ミハイロフによるアニメーション

ロゴが何で構成されているのか、どのような味がするのか、何の匂いがするのか、どのように聞こえるのかを考えたことがないなら、今がその時です。

アニメーションは、照明、マテリアル、要素のレイアウトよりも雄弁です。1つのアニメーションでストーリー全体を伝えます。 ロゴをあなたの個人的なストーリーの一部にできるなら、それを手に入れてください。





ZlatkoKelemenićによるLakko社のロゴ





はい。ただし、アニメーションもコンテキストで見る必要があります。 デザイナーとして見るものは、顧客が見るものと同じではありません。 製品が純粋に実用的である場合、または緊急事態に対処する場合、アニメーションは使用しないでください。 競合が発生した場合は、常に中立を選択してください。

アニメーションを衝動的に作成しないでください。

3Dインターフェイスと深度効果面

コンピュータグラフィックスと3Dレンダリングを使用したビデオと画像の変更は、かなり前から行われています。 以前は、設計者は、速度とパフォーマンスのためだけでなく、利便性のために、UIで複雑な3Dモデルを回避しようとしていました。 新しいブラウザにより、3Dは贅沢品ではなくなり、Webサイト用の映画のようなシーンを作成できるようになりました。

インターフェイスの3Dグラフィックは、現実とデジタルアニメーションの境界線を曖昧にします。

この傾向は、以前は視覚化が困難であった複雑なプロセスを扱う企業にとって特に役立ちます。 3Dビジュアライゼーションを使用すると、あらゆる技術プロセスの内部を調べて、より高いレベルの理解を得ることができます。





Sanu SagarによるBaker Hughesのレンダリング



3D画像は短時間で済むため、映画やゲームでは印象的です。見た目ではなく表面的な印象を与えるように設計する必要があります。 思慮深いアニメーションとともに、3Dは強力な設計ツールになります。



モバイル業界では、新しいチップにより、3Dオブジェクトのレンダリングだけでなく、インターフェイスでの使用も可能になりました。 これには小さな画面が理想的です。





Gleb Kuznetsovからのカードの3D遷移





Minh Phamからの3Dメニュー回転



UIのフラットなデザインは、過去5年間で大きなトレンドであり、それ以来ほとんど変化していません。 最近、フラットなデザインに深さを追加する方向への明確なシフトが見られましたが、基本的な概念には影響しませんでした。



フラットなデザインの外観を引き起こしたのは深さの存在であり、その理由は簡単です。私たちの周りの世界を理解するためには、象徴性が必要です。 飛行機は非常に象徴的です。

深度効果平面は、設計における平面の再考です。

ユーザーは、リアル3Dとコンピューターグラフィックスの組み合わせが気に入ったため、リアルなオブジェクトとやり取りすることができました。 フラットなデザインはこれを可能にしますが、彼はいわゆる疑似3次元または疑似3Dを使用して独自の方法でそれを行います。 実際、これは平面の階層化であり、立体感を生み出します。 フラットデザインのボリュームエフェクトは、影、照明、反射によって作成されます。





マイクによるARTAギャラリーのロゴ| クリエイティブミント



PrincipleまたはAfter Effectsを使用して作成できる擬似3D効果が人気を集めています。





マルクス・マグナソンの宇宙飛行士



2019年には、スキューモーフィズムの意外な復活さえ見ることができます。 平面が深度効果を持つことができる場合、それは同様に等尺性である可能性があります。 リアリズムと平面シンボリズムの組み合わせは、まだ調査されていないトレンドです。





はい、しかし遅かれ早かれ、ユーザーに提供するものはなくなります。 すでに、3Dインターフェイスには明確な開発の方向性がありません。 彼らは同時に、簡素化と複雑化に向かっています。 私たちに感銘を与えるには、ますます多くの技術的努力が必要であり、クレイジー-そしてそのシンプルさでエレガント-コンセプトを与えるために並外れた勇気が必要です。 同時に、最も複雑なインターフェースに意味がないか、少なくともオリジナルのアイデアがなければ、誰もそれを必要としません。

素晴らしい画像を作成できます。 彼らに人間性を加え、より深刻な問題に対処する時が来ました。 これをどうやってやるの？

シュールなデザイン

これらの3Dおよびインタラクティブデザインのすべての新機能は、感情的な反応を引き起こすことができない場合、一銭の価値はありません。 皮肉なことに、ユーザーは製品の複雑さに感心していません。 しかし、人々はその自然な魅力のために不適合になりがちです。

私たちは常に、主流とは対照的な何か、彼の肩に座っている一種の悪魔を必要としています。 そして時々、私たちはただ馬鹿にしたいだけです。

再設計を決定したいくつかのサービスのデザインとイラストは、可能な限り大胆になりました。





ジョーモンテフスコによるMailchimpの 「Shop Small」



イラストとUIの漫画スタイルには明確な目標があります-独創性を強調することです。 あなたのブランドが人気がある場合、この方法であなたはそれをさらに興奮させることができます。 誰がデザインを目指していようと、奇妙なことにしましょう-これはまさに「ugい」方が良い場合です。 2019年はさらにアバンギャルドなデザインをもたらしますのでご安心ください。





はい。ただし、すべての企業がそのような勇気を持っているわけではありません。 観客が多ければ多いほど、デザインは中立になります。 確立されたブランドが幸運であったとしても、中小企業は慎重に行動し、慣習に従わなければなりません。



最初にファン層を構築してから、新製品のビジョンで彼らを驚かせます。

グラデーション2.0、鮮やかな色、暗い背景

新しい画面には驚くべき色の再現性があり、マーケティング担当者はデフォルトの壁紙でもこれを実証しています。 デザイナーは、UIに壮大なグラデーションを適用する可能性と、そのようなインターフェイスの可用性を調査しています。

グラデーションはもはや注意を引き付けるのに役立ちません。それらは、インターフェイスにボリューム効果を与えます。

エディ・ロバノフスキーによるGrabient 2.0



Gradient 2.0は非常にシンプルです。 色の組み合わせを使用し、特定の光源を持ち、形状と組み合わせて奥行き効果を作成します。



ジューシーな色も用意されています。 この傾向により、色と異なるレイヤーの組み合わせが増えます。 さらに、モノクロパレットであっても、ボリュームエフェクトを追加すると、より美しくなります。





J.HUAによるTunanの 「Valley」

私たちは信じられないほど悲観的になり、豊かな色が前向きに設定されました。 この暗号通貨アプリを信頼しますか？

uixNinjaの暗号通貨アプリ



鮮やかな色とグラデーションは、暗い背景に対してさらに印象的に見えます。 暗いテーマは深刻で、長い間、さらに美しくなります。 ここでは、デザインの暗いテーマと、人類学の観点からの成功の秘aboutについて書きました。



したがって、2019年には、暗いUIのアクセシビリティと美的アピールのバランスを見つけることに成功した人々は、特に成功するでしょう。

深みのある効果、鮮やかな色、3Dを備えた平面-すべてが暗い背景です。

uixNinjaのダッシュボード





はい。ただし、グラデーション、カラーパレット、ダークテーマの問題はアクセシビリティだけではありません。 明るい色には伝統的にアクセントがあります。 すべての要素が色付けされている場合、1つのことを選択する方法は？ すべてのユーザーがOLEDスクリーンにアクセスできるわけではなく、一部の勾配が失われる可能性があり、コントラストが高すぎると視力の焦点が妨げられる可能性があります。 また、暗いテーマは晴天には適していません。 しかし、多分これはプラスです...

可変フォント

フォントは伝統的に、限られた数の変更可能なパラメーターを持つ静的要素として認識されます。 デザイナーとライターは、小文字の高さ、ストローク、文字の幅のコンテキストで読みやすさを考慮する必要があります。



製品の絶妙なフォントデザインを作成するには、すべてを細かく検討する必要があります。 プロジェクトで複数のフォントを使用する場合、使用するすべてのスタイルのファイルを提供する必要があります。 可変フォントの場合、必要なスタイルの数が無限であるファイルは1つだけです。

可変フォントは、任意のテキストスペースを埋めることができます。

Font Marvin Visions



レスポンシブデザインとローカリゼーションでは、さまざまなフォントが活躍します。デザイナーは、テキストを小さな画面に詰め込む方法、または逆に、別の言語に翻訳すると文字数が少なくなった場合にストレッチする方法について頭を悩ませていました。





ジョシュ・リナードによる「投票」



Webフォントが最初に登場したとき、レンダリングに問題がありました。 これにより、可読性の問題とマークアップのゆがみが生じました。 可変フォントはより高速にロードされ、一般にその使用により設計プロセスが高速化されます。

そして、これはほんの始まりに過ぎません。 可変フォントの芸術的使用については、2019年に引き続き検討されます。

Typography.Guru





はい、しかし、スマートフォントが経済的利益をもたらすのにどれくらい時間がかかりますか？ また、テキストが既存のすべてのデジタルコンテンツに似ている場合、読者を改ざんから保護するものは何ですか？ 指定されたパラメーターを持つテキストが初めてタイポグラフィーに登場しました。 これにより、人類は原稿を情報を保存する信頼性の低い方法として放棄し、 読書を進歩の最も重要なエンジンの1つにしました。

figma

「デザイナーもプログラミングする必要がありますか？」そして「開発者はUXを理解する必要がありますか？」という永遠の質問をするときです。すべては単純です。デザインの実装中に意見の相違を避けることが重要です。 そのため、結果に焦点を当てている場合は、それを達成する方法について考える必要があります。



プログラミングを学ぶことが最も論理的です。 独自の設計を実装すると、多くの問題を回避できます。 ただし、優れたデザイナーであると同時に有能な開発者になるには、膨大な知識が必要です。 引っ張ってもらえますか？ 喜んで。 そして、それを買う余裕がない人のために、他の選択肢があるはずです。

ポイントは、普遍的なデザイナーを連れてくることではなく、高品質の製品を作成し、そのプロセスを楽しむことです。

この目標を達成する別の方法は、効果的なツールを使用して促進することです。 figmaはまさにそのようなツールです。 以前は、デザイナーは多くの要素を考慮しなければなりませんでした：OS、ビルド、プラグイン、同期、共同編集、そして最後に、すべてを1か所にまとめる方法。 このような複雑なワークフローを設定できた人は尊敬に値します。 しかし、もっと簡単なものが必要です。





アレクセイ・コルピコフによる「完全にfigmaへの切り替え」



figmaは、デザイナーのためにデザイナーが作成したツールです。 懐疑論の波に遭遇し、すべての期待を超えました。

figmaはSketchを破壊しました。

彼女は、SketchとAdobe XDが行うすべてを行うことができます。 最も重要なこととして、Figmaは実装が簡単なプロジェクトを作成することを目指しています。 各Figmaコンポーネントは、APIを使用してReactコンポーネントに変換し、フロントエンドに実装できます。 現在、Figmaはコスト、生産性、実装の容易さ、コラボレーションと共有の容易さ、サポート、およびその他のパラメーターの点で勝っています。 しかし、これは制限ではありません。Figmaは2019年も開発を続けるからです。





はい。ただし、優れた製品を作成し、その使用に関する倫理原則を規定しない場合、私たちは自らの崩壊に貢献します。 その良い名前を復元することはできませんツイッターを見てください。 2018年は、法廷で証言したIT企業の多数の幹部によって一般的に記憶されていました 。 コミュニティツールを提供するだけでは不十分であることがわかりました。コミュニティツールの使用を監視する必要があります。 figmaは、UXの「暗いパターン」、デザインの悪さ、偽物からユーザーを保護できますか？

音声UI

壮観なデザインは、人目を引くものである必要はなく、目に見える必要さえありません。 試行錯誤を通じて、触覚以外の感覚を作成する場合、ツールは大きな役割を果たさないことがわかりました。 この設計のロジックは、人間の心理学と機械による自然な音声の認識に基づいています。

音声UIは官能的でエレガントです。

それは最高の状態でゼロUIの概念を実装します。 これは純粋に内部的なプロセスであり、実際に設計するよりも、書く、コンテキストを構築する、データを一般化するようなものです。 それでも、デザイナーは音声UIを表現する方法を見つけることに夢中です。 彼らは通常、 マイノリティレポート映画（ マイノリティレポート 、2002）のインターフェイスとアニメーションに触発されています。





Gleb Kuznetsovによる有機人工知能の設計



通常、このような未来的なUIは、音声インターフェイスの実際のデバイスを反映していません。 それらのタスクは、コントロールがないことをユーザーに警告し、完全に冗長なテクノロジーを使用するようユーザーに教えることです。



2019年には、音声UIの開発と、デザインとのやり取りで本格的なエクスペリエンスを作成することを支持する単純な視覚的美観の拒否を期待しています。





はい。ただし、音声UIで最も難しいことは、人とマシンの間のやり取りでさえなく、人間と人間のコミュニケーションです。 世界社会は異常に不均衡です。 技術を含む膨大な数の問題について相互理解することは困難です。 音声制御の電話、車、および家は、ギャップを広げるのに役立ちます。



デザイナーとして、私たちは常に人間の幸福を第一に考えなければなりません。 テクノロジーがどれほどエレガントであっても、他の人を犠牲にして誰かにサービスを提供する場合、あなたはそれを戦う必要があります。

UXのコピーライティングと編集

昨年、デザイナーはフォントに囲まれている言葉の意味を真剣に考えました。 サイエンスフィクションライター、テクニカルライター、ジャーナリスト、アマチュアだけが、才能を伸ばすための新しいスペースを手に入れました。 次のように、デザインにおける執筆の役割を定式化することができました。

あなたのビジネスが顧客とどのように相互作用するかを制御する必要があります。

以前は、マーケティングは見栄えの良い技術用語の自動キューのように見えました。 同社の活動は、消費者にとってのメリットとして誤って測定されていました。 成功している企業でさえ、聴衆とコミュニケーションをとるためのシンプルで明確で説得力のある言語の欠如に苦しんでいます。



UXコピーライティングは、ユーザーに敬意を払い、有益であるという2つの単純な原則に基づいています。 他のすべてはそれらに由来します。 したがって、簡潔にするということは、人々を尊重し、自分の時間よりも自分の時間を大切にすることを意味します。 あなたのテキストに苦しむのはあなたではなく、あなたです。 率直であることは、偽善を避け、不快な経験からユーザーを保護することを意味します-したがって、有用であること。 明確であることは、正直であることと、欠陥を隠さないことを意味します。 雄弁さを自慢するのではなく、常にユーザーを支援することに集中し、マーケティングの決まり文句を使用しないでください。 すべてが節度に優れています。

UXコピーライティングは簡単です。 礼儀正しく、ユーザーに役立つよう努めてください。

誰もあなたが自慢して自慢するのを見たくありません。 あなたが彼らを助けることができるかどうかを知ることは重要です。 あなたのサービスがそれ自体を語らせます







2018年には、大企業のレトリックに大きな進歩が見られました。 彼らは製品の複雑さを追いかけるのをやめ、消費者の価値に焦点を合わせました。 2019年にUX編集が進化し、設計の本格的な方向性になることが予想されます。



UXのコピーライティングと編集の違いは、作業量です。 コピーライターはユーザーに表示されるテキストを作成し、エディターはテキストを分析および変換して、人間が簡単に理解できるようにします。 UXの編集に関するエクスプレスコースは存在しません。 この技術を習得するには、経験、観察、そしてもちろん、人々への愛が必要です。

2019年には、すべての主要な再設計プロジェクトにUXエディターが必要になります。

はい、しかし、それぞれの新しいトレンドはいくつかの段階を経ます：不信、賞賛、忘却。 残念ながら、どんなアイデアでも、たとえ良いアイデアであっても、笑いの種になり失敗する可能性があります。 UXコピーライティングも例外ではありません。 だから、言葉遣いの単純さは誰かにとって原始的であるように見えるかもしれず、誠実さは謙虚であると解釈できる。



それにもかかわらず、製品やサービスの開発には、リンク先ページの外であっても、文学的な創造性の場所があります。 たとえば、ナイキとボーイングは将来を予測するためにSF作家に最大限のお金を払っています。

職業としてのデザイン

UXデザインには多くのことが含まれます。 サービス設計の分野に属し、さまざまな業界で使用されています。 その結果、デザイナーとデザイン会社は、非常にシンプルなアプリケーションと複雑な金融プラットフォームの両方の場所がある巨大なポートフォリオを収集します。

サービスデザイン業界はすべての業界を網羅し、ワンストップソリューションを提供しています。

サービスデザイナーは、新しい製品にもたらす独自のスタイルを持っている場合があります。 それが彼らを有名にした理由であり、企業は喜んで彼らに支払いをします。 これは、信頼できるサプライヤーから部品を購入するのと同じです。



ただし、製造会社は、より深いレベルのデザイナーの関与を必要とする場合があります。 そのような企業には、チームに完全に統合され、生産システム全体に影響を与えるデータとツールを備えたデザイナーが必要です。

製品開発には、サービス開発に比べて大きな利点があります-分析へのアクセスと設計決定をリアルタイムでテストする機能。

そのようなプロジェクトの設計者は、他のことに気を取られることなく特定の製品に集中できます。 彼らは、製品の対象読者に関する詳細な情報を保有しており、想定に基づいた作業を行うサービスデザイナーとは異なり、実際のデータから取得します。





Sasha Turischevの革新的なアイパッチランディングページ





はい。ただし、製品設計への移行には多大な労力が必要です。 特定のニッチに専念するリスクがあるため、私たちはしばしば運命的な選択をします。 したがって、この分野の実行可能性と、その分野における専門能力開発の見通しの両方を考慮して、決定のバランスを取る必要があります。



幸運は勇敢な人に付随し、2019年には、ニッチスペシャリストのキャリアのためにすべてを犠牲にする才能のあるデザイナーが登場します。 時間はわかります。



最後に、最も重要な新たな傾向は、 誠実さへの要求です 。 ユーザーはだまされたと感じることを好みません。 人生のように、善意に勝るものはありません。そして、それは彼らが良いデザインの起源にあるのです。