MUI 是一个庞大的 UI 组件库，设计人员和开发人员可以使用 MUI 来构建 React 应用程序。该开源项目遵循 Google 的组件创建指南，可以为团队提供可定制的基础和高级 UI 元素库。设计师经常使用UI组件库来构建新产品或为现有项目添加功能。本篇文章Pixso设计师将与你一起探讨如何免费使用MUI组件库，以及使用MUI组件库的 7 个原因，一起来看看吧。
如何免费下载MUI组件库？
第一步：打开 Pixso 官网，进入Pixso工作台。（没有注册Pixso账号的小伙伴，可以点击注册）
第二步：点击菜单栏的「资源社区-设计资源」，搜索栏中输入「MUI」关键词，打开详情页，点击「复制」 。
第三步：回到 Pixso 工作台，在「我的草稿中」即可看到刚刚复制的MUI组件库，点开可进行组件复用和二次设计。
1. 更快的上线时间
在当今竞争激烈的技术环境中，上线时间是团队一直寻求优化的指标。MUI组件库为设计人员和开发人员提供了一个巨大的先机，可以使用经过全面测试的 UI 元素。设计团队可以花更多的时间来设计出色的用户体验，而不是陷入从头开始构建和测试MUI组件库的困境，这一过程会显著缩短产品上线的时间！
MUI组件库 - 图标
2. 单一组件来源
产品团队、UX 设计师和开发人员拥有不同步的设计系统并不少见，而这往往会导致错误、返工以及重新开发的困难和挑战。使用MUI组件库可以大大减少这些困难，同时在设计和开发之间创建单一的组件来源，因为MUI为他们提供了相同的起点。
MUI组件库 - 导航
3. 设计一致性
一致性对于用户体验、建立信任和品牌忠诚度至关重要。使用相同的MUI 组件库可以提高设计人员设计内容的一致性，同时最大限度地减少错误和返工。
如下图的MUI按钮组件所示，每个按钮都有大中小三个尺寸和不同的颜色系列，在按钮状态上，有常态、悬浮、按下三种。前端开发人员使用MUI组件库及查看按钮的代码标注可以保持设计的一致性。
4. 可扩展性
可扩展性是产品设计的另一个重要因素。如果要从头开始构建设计系统，设计人员必须在扩展产品之前设计、制作原型和测试新组件。借助MUI组件库，设计人员可以立即搜索他们需要的原型和组件。开发工程师可以从 MUI 中复制或粘贴相同的React组件，并根据设计师的规范对其进行自定义修改。如下图所示，切换到「组件」面板，可以输入关键词进行组件搜索。
UI组件库最大的价值在于提升整个团队的产研效率，使设计质量得以保障的同时，提升产品整体的用户体验。在Pixso中，UI组件库的使用方法也非常简单：设计师可以将自己经常使用的样式创建为组件外，将组件上传至团队资源库与其他成员共享使用，当主组件修改，其他实例组件均可以选择同步更新，无需手动，这既提高了设计效率，也防止在手动修改过程中出现遗漏，具体创建教程可点击参考《Pixso超详细创建组件和样式指南》。
5. 维护方便
像 MUI 这样的组件库带有安装、使用、更新和自定义组件的详细文档。设计师和工程师可以使用这个框架来维护团队的设计系统，从而更容易建立管理体系。
MUI组件库 - 字体
6. 无障碍
有建立设计系统经验的人都清楚确保每个组件能通过可访问性标准所需要的时间和金钱。MUI组件库的设计人员在设计组件时非常谨慎，以满足WCAD 2.0 可访问性指南，这也大大减少了研究人员和设计人员的工作。
如下图所示，MUI组件库有浅色模式和深色模式两种，字体的阅读遵循了WCAD 2.0的可访问性指南，阅读起来无障碍。
MUI组件库 - 滑块
7. 技能赋能
MUI 的开源组件 UI 库使初创公司能够构建新产品。任何人都可以利用MUI组件库提高设计师和开发人员的技能，使用UI组件库来开发复杂的数字产品并在全球市场中竞争。
推荐使用专业的APP设计工具Pixso
对于企业和设计团队来说，好的技术与设计工具，能够帮助其突破组织与制度的局限性。在线协同APP设计工具Pixso是一款功能齐全+易于上手+团队功能强大的设计工具，不论是个人设计还是团队设计都非常合适。从一经推出到现在，短短的时间内，Pixso就凭借满满的诚意和不容置疑的实力，成为了国内最具发展潜力的在免费在线设计工具，我们有理由相信Pixso未来可期，现在马上试试。
