Principle 设计原则

有效的设计，能让用户有效完成特定任务，正确完整的达成特定目标，缩短所需要的时间和精力，同时操作方便流畅，让用户对整个过程满意，产生好感，取得信任。
设计不是凭空猜测，设计领域有很多经过长时间验证的法则，被认作设计原则，指导设计并成为评估的依据。

一致性

良好的一致性，可以减少用户学习成本，更快培养用户习惯，体现产品设计的严谨、专业。通常需要注意一致性的地方包括：

视觉一致

所有同类界面在相同的使用环境下，界面外观在视觉上应保持一致。
如果强制的一致导致界面的复杂度增加，使用体验下降，需决定保持一致性还是采用个性化的设计。

交互一致

• 信息的组织层次一致
• 导航一致；
• 同类场景界面操作一致；
• 操作行为相同时，保持视觉一致;

文案语言一致

在描述同一个事物时，文案语言保持一致。

优先级

设计中对优先级的把握，就是要将真正重要的功能/内容/元素放到突出的位置，将次要的部分弱化或隐藏。

内容优先

将内容分成不同层次，确保重要元素让用户一眼看到，次要的信息则拉开距离，通过留白、颜色排版、字体、大小等方式来表现层次感，让用户快速识别关键信息。

交互优先

优先主要的交互路径，将次要的交互路径弱化。最常见如“高级搜索” “更多信息“等的形式。

少即是多

去掉不必要的信息、让用户专注于重要的内容。

减少干扰

• 让用户一眼就能找到有用的内容，并让这些内容看起来更优美。
• 对页面元素进行主次区分，精简页面显示内容，去掉与任务无关的信息。

精简表述

文字表述必须简明扼要、清晰易懂，易于理解；

操作简单

• 合并或删除冗余的操作步骤；
• 两个功能相同的设计，请选择最简单快捷的。

对齐

界面元素的对齐，既符合用户的认知特性，也能引导视觉流向，让用户更流畅地接收信息。

文案类对齐

页面的文字与段落需要确定统一的视觉起点，默认从左至右。

标题类对齐

标题起到引导定位，需要遵循从左到右的阅读习惯，标题左对齐。

数字类对齐

为了快速对比数值大小，所有数值取相同位数（精度统一控制），保持右对齐。

表单类对齐

• 表单水平分布时，所以内容必须水平对齐。
• 标单字段名左对齐，内容左对齐。同类表单末端对齐。

• 文字在表单上方时，文字与输入框左对齐。

表格类对齐

单元格文字左对齐。

接近法则

距离越近的元素，相互关系越亲密，关联性越强；距离越远的元素，关系越疏远。

用户心理

用户对于“自己如何进行操作、计算机将怎样运行”会有自己的习惯、想象或预期。越接近用户心理，用户就会越感觉到易于使用和理解。界面的设计，需探究用户每一步操作中想得到什么和需要什么。

颜色

颜色由主色、情境色、文字和不同色阶的灰色构成。

主色/品牌色

对页面颜色起决定性作用，用于默认的组件，并表达主要操作。

主色/品牌色

辅助页面配色

情境色

不同颜色表达不同的状态与情绪。

• info：传达提示，操作，辅助的信息。
• Success：传达健康、积极等正面的情绪，正确的信息。
• Warning：表达告警类信息，谨慎的操作。表达告警类信息，表达谨慎的操作、突显的金额、草稿。
• Danger：表达错误类信息；危险的操作。

文字

包含标题、正文、描述文字和链接。

背景与边线

组件背景、边框线、分隔线等其它颜色。

字体

基于通用性的原则，集合不同平台和浏览器下的优秀字体，使得页面在不同的平台下都能优先使用最适合的字体。

• Windows英文与数字的首选字体Tahoma ，备用字体Arial，中文字体Microsoft Yahei。
• MAC OS英文与数字的首选字体：Helvetica Neue、Helvetic，中文字体：Pingfang SC。
• 其它备用字体sans-serif。

