云端数据管理平台

产品简介

刷新云端数据管理系统是基于物联网、大数据分析、智能硬件研发的一套管理平台，为企业提供数据可视化、监控分析的信息处理。

设计思路

用户分析

企业员工是使用B端产品最多的人，他们只会在“工作”的场景下使用它，有些还是强制使用，个人没有选择余地，因为付费者是企业领导，而不是基层员工，而使用最多的反而是基层员工，领导层则使用较少，因而专家型用户偏多，他们也更加追求产品的效率。

设计目标

B端产品的实用性大于美观性，能解决问题、配置资源的B端产品才是一个好的B端产品。

高效

业务流程简单易用，减少不必要的操作，操作过程中少跳转少弹窗。

统一

统一界面所有视觉语言，保持交互的统一性，建立设计规范与组件库，便于后期开发复用。

清晰

专注功能，减少“多余”的设计，优化视觉层级，更加方便用户快速找到相应的功能区域。

硬件

现在PC主流的分辨率占比排名前三的是1920 * 1080、1366 * 768、1440 * 900，以1440来设计的话，向上适配或者向下适配误差会比较小。

布局

常见的布局可以分为三种：

1. 水平导航布局
2. 垂直导航布局
3. 混合导航布局

考虑到功能模块较多、较复杂，这里采用混合导航布局。左侧为菜单栏，管理功能入口，右侧是内容展示区，提供数据信息及工作管理。

关于栅格

12栅格适用于业务信息分组较少，单个盒子信息体积较大的中后台页面设计。

24栅格适用于业务信息量大、信息分组较多、单个盒子内信息体积较小的中后台页面设计。

24栅格与12栅格对比，24栅格更加灵活，更适合内容比较多样复杂的场景。这里根据业务情况选择24栅格体系。

颜色

品牌色、功能色、中性色三部分色彩，以及衍生出的相关色板，可基本满足目前后台所需的颜色系统。

主色

以蓝色为品牌色，用于主要的场景

辅助色

用于主色以外的场景使用，如成功、出错、失败、提醒等，专色专用

中性色

用于标题，正文，辅助文字等

字体

在B端系统中优先使用系统默认的界面字体，同时定义文字的行高，如：字号(font-size)12px，行高(line-height)为22px.

字体行高，参考蚂蚁金服设计

组件

分析总结页面中的共性，与开发共同完成产品的组件库

按钮

常用的操作按钮

基础按钮

禁用状态

输入框

基础的表单组件

导航菜单

顶部导航和左侧导航

界面展示