Microsoft Fluent Design for Web (CSS framework) [closed]

狂风中的少年 提交于 2019-11-29 00:40:58

问题


As Microsoft recently released a design system called "Fluent Design", is it appropriate to apply it on web design?

Most of my searching has been for all Microsoft platforms, C# app, F# etc.. I have never seen anything regarding in web design.


回答1:


Take a look at Microsoft Web Framework for details on the components, HTML structure and CSS that you would use to meet Microsoft's web design principles.




回答2:


July 2019 Update: Microsoft published Fluent framework under Fabric UI name which includes Web part here

Short answer, yes Fluent design is appropriate for web, but there's still no publicly available library of components.

Above mentioned getmwf.com (get Microsoft Web Framework) is deprecated. Newer microsoft.com/mwf is for internal use.

The very new fluentweb.com is also marked with restricted to use by Microsoft employees and authorized vendors but open-sourced tutorial for fluent web states the following:

[..] how to import Fluent for Web components and styles (packages are private for Microsoft employees only, though becoming open source soon).

Maybe one day. In the meantime check out Office Fabric




回答3:


just copy-paste from the bottom of the MWF homepage.

This site is restricted to use by Microsoft employees and authorized vendors. No materials or code from this site may be used on non-Microsoft websites. By entering this site, you confirm that you are a Microsoft employee or an authorized vendor working on behalf of Microsoft. You further agree that the materials and code constitute Microsoft’s intellectual property, are limited for use on Microsoft-operated websites, and are subject to the applicable agreements governing your employment or vendor relationship with Microsoft.




回答4:


You can use this library for Reveal Effect in Fluent Design System. And you need to wait for the backdrop-filter CSS supported for background blur effect.

https://github.com/d2phap/fluent-reveal-effect




回答5:


I'm just quoting Microsoft here.

It is perfectly relevant to the web design. Since these are just principles and not specific to any platform. So if you are a web developer and like the Microsoft way of thinking. it is perfectly fine to build a Web UI framework around these principles.

Please check out this video in which your question has been discussed in the Q&A session (22:00).




回答6:


Check out the Fluent Kit framework.

It is a Fluent Design extension to the current Bootstrap version, using jQuery, so should be an easy starting point for anybody, really. Also, it is very well documented and the "work in progress", so you can expect further functionalities as the design itself develops.


Important update: Fluent Kit, as well as the whole Nespero project is closed.




回答7:


Update: Fluent design now supports web, Android and IOS. https://www.microsoft.com/design/fluent/#/

Update: a high quality 3rd party react component framework called react-uwp can be found here

Update: new website is at https://fluentweb.com/

Update: link is now dead, and https://getmwf.com doesn't mention fluent design anymore.

Microsoft has a web framework for its own employees and vendors.

Looks like they are introducing fluent design components to this framework.

https://fluent.getmwf.com/



来源:https://stackoverflow.com/questions/44171246/microsoft-fluent-design-for-web-css-framework

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!