Microsoft の Fluent Design System が Windows 10 を美しく進化させる

読書時間アイコン 5分。 読んだ


読者は MSpoweruser のサポートを支援します。私たちのリンクを通じて購入すると、手数料が発生する場合があります。 ツールチップアイコン

MSPoweruser の編集チームの維持にどのように貢献できるかについては、開示ページをお読みください。 続きを読む

木曜日に、マイクロソフトは自社製品にまったく新しいデザイン言語を導入しました。 レドモンドは それを新しいフルーエントデザインシステムと呼んでいます、そしてそれは多くのマイクロソフト製品に実装されます— Windows 10から始まり、Xbox、HoloLens、PC、電話を含むオペレーティングシステムを実行するすべてのハードウェア。 フルーエントデザインシステムは、光、奥行き、動き、素材、スケールの5つの基本要素に基づいて構築されています。

Windows 10 では、これらすべての要素が連携して直感的なユーザー エクスペリエンスを提供します。 Microsoft は、Windows 10 の Fluent Design System のいくつかのコンセプトを披露しましたが、それらは非常に素晴らしいものです。もちろん、コンセプトと実際の取引は常に大きく異なります。しかし、Microsoft はすでに Windows 10 の一部のファーストパーティ アプリに新しい Fluent Design System の要素を提供しており、これらのアプリは現在非常に優れています。 Windows Insider であれば、今すぐ試してみることができます。 Redmond は、アクリル マテリアルや新しい Reveal エクスペリエンスなど、Fluent Design System の主要な部分のいくつかの API もリリースしました。 Windows 10 アプリ開発者はこれらの API を使用して、新しい Fluent Design System で既存のアプリの改良を開始でき、デザイナーは Fluent Design System アプリの設計を開始できます。 デザインキットを使用する。 これらの新しいAPIにより、開発者はWindows10のFluentDesignSystemを利用した美しいエクスペリエンスを構築できます。

[shunno-quote align=”right”] Fluent Design System の最初の波は、Windows Insider で既に利用可能です[/shunno-quote]

実際、MicrosoftのWindows 10アプリのほとんどは、Groove Music、Microsoft Photos、Paint 3D、View 3D、Voice Recorder、さらにはCalculatorアプリなど、Fluent DesignSystemの特定の部分をすでに利用しています。 これらのアプリは、アクリル素材、リビールハイライト、コネクテッドアニメーション、コンシャスコントロール、パースペクティブパララックスなど、フルーエントデザインシステムの最初の波のすべてのコンポーネントを使用しています。 マイクロソフトは、Build 2017のセッションで、フルーエントデザインシステムについて深く掘り下げました。そこでは、フルーエントデザインシステムで現在利用できるものと次の機能について詳しく説明しました。 同社のPaulGusmorinoとBojanaOstojicは、Outlook Mail&Calendarアプリ、Microsoft Edge、Xbox、OneNote、My Peopleエクスペリエンスなど、新しいFluent DesignSystemを間もなく入手するアプリのいくつかを披露しました。 同社は、Fluent DesignSystemのRevealエクスペリエンスをWindows10のスタートメニューにどのように実装するかを披露しました。これらの(ジャガイモ品質の)スクリーンショットの一部を以下に示します。

フルーエントデザインシステムの核となるのは、ルックアンドフィールだけではありません。 機能性はあらゆるデザイン言語の重要な部分であり、フルーエントデザインシステムはその構成要素でそれを釘付けにします。 しかし、私は新しいデザインシステムの非常に大きな部分である深さの要素に焦点を当てたいと思います。 PCの場合、深度効果は、上記のWindows Storeの概念で確認できる階層化されたユーザーインターフェイスを提供します。また、Fluent Design Systemは、すべてをまとめる視差効果も提供します。

[shunno-quote align=”left”]Windows Mixed Reality での 3D 深度効果の見栄えは素晴らしい[/shunno-quote]

そして、HoloLensのような最新のコンピューターに移行すると、奥行き効果が本当に輝いています。 Microsoftは現在、Windows Mixed Realityに没頭できる3D深度効果(z-depth-layering)を実験しています。 これが実際にWindows10にいつ出荷されるか、または出荷されるかどうかは明らかではありませんが、それでも素晴らしいように見えます。 これが効果的に意味するのは、フルーエントデザインシステムがキーボードとマウスのためだけに構築されているのではないということです。 Microsoftは、ペン、ジェスチャー、視線など、さまざまなWindows10デバイスと入力で機能するようにFluentDesignSystemを設計しています。

[shunno-quote align=”right”]Fluent Design System の鍵となる一貫性[/shunno-quote]

フルーエントデザインは、MicrosoftとWindows 10の旅です。Windows10のデザインが、単一のOSアップデートで根本的に変わることを期待しないでください。オペレーティングシステム全体に表示されるまでには時間がかかりますが、それは問題ありません。 しかし、Fluent Design Systemは、MicrosoftがWindows 10のすべてのアプリで設計原則の一貫性を維持できる場合にのみ成功します。現在のWindows10設計の最大の問題の3つは、一貫性がまったくないという事実です。コンテキストメニューの4〜XNUMX種類のデザイン、ファーストパーティアプリはさまざまな色合いの背景色を使用し、アプリ内の要素の配置はいたるところにあります。 マイクロソフトは、設計者がすべてのファーストパーティアプリにフルーエントデザインシステムを正しく実装していることを確認するためにかなりの作業を行う必要がありますが、レドモンドはサードパーティの開発者を同じものにする方法を見つける必要があります。

私がこれまでに見たフルーエント・デザインのコンセプトはすべて、感染力のある美しさに見えます。 Windows Storeのコンセプトから新しいXboxダッシュボードまで、FluentDesignのコンセプトはすべて本当にゴージャスです。 一部の機能要素も見た目も使い心地もとても良いです。 ただし、MicrosoftがWindows10でのFluentDesign Systemの実装を進めるにつれ、実行が完全であることを確認する必要があります。 同社は、Windows 10のアプリに新しいフルーエントデザインシステムを少し追加しただけですが、まだ長い道のりがあり、Windows 10のコア(別名シェル)に新しいデザインシステムを実装するには、まだ長い道のりが必要です。時間。 しかし、それはまったく問題ありません。実装がWindows 10のすべてのアプリとコンポーネントで一貫している限り、新しいFluent DesignSystemはWindows10の将来にとって非常に重要です。

Windows 10 Fall Creators Updateにより、MicrosoftはFluent DesignSystemの最初の波を出荷します。 同社は現在、第3波に同梱される要素を実験しています。これには、上のビデオで見た360D深度効果、XNUMXメディア再生、意識的なヘッダー、スピーチ、空間サウンドなどが含まれます。

トピックの詳細: 流Designなデザインシステム, マイクロソフトエッジ, Microsoft Fluent デザイン システム, 複合現実, プロジェクトNEON, 10窓, Windowsの混在した現実, ウィンドウズストア