排名前 7 位的 Material Design 仪表盘

和往常一样，我们的介绍不会太长。我会简单介绍一下 Material Framework，并提一下我们评估仪表盘/管理模板的传统标准。

那么，什么是 Material Design？Material Design（代号 Quantum Paper）是 Google 于 2014 年开发的一种设计语言。Material Design 的核心是光照和阴影。

根据我们构建仪表板/管理模板的经验，我们在评估中使用以下标准：

• 设计质量
• 代码质量
• 易于安装
• 文档质量
• 唯一页面数量
• 项目更新频率
• 支持质量
• 价格
• 公司和团队经验
• 客户

Flatlogic 的 React Material Admin

React Material Admin 是一个基于 Material-UI 框架构建的 React 仪表板模板。它无需 jQuery 和 Bootstrap。这款 React 模板非常适合构建 SAAS、电商、物联网仪表板或任何你喜欢的 Web 应用的前端。

我不会深入探讨其设计细节，只是提到模板遵循所有准则并且一切都做得正确。

该代码具有最少的额外依赖项，并且易于维护。它经过了充分的测试和文档。您可以通过包管理器安装仪表板。

该模板总体来说文档齐全。它提供了快速入门指南，详细解释了如何设置仪表板。此外，所有结构和组件都进行了讲解和描述。

Angular Material 仪表板包含 10 多个组件。仪表板提供分析图表、电子邮件和聊天组件。

该公司已从事模板开发和销售五年。除了模板开发外，Flatlogic 还在开发定制商业应用程序方面拥有丰富的经验，涵盖电商网站和预约管理系统。Flatlogic 已向三星、思科、Doculife、沃尔玛等公司销售管理模板。

该仪表板完全免费且开源。

同时，目前正在开发具有 40 多个页面和 100 多个组件的 React Material Admin 高级版本！

总而言之，这个模板对于你启动一个业余项目或了解 Material Design 来说是一个不错的选择。丰富的内置组件将简化从头开始构建应用程序的任务。

更多信息
现场演示

材料设计模板

Material Admin 是一个免费的管理模板，完全使用 Google 的 Material Design for the Web 框架构建，符合 Material Design 指南。它包含所有应用程序所需的基本组件和一组预建页面。

模板设计简洁，细节不多。适合商业应用。提供 RTL 版本，您可以选择深色或浅色侧边栏，以及六种配色方案。

该模板基于 Angular、Bootstrap 和 SaSS。它支持所有现代浏览器，包括 IE10 及以上版本。您需要使用 Gulp 命令来设置模板，但您也可以使用已构建的版本。

管理仪表板包含基本文档。它可以帮助安装仪表板并描述模板的结构。

该产品拥有超过 20 个独特的组件，包括数据表、地图、日历、面包屑等。

我们没有找到任何关于其更新频率和支持质量的信息。

价格从单个站点的 25 美元到扩展许可证的 249 美元不等。它包含 1 年的支持和免费更新。

更多信息
现场演示

Material Pro

Material Pro 是一款高品质扁平化设计的管理仪表盘模板。它是一个完全响应式的管理仪表盘模板，采用 Bootstrap 框架、HTML5 和 CSS3 以及 Media Query 构建。

设计符合Material Design的规范，但看起来有点业余。不太平衡。模板里有些图片不太合适。有些颜色不匹配。如果要我打分的话，我会给3分（满分5分）。在我看来，这就是这个模板的不足之处。

这是一个简单的静态 HTML 模板，因此安装起来非常方便。模板的文档非常完善。安装过程描述详尽，结构和所有组件也一一描述。文档编写得非常出色，非常便捷且专业。

该管理模板包含 120 多个 UI 组件。虽然描述得相当丰富多彩，但我们不确定页面和组件的数量是否属实。

该产品拥有完善的支持服务。网站称其支持服务24小时开放。支持可通过网站、聊天或电子邮件提供。我们没有找到任何关于模板更新频率的信息。

价格范围从单次使用 29 美元到多次使用 69 美元，以及扩展许可 399 美元。此价格包含 1 年的免费支持和更新。

该公司上市已三年多。我们没有找到任何关于销售数量的公开信息，但该公司的客户包括《福布斯》、《赫芬顿邮报》等。

更多信息
现场演示

Creative Tim 的 Material Dashboard

Material Dashboard 是一款免费的 Material Bootstrap 4 管理界面，其设计灵感源自 Google 的 Material Design，风格清新时尚。Material Dashboard 基于热门的 Bootstrap 4 框架构建，并附带一些经过重新设计的第三方插件，以与其他元素完美契合。

Material Dashboard PRO 巧妙运用光线、表面和运动。整体布局如同纸张般，层层叠叠，层次分明，层次感和秩序感一目了然。

