链接

云计算的全面爆发浪潮下,云平台已经不是简单的单个业务场景,而是由多种业务,多种云产品,多种云平台的组合与链接。“混合云”概念应运而生。而作为非技术出身的设计师,似乎很难与此类平台中的技术型用户建立同理心。

在实际混合云的业务场景探索过程中,我们发现了可以通过“监、管、控”三种典型的用户视角切入,通过总结设计场景化的设计模型,来保证混合云平台的用户体验一致性与规范性。

本期,我们重点分享“监”的视角:

混合云场景下“监”的设计模型及规则(上) - 图1

混合云场景下“监”的设计模型及规则(上) - 图2

什么是“监”

监(monitor)表示用户通过观察数字信息 ,数据图表 , 对应关系等方式获取数据 ;从广义来讲,数据是反映产品和用户状态最真实的一种方式,通过数据指导运营决策、驱动业务增长。

混合云场景下“监”的设计模型及规则(上) - 图3

为什么需要“监”

任何云产品的使用 , 都依赖数据 ,这些数据可能是与业务目标直接相关的核心指标。数据监控是及时、有效的反馈出数据异常的一种手段,通过对数据的监视去观察是否异常,进而分析数据。在业务运行过程中,“监”不像其他产品,是业务的参与者,监控是一个旁观者,看着业务正常、高效运行;在发生异常时,监控像个侦探,发掘问题的源头;在灾难发生时,监控是兜底人,帮助业务系统发掘根本问题,第一时间恢复运行。对于一些隐藏较深的间接数据,是从侧面影响核心数据的,这个影响可能具有滞后性。如果能在其影响核心数据前,监控间接数据,并及时采取控制措施,那么可以将业务损失降至最低,影响范围降至最小。混合云作为云产品的一种,监控产品也构成“数据—人—行为”的闭环,设计此类产品需要满足用户两层需求:1. 提供准确实时的产品数据 ; 2. 产品数据引导正确的用户行为。

混合云场景下“监”的设计模型及规则(上) - 图4

混合云场景下“监”的设计模型及规则(上) - 图5

“监”场景下的用户分析及设计策略模型

只有清楚了解了用户,才能回归用户视角去思考问题,去基于他的体验痛点,给出 设计主张。进而我们从“监”产品的用户角度出发 , 来进行一系列的设计演变. 首先我们把企业中使用云的用户分为四类:决策者、运营管理人员、云用户、运维人员 , 通过分析各类用户人群功能及场景 ,进行具体的页面形态设计 。

混合云场景下“监”的设计模型及规则(上) - 图6

主要人群核心诉求及数据场景分析

对于混合云产品用户 , 始终遵循兼容 , 准确 , 高效的设计准则进行全局设计 , 设计的核心点在于对数据进行处理及分析 , 按照设计模型 , 通过确定主次关系 , 层级关系 , 关联依赖 ,不同维度及对比分析 , 确定数据表达类型 , 在确定类型的基础上 , 进一步按照元素 , 结构 , 布局的设计形态进行深入化设计 。

混合云场景下“监”的设计模型及规则(上) - 图7

结合混合云多种业务场景 ,总结概括不同图表类型 ,在结构上辅助设计图表选择

混合云场景下“监”的设计模型及规则(上) - 图8

图表样式选择

混合云场景下“监”的设计模型及规则(上) - 图9

提炼设计规范 ,统一设计元素

认知标准统一

在自然界中,原子是最小存在的单元,原子结合在一起形成分子,这些分子可以进一步结合形成相对复杂的有机物。而在产品的视觉体系里最小颗粒度的原子,我们理解是圆角、颜色、文字、栅格尺寸等这些最基础的视觉的组成要素;利用这些基础要素,我们形成以组件为单位的设计内容,如标题、按钮等控件。原子单位(基础设计要素)、组件、模块、模板、页面组成一个设计稿。在既定的设计语言和风格的指引下,归纳统一 ,实现设计语言的规范化、产品化和工具化。在基础模型的基础上 ,保证视觉展现相对统一 ,规范原子级组件样式 , 整理出数据卡片样式 ,图标使用规范 ,及大屏基础样式 ,规避相同数据多种相似样式情况。

01 数据卡片规范

混合云场景下“监”的设计模型及规则(上) - 图10

02 图标图形使用规则举例

在混合云跨业务跨平台场景中,设计师经常会遇到对相同概念的名词选择图标或图形化的场景。为了整体平台的统一性,设定图标使用规范 ,规范覆盖天基、混合云、应用运维业务场景。提炼核心名词,分别统一线性,面性,2.5D,3Dicon的使用场景及规范。

混合云场景下“监”的设计模型及规则(上) - 图11

混合云场景下“监”的设计模型及规则(上) - 图12

03 大屏使用规范

越来越多的大屏场景出现在混合云业务中 ,针对大屏类的界面设计 ,梳理出基础版规范原子级样式 ,规范后续大屏界面。( 由于数据安全要求,数据部分已做模糊处理)

混合云场景下“监”的设计模型及规则(上) - 图13

混合云场景下“监”的设计模型及规则(上) - 图14

案例分析

对于决策者而言主要是通过数据助力决策 , 关注核心数据 , 注重全局信息 , 风险类信息及告警信息 . 使用场景通常为数据大屏 , 全局决策页面等 。

以混合云多Region大屏为例 , 首先对已有数据进行初步分析 ,确定大屏场景及各region之间的关系 ,从而进行初步框架设计 ,确定整体布局。

根据数据属性 ,选择合适的图表类型 ,多region大屏主题内容需突出专有云与公共云region使用分布情况 , 可以根据模型选择面积地图作为基础图形 ,进行视觉风格延展 ,增加较强的视觉处理形式 , 突出中心区域精细程度 。

基于数据变量的cpu使用率 ,slb负载均衡等使用条形图表示.

在大屏设计场景中,除了梳理业务、选择展现方式以外,也需要思考每个空间对观者的重要性;不浪费页面的每一寸“土地”,并且让“土地”的设计令用户感到愉悦、一目了然,还能快速获取到想要的信息。

混合云场景下“监”的设计模型及规则(上) - 图15

对于运维人员主要是通过资源监控 , 发现告警 ,进行资源运维 ,在混合云运维平台产品维度监控案例里 , 设计需要反应多层级架构的产品分布

正常/异常状态,监控状态:到达终态、未到达终态。

我们首先确定数据之间的关系 , 区分出核心产品架构区 。

1.产品数量 , 集群总数等突出数值信息模块 ,选用小卡片结构将每部分信息进行聚合 ,

2.产品架构部分确定多层级架构形式 , 选择横向分布图 , 统一使用圆形基座 ,增加层级元素

混合云场景下“监”的设计模型及规则(上) - 图16

以上是对混合云“监”相关业务场景做了简单模型梳理及规范介绍 ,面对复杂多样的云场景 , 需要我们持续优化模型形态及规范 ,满足准确 ,高转换 ,千人千面业务数据设计的同时, 保证全局的规范适用性 ,及视觉效果一致性。

混合云场景下“监”的设计模型及规则(上) - 图17