{"id":4233,"date":"2020-03-12T08:32:09","date_gmt":"2020-03-12T16:32:09","guid":{"rendered":"https:\/\/officedevblogs.wpengine.com\/?p=4233"},"modified":"2020-03-12T08:32:09","modified_gmt":"2020-03-12T16:32:09","slug":"ui-fabric-is-evolving-into-fluent-ui","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/microsoft365dev\/ui-fabric-is-evolving-into-fluent-ui\/","title":{"rendered":"UI Fabric is evolving into Fluent UI"},"content":{"rendered":"

March 20<\/em>, 2020<\/em><\/p>\n

We\u2019ve updated the blog post to reflect that the GitHub repo rename is now complete.<\/em><\/p>\n

What\u2019s in a name? A lot it turns out. And we have a lot of them. Too many? We hear you and agree. That\u2019s one of the key reasons we\u2019re simplifying our story. To collectively rally around a single UI library for <\/span>our web\u00a0<\/span>compo<\/span>nents\u2014Fluent UI.<\/span><\/p>\n

\"Fluent<\/p>\n

 <\/p>\n

We\u2019re starting with Fluent, our cross-platform design system. Fluent is the way Microsoft designs and builds digital product experiences, both internally and with our customers and community.<\/span>\u00a0<\/span><\/p>\n

We\u2019ve evolved Microsoft to speak a common language through a shared design system. Fluent UI will directly connect that effort to a broad set of products, through code, specifically the convergence of our most used\u00a0<\/span>web\u00a0<\/span>engineering frameworks – Fabric and Stardust.<\/span>\u00a0<\/span><\/p>\n

On March 20, \u00a0we renamed our UI Fabric GitHub repo to reflect our Fluent UI vision.\u00a0This is step one toward our vision for a more\u00a0simplified\u00a0developer ecosystem.<\/p>\n

This is step one toward our vision for a more simplified developer\u00a0<\/span><\/i>ecosystem<\/span><\/i>.<\/span><\/i>\u00a0<\/span><\/p><\/blockquote>\n

This is what we mean when we say Fluent is Microsoft\u2019s design-to-code system. We\u2019re bringing design and engineering together more than ever, to contribute to and leverage a shared foundation, and reach our shared goals. We\u2019re not suggesting that one size fits all, and we got here honestly, so we must evolve collectively.<\/span>\u00a0<\/span><\/p>\n

Our goal is simple\u2014a shared foundation with open source\u00a0<\/span>engineering pr<\/span>ocesses to create experience coherence, efficiency, and effectiveness. It enables us to do more with less.\u00a0<\/span>\u00a0<\/span><\/p>\n

What<\/span>\u2019s changing<\/span>\u00a0<\/span>\u00a0<\/span><\/h3>\n

Simply put, we merged\u00a0two Microsoft\u00a0repositories.\u00a0UI Fabric\u00a0and Stardust GitHub repos\u00a0now live\u00a0under the\u00a0Microsoft GitHub organization<\/a>\u00a0as\u00a0Fluent UI.<\/p>\n

This allows our\u00a0<\/span>teams to collectively work together\u00a0<\/span>on a shared code base\u00a0<\/span>with a shared set of build and development tools<\/span>\u00a0<\/span>to support<\/span>\u00a0our products and community more efficiently.<\/span>\u00a0<\/span>It also allows us to\u00a0<\/span>get to<\/span>\u00a0<\/span>a single UI library\u00a0<\/span>for M<\/span>icrosoft\u00a0<\/span>365<\/span>.<\/span>\u00a0<\/span>\u00a0<\/span><\/p>\n

What this mean<\/span>s<\/span>\u00a0for developers<\/span>\u00a0<\/span><\/h3>\n

Today?\u00a0<\/span>We\u2019re working with a goal of avoiding disruption or breaks in the UI Fabric developer experience.\u00a0You will continue getting a stream of patches and minor releases as we iterate the current major release (version 7).<\/span>\u00a0<\/span><\/p>\n

Moving forward, we expect to offer regular updates and communication around our major releases. Our next major release will be the first batch of changes in uniting our collective efforts, tentatively targeting summer 2020.<\/p>\n

Our intent is to minimize the\u00a0amount of interruptions to in flight developer workflows. Also<\/span>,<\/span>\u00a0we want to be mindful and incremental in our approach<\/span>\u00a0<\/span>and we\u2019re using this opportunity to\u00a0<\/span>signal to the community our incoming changes.<\/span>\u00a0<\/span><\/p>\n

We\u2019re working with a goal of avoiding disruption or breaks in the UI Fabric developer experience. You will continue getting a stream of patches and minor releases as we iterate the <\/span><\/i>current major release (version 7).<\/em>\u00a0<\/em><\/p><\/blockquote>\n

The following is\u00a0<\/span>a\u00a0<\/span>short\u00a0<\/span>FAQ<\/span>\u00a0on\u00a0<\/span>the potential impact\u00a0<\/span>of\u00a0<\/span>the<\/span>\u00a0<\/span>repo merge and rename e<\/span>ffort:<\/span>\u00a0<\/span><\/p>\n

Do I need to\u00a0<\/span><\/b>rename all my package imports to something new?<\/span><\/b>\u00a0<\/span><\/p>\n

No<\/span>.\u00a0<\/span>Package names will stay the same\u00a0<\/span>as a result of the merge<\/span>\u00a0and rename effort. We<\/span>\u2019<\/span>ll\u00a0<\/span>continue <\/span>releasing all UI Fabric packages as we do today.<\/span>\u00a0We<\/span>\u2019<\/span>ll also\u00a0<\/span>alias\u00a0<\/span>publish the same package<\/span>s<\/span>\u00a0under a new name, so that at any time you\u00a0<\/span>can use the new @<\/span>fluentui<\/span>\/react package<\/span>\u00a0with no breaking changes.<\/span>\u00a0<\/span><\/p>\n

Do I need to re-clone the repo?<\/span><\/b>\u00a0<\/span><\/p>\n

No. You\u00a0<\/span>should<\/span>n\u2019t<\/span>\u00a0n<\/span>eed to re-clone the\u00a0<\/span>repo. Your clones should be redirected correctly.<\/span>\u00a0<\/span><\/p>\n

Where do I file\u00a0<\/span><\/b>GitHub\u00a0<\/span><\/b>i<\/span><\/b>ssues and\u00a0<\/span><\/b>p<\/span><\/b>ull\u00a0<\/span><\/b>r<\/span><\/b>equests<\/span><\/b>\u00a0now?<\/span><\/b>\u00a0<\/span><\/p>\n

You can file\u00a0issues and\u00a0pull\u00a0requests\u00a0in the\u00a0new\u00a0microsoft\/fluentui\u00a0repository.\u00a0Our teams will collectively support them\u00a0there.<\/p>\n

What about\u00a0<\/span><\/b>the\u00a0<\/span><\/b>i<\/span><\/b>ssues and\u00a0<\/span><\/b>p<\/span><\/b>ull\u00a0<\/span><\/b>r<\/span><\/b>equest<\/span><\/b>s that were open<\/span><\/b>ed<\/span><\/b>\u00a0before the merge?<\/span><\/b>\u00a0<\/span><\/p>\n

Previous\u00a0<\/span>i<\/span>ssues and\u00a0<\/span>p<\/span>ull\u00a0<\/span>r<\/span>equests\u00a0<\/span>will be captured in\u00a0<\/span>a\u00a0<\/span>microsoft<\/span>\/<\/span>fluentu<\/span>i<\/span>\u00a0repository.\u00a0<\/span>For UI Fabric<\/span>,<\/span>\u00a0contribution history<\/span>\u00a0and<\/span>\u00a0active pull requests will stay intact.<\/span>\u00a0<\/span><\/p>\n

Is the current version of UI Fabric still supported?<\/span><\/b>\u00a0<\/span><\/p>\n

Yes.\u00a0<\/span>Nothing is changing in our level of support to the community for the library.\u00a0<\/span>\u00a0<\/span><\/p>\n

What if I have more questions about the repo merge and rename?<\/span><\/b>\u00a0<\/span><\/p>\n

Reach out to our team on\u00a0the\u00a0Fluent UI GitHub repo<\/a>\u00a0\u00a0File an issue and\u00a0we’ll\u00a0be happy to follow up with you.<\/p>\n

What does this mean for WinUI and the Fluent Design System within Windows? <\/strong>The Fluent Design System lies at the core of our recommendations for how to build engaging user experiences on Windows and across platforms now, too.\u00a0 WinUI continues to embody the Fluent Design System as the native user experience platform of Windows.\u00a0 With the addition of the Javascript-based Fluent UI libraries, you\u2019ll also be able to build more coherent experiences across other platforms and the web, too, and the Fluent Design System will continue to expand.<\/p>\n

N<\/span>ew updates\u00a0<\/span>planned for<\/span>\u00a0Fluent UI<\/span>\u00a0<\/span><\/h3>\n

Our next major releases will focus on performance and theming:<\/p>\n

Improve runtime performance through styling optimizations.<\/span><\/b>\u202fWe\u2019re evaluating how we can reduce\u00a0<\/span>css<\/span>-in-<\/span>js<\/span>\u00a0style calculation overhead to improve rendering performance.<\/span>\u00a0<\/span><\/p>\n

Improve flexibility and composition of components.<\/span><\/b>\u00a0Leverage React hooks and function components,\u00a0<\/span>along side<\/span>\u00a0API surface improvements, to give developers more composition options.<\/span>\u00a0<\/span><\/p>\n

Provide a more flexible, powerful theming system.<\/span><\/b>\u00a0Extend our list of design tokens and improve our theming tooling to apply your design.<\/span>\u00a0<\/span><\/p>\n

Eliminate deprecated React API usage.\u202f<\/span><\/b>This enables partners to test React concurrent mode rendering, which allows rendering to be interruptible reducing how much the UI thread is blocked during large updates.<\/span>\u00a0<\/span><\/p>\n

\"3<\/p>\n

Still<\/span>\u00a0have questions<\/span>?<\/span>\u00a0<\/span><\/h3>\n

\u00a0<\/span><\/p>\n

Feel free to reach out to our team with any questions you may have\u00a0regarding our new collective effort around Fluent UI\u00a0by filing an issue on\u00a0the\u00a0Fluent UI GitHub repository.<\/a><\/p>\n