我们不确定代码质量。我们注意到 Creative Tim 的常规团队中没有开发人员，这意味着他们可能使用了外包服务。根据我们的经验，在其他公司的帮助下开发模板不会损害代码的高质量。

仪表板是通过 npm 安装的。只需在终端中输入 npm i material-dashboard 即可。

该产品拥有高质量的文档。一切都便捷、结构良好且易于阅读。每个组件都有详细的描述，可以轻松找到其编写方式、使用方法和修改方法。

Material 仪表板包含 60 个组件和 27 个示例页面。组件和页面包括以下通知元素、地图、表格图表等。

该产品的价格取决于许可证，从免费版到374美元的扩展许可证不等。如果您购买付费版，则可以享受半年的免费支持。您也可以单独付费将其延长至12个月。支持分为两种类型：社区支持和高级支持，两者的响应速度和响应质量有所不同。

Creative Tim 在模板市场深耕多年。该公司在该领域拥有深厚的专业知识和完善的支持体系。购买他们的产品，您无需担心无法获得更新。

更多信息
现场演示

Mdbootstrap

MDBootstrap 是一个管理仪表板模板，包含不同的样式、数据呈现和一系列组件。它基于最新的 Bootstrap 4、Angular CLI 和 Material Design 构建，并遵循 MIT 许可证，可免费用于个人和商业用途。

该模板完全响应式设计。其设计与谷歌的工具类似，让您可以清晰地查看数据。风格直观，信息丰富。每条信息都与相应的类别相关联。

代码简洁，结构设计良好。此版本完全没有使用 jQuery。所有 Bootstrap 脚本均使用纯 TypeScript 重写，并编译为纯 JavaScript。

您可以通过直接下载来下载模板，然后只需打开文件夹并使用该模板。

该项目有完整的文档，其中描述了每个组件。

该模板使用 MDBootstrap 构建，包含 400 多个材料 UI 元素、600 多个材料图标和 74 个 CSS 动画。

该项目每月更新1-2次。

该公司拥有一个知识库，用于解答用户支持问题。社区也为用户解答疑问。商业许可证也包含免费支持。

该产品商业用途的价格从 79 欧元到 149 欧元不等，个人使用则免费。

这个模板质量不错，背后有一支经验丰富的团队。客服支持质量也不错，社区里有很多问题解答。更新也相当频繁。但 Material Design 的设计风格并非人人都喜欢。此外，免费版价格相对较高，组件数量也较少，这让人望而却步。

更多信息
现场演示

Angular Material 管理员

如果您要构建类似 CMS、数据可视化应用或 SAAS 的 Web 应用，Angular Material Admin 可以帮助您顺利完成。此模板采用响应式布局，功能多样，适用于任何设备。Angular Material Admin 由 Flatlogic 团队使用 Angular 8、Material Design 和 Typescript 创建。

这款设计精美的模板定会让您爱不释手。它包含多个仪表板、四色主题、数百个页面和组件。左侧边栏不仅是静态的，还可以悬停，方便您使用。该模板有一个演示版本和一个已记录的代码库。

更多信息
现场演示

Vue 材料管理员

Vue Material Admin 模板基于 Vue.js 并使用 Vuetify.js 框架。它包含大量的布局组件、选择器、小部件和其他必要的部分。此 Material 模板足以构建复杂的仪表盘或应用程序：它具备配置复杂应用程序所需的所有功能。

该项目通过 Yarn 安装。它看起来相当业余，我们没有找到任何文档和支持。很可能所有支持都来自用户。社区更新的频率大约是每月一次。

该模板完全免费。您将在其中找到所有必要的组件：

社交媒体、网站流量、位置、销售、活动、项目和其他一些组件都放置在仪表盘中，以提升美观度。布局中还包含一些其他组件，需要一些时间来整理应用程序或仪表盘。这里还提供其他一些功能，例如超大屏幕、列表、菜单、选项卡、时间线和工具栏。

现在来看看任何类型的管理仪表盘中最重要的部分。它包含编辑器、选择器、步进器、文本字段、常规和选择控制选项。这些是从用户或成员获取数据所必需的。

更多信息
现场演示

回顾与结论

采用 Material Design 的仪表板市场不如其他模板那么成熟。解决方案不多，但既有成熟的产品可以用来开发成熟的项目，也有适合业余项目来熟悉 Material Design 框架。

关于 Flatlogic

在 Flatlogic，我们开发管理仪表板模板和React Native 模板。我们是白俄罗斯和立陶宛排名前 20 的 Web 开发公司之一。在过去的 6 年里，我们成功为小型初创公司和大型企业完成了 30 多个大型项目。作为一个团队，我们始终渴望为客户提供帮助。

最初发表于https://flatlogic.com/blog/top-material-design-dashboards/