图标

图标的设计与使用都应遵守相应规则。

设计规则

• 图标描绘的形态应当扁平、正面；
• 视觉大小一致，笔画线条一致；
• 使用统一的网络制图，不超出网格范围；

使用规则

• 优先使用提供的字体图标；
• 避免块状图标和线性图标混用；
• 必要时辅以文字说明；
• 任何时候单独的图标，鼠标移入时都应当提示其含义；
• 严禁多种图标代表一种含义或一个图标代表多种含义；
• 尽量沿用大家习惯的图标形象；
• 减少装饰型图标。

布局

栅格布局

沿用目前使用的栅格系统，将布局分为24个栅格单元。使用模块化布局，结合栅格系统实现宽度自适应，每个页面可以由单个或多个模块构成。

表单录入页需要填写大量信息，一般采取栅格的方式排版，文字右对齐，输入框、下拉框、单选多选等录入组件左对齐。为了保持视觉上的平衡，实际栅格区域为页面内容区域的96%。

文案

合适的表达方式能与用户产生共鸣，合适的语气能给予用户安全感，因此文案应当被重视。

文案原则

• 从用户角度出发，以用户为主体来写作；
• 文案必须精准、清晰、容易理解，没有歧义；
• 表述一致；
• 重要的文字放在显著位置；
• 表达积极、友好、正面。

英文书写规范

• 英文各单词，以1个空格分隔；
• 第一个单词、最后一个单词无论词性首字母大写，如Cloud host, Cloud hard drive。
• 一般需使用全称，专业领域用缩略语，缩略语全大写，如VDC、VPC；
• 实词(名词、动词、代词、形容词、副词等)首字母大写；
• 虚词(介词、冠词、连词、感叹词)首字母小写，有4个字母以上的虚词首字母大写；
• 常用单词应该注意规范，例如：备注应该叫Remarks，而不是Comments；
• 正确使用专有名词的大小写规范；
• 全英文的标题，标签，菜单项等等都要遵循英文单词首字母大写的规范；
• 句子遵循英文句子首字母大写的规范；
• 统计数据使用阿拉伯数字，用户对于数字的感知速度更快，使用数字而非文字会更加有效；
• 标点，使用英文标点，如果不在句末，后面要空一格；

• 不要用逗号“,”连接两个完整的句子，可以用分号“;”

  常用句型

• 常用

成功：Succeeded(Succeed) in (doing) something.
新增、删除、修改成功：Succeeded(Succeed) in adding / deleting/ modifying…
失败及原因：Failed(Fail) to do …, because + clause .
输入：Please input…，
选择：Please select a/an …

• 文本长度：The length of … is larger than the maximum length.
  • 数值

数字长度，需要告知长度限制，The maximum length of … is ….
值限定提示：The value of XXX should be XXX. Please input again.
XXX是数字：The… should be number. Please input again.
XXX是整数：The …… should be integer. Please input again.
XXX是整数，且必须小于XX：The ……should be integer less than …
大于/小于等于/大于等于：greater than/less than or equal to/greater than or equal to
XXX是整数，且必须小于XXX，大于XXX：The ……should be integer between … and …. .
XXX是大于零的整数：The … should be integer greater than zero.

• 对比

存在同样的XXX，请重新输入：The same …… exists; please input again.
存在XXX 相同的XXX，请重新选择：The … with the same … exists; please select another one.
XXX不能和XXX相同：The … cannot be as same as ….

• 时间与日期

起始时间（日期）：start time/date
终止时间（日期）：end time/date
生效： effective time/date
失效：expiry time/date
起始时间不能大于终止时间，请重新设置：The start time cannot be later than the end time. Please input again.
起始时间不能大于等于终止时间，请重新设置：The start time should be earlier than the end time. Please input again.

• 无记录

查询没有记录：No results were found.