UI界面设计需要遵循哪些规范

作者&投稿:虞彬 (若有异议请与网页底部的电邮联系)
UI设计有哪些规范~

高质量的规范文档是一个优秀设计系统的代表物。我们详实地描述每个 UI 组件的设计与代码规范,来帮助设计师高效地作出决策,推动开发速度。编写高质量的文档需要前期规划和一系列合理的流程来辅助,付出的成本相当高。
这个系列由六篇文章组成,致力于描述编写组件规范文档的过程。本篇我会从目标读者、文档内容、文档结构开始。然后会涉及案例,设计与代码指南。这些内容来自于我自己这些年的实践经验以及社区里大家所分享的知识。

那么我以一个问题开始今天的主题:文档的目标读者是谁,他们需要什么样的内容,作为编写者我们该怎样组织文档结构来作出清晰的表达?


文档的目标读者
首先:你要弄清楚谁是你的文档的主要读者。

工程师,设计师,还有公司里的所有人!
当一个设计系统包含了代码指南,工程师们显然会是读者。那么一个只包含了代码指南的设计系统应该服务于设计师吗?如果文档里只包含了设计规范而没有代码(如 Material Design),工程师还是读者吗?

在我看来,两个问题的答案都是肯定的。规范文档是从不同的角度来服务于多种角色的。
除了设计与工程,它还服务于其他人吗?很有可能,特别是当文档所在的设计系统已经成为产品的基石时。简短有效的介绍对于 PM(产品经理) 很有价值,QA(测试) 则比较关注案例部分…等等。
规范文档是从不同的角度来服务于多种角色的

很多设计系统团队还会把自己的系统公开出来,在体现共享精神的同时也能起到吸引行业人才的作用。所以文档应该能够体现团队的专业与严谨。
文档的主要目标是:为设计师、工程师和团队里的其他角色服务,让他们能够高效地做决策。

Takeaway:设计系统的效应和影响力不只覆盖设计与工程,一个成长中的系统必将会服务于更多的角色。


工程师,接着是设计师,然后才是其他人
为所有角色服务并不意味着平等地服务所有角色。工程师每天会查阅 10 次或更多次文档,他们甚至会把文档与代码编辑器窗口并排排列!设计师的访问次数应该是少于工程师的,其他角色则会更少。

所以谁是最重要的?以我的经验来看,设计系统最初就是为了工程与设计之便,由工程师和设计师建立的。即使其他角色也对其有所贡献,但他们仍是偏次要的。因此我们首先需要确保工程师与设计师的需求能够得到满足。

设计师与工程师优先级最高


那么,工程师与设计师孰轻孰重呢?我最近参与设计的设计系统项目中都需要同时服务于两者,为设计和代码制作规范指南。我也在一些企业的文档中看到了对其中一方的过多偏见,或者是有将他们的目标完全分离开的倾向(稍后我会解释)。有很多维度需要考量:设计系统的目标,他们的使用频率,内容深度、质量、生产成本,以及和他们日常工作的相关度。

设计师 vs 工程师

Takeaway:读者的优先级由很多因素决定。要有预期:工程师和设计师的需求会有冲突,并尽可能地优化和处理这些冲突。如果实在不行,就要偏向于距离最终产品最近的那一方,通常是工程师。这就意味着工程师优先,设计师其次。


文档内容
规范文档是连接读者与内容的媒介。内容会有不同的格式或模块,因此成本也各有差异,而你需要最终把它们编织在一起。

文档内容模块:简介和案例文档内容模块:设计参考和代码参考

抽象地来看,规范文档的内容通常包含以下四种模块:
介绍:组件的名称,以及一段简明扼要的介绍。(必要)
案例:这个组件的各种形式,状态,尺寸等等其他要素,比较好的做法是用代码直接把这些展示出来,而不是不可以交互的静态图片。(必要)
设计参考:比如什么时候应该用这个组件,允许的做法与不允许的做法,以及视觉、交互、文案方面的指南。(推荐)
代码参考:包含 API 和其他实施及部署方面的指南。(必要)
不同的模块会有不同的制作成本
「介绍」写起来当然非常的短平快。结构优秀的「案例」也是值得投入成本的,并且写起来会越来越顺手。工程师也需要一个合理清晰的「代码参考」。但是,真正有效的「设计参考」可能会非常耗费成本。
横轴:细节的丰富程度由浅到深。纵轴:制作成本由低到高
请点击输入图片描述
Takeaway:规范文档可以包含很多内容模块。所以需要团队在前期就进行充分的讨论,对每种内容模块做出符合自己团队和产品价值的判断,再投入成本去制作。
文档的信息结构
设计与代码:分开还是合并?
在实践中,设计师往往会自顾自的发布或更新和自己相关的内容,工程师也一样。这样的惯性行为会在无意中增加设计与工程的距离。所以大家需要在前期就对文档的信息结构达成共识。
谷歌的 Material 文档生态就是这种距离感的代表。 Material’s design foundation 优先服务于设计实践, 而 Material Design Lite,Polymer Project,Android Developer’s,Material UI (built for React) 都是服务于代码,和设计规范绑定的并不紧密。

请点击输入图片描述
这种分离的状态其实是有意义和理由的。因为 Material 是一个操作系统的底层系统,跨越了许多框架,团队,平台。它的复杂度在某种意义上超越了目前世界上所有的设计系统。但你要知道大多数的设计系统并不是服务于一个操作系统的,因此不会发展至如此复杂的形态。
对于像我们一样的产品团队来说,设计和代码分开是符合共识的。这种做法能够给分别为两种角色设计符合他们需求的体验。
组件设计规范与 API 和代码规范分别放在两个网站上。来自:Atlassian
请点击输入图片描述
这种做法也有风险。随着时间推移,两个网站可能出现不同步的现象:
设计与代码的分类逻辑出现差异(最简单的例子就是 Loader 和 Spinner 的命名:代码里叫 Loader,而设计里则叫 Spinner)
功能差异:设计规范里出现了代码不能实现的功能,或者代码里加入了设计里没有考虑的功能。
你可能会觉得这样也挺好,毕竟设计和代码本身就是两个领域。至少对于文档的写作者来说这种分离还是挺方便的(只用考虑自己的需求,管理自己的进度)。
但真正的读者需要的是一个「真相的唯一来源(Single source of truth)」。如果你是一个对设计和代码都有需求的读者,你会发现自己不停在两个网站间切换,两个地方都有对你有价值的内容,这感觉就像是在打网球时陷入了拉锯战。
Takeaway:要慎重地看待设计与代码的分离。虽然一开始方便了内容作者和发布者,但之后会有风险。这种做法也可能会在潜移默化中造成设计与工程的距离扩大。
合并内容的两种方案:堆叠还是切换?
例如 Morningstar Design System 是把设计和代码放在一个页面里,读者就能找到完全统一的命名,指南,功能描述。
一个页面之堆叠式:把设计和代码放在一个页面中,纵向滚动来查看。
请点击输入图片描述
堆叠式的布局方式会使得页面变得冗长。当然还有一种方式是使用 Tab 来切换内容。
一个页面之切换时:把设计和代码放在一个页面中,通过 Tab 来切换内容。
请点击输入图片描述
Takeaway:将设计和代码混合在一起是有可能的,大家可以按自己的需求来选择以上两种布局方式。
按类型来为内容做排列和编组
不论选择那种布局方式,文档内容的模块结构和顺序应该是保持一致的:
简介
案例
设计参考
代码参考
其实只要把「案例」放到读者一进来就能看到的地方,把设计和代码参考放在一步点击就能达到的地方,就是一个不错的设计了。下面是几种行业内比较有代表性的模式:
左:IBM Carbon 模式 中:Hudl's Uniform System 模式 右:Lightning Design System 模式
请点击输入图片描述
IBM Carbon 认为代码更应该被优先展示,将交互用法和样式分别放在其他的 Tab 中。Hudl’s Uniform system 把顺序反了过来,设计优先于代码。 Salesforce’s Lightning Design System 把代码和组件案例放在 Tab 上方,默认选中开发者指南这个 Tab,而后两个 Tab 则被奇怪地留空了。
Takeaway:把简介和案例放在一开始最重要的位置,接下来的模块则没有唯一的方案,需要大家自己做出符合自己团队情况的判断。
若页面很长,则为读者提供定位导航
你的文档页面越长,越需要给读者清晰的认知,要让他们知道这个页面里会包含哪些内容以及当前所处的位置。纵向的定位导航栏是个不错的方案:一直固定存在于页面右侧,在滚动时同步追踪位置,并且可以包含子标题。
Morningstar Design System 在文档页面右侧设计了一个两级的定位导航栏
请点击输入图片描述
Takeaway:不论选择哪种形式,最重要的是在整个系统中保持逻辑一致,符合读者的预期与心理模型。
展示设计?展示代码?还是都展示?
把设计和代码融合,就会有读者只对其中一个方面感兴趣,他们会提出自己的意见:
设计负责人可能会问到:我能把这些代码案例和指南隐藏掉嘛?
工程师可能会问:我能把这些和设计规范有关的文字隐藏掉嘛?
可以考虑加一个选项或按钮来允许隐藏设计/代码内容。比如:
Design Only:把代码指南、代码片段和属性表等等都隐藏起来
Code Only:把视觉样式指南和文案指南都隐藏,但还是要把一部分交互用法指南保留着,这对工程师们也有用。

UI即User Interface(用户界面)的简称,UI设计是指对软件的人机交互、操作逻辑、界面美观的整体设计,好的UI设计不仅是让软件变得有个性有品位,还要让软件的操作变得舒适简单、自由,充分体现软件的定位和特点。



在飞速发展的电子产品中,界面设计工作一点点的被重视起来,做界面设计的“美工”也随之被称之为“UI设计师”或“UI工程师”,其实软件界面设计就像工业产品中的工业造型设计一样,是产品的重要卖点,一个产品拥有美观的界面会给人带来舒适的视觉享受,拉近人与商品的距离,是建立在科学性之上的艺术设计,那么,UI设计的规范标准有哪些呢?

一、轴

轴在UI设计中是最基本、最常见的概念,也是用来组织界面结构的重要核心。

简单说来,轴是在设计的时候组织一系列元素的假象线,在下面的设计图中,轴以虚线的方式被标注出来。

1、对齐

轴最常见于对称元素的使用,当元素被布置成轴对称的布局的时候,会给人有序感。就像生活中绝大多数的事情一样,我们更倾向于享受有序的的东西,它们令人感觉平稳、舒适、平易近人。



最简单的一个例子就是iTunes程序中的专辑列表的设计,所有的专辑列表在界面的左侧保持对齐,围绕虚线轴轴对称。

2、强化

虽然轴是一条假想的线,但是如果周围的元素的边缘控制得足够整齐,这跳线会在视觉中变得更加“明显”的。

最好的例子是城市中的路灯构成了道路两旁建筑物之间的轴,如果一边有建筑一边没有,那么这种轴线的感觉不会那么强烈。



从产品设计的角度上来看,Twitter的时间线设计就是一个很好的案例,左侧的头像和右侧的推文共同塑造出缝隙中轴线的感觉。

3、运动

当我们碰到某先线条的时候,视觉会很自然地沿着这些方向运动,就如同我们站在街上,会自觉地沿着街道的两头走动。两个端点决定了线,界定了开始和结束的地方,线或者说轴线的存在会引导和提示运动的方向。



SoundCloud中,音轨沿着一条既定的水平轴线运动,随着音乐的播放,音轨自然地自左向右匀速运动(具体可查看马海祥博客《如何利用动效设计吸引访客的注意力》的相关介绍)。

4、连续性

如果终点是不确定的,那么你通常会沿着轴线的方向浏览/运动,直到你找到感兴趣的东西,或者感到厌倦并关闭应用。

在建筑学中,未清楚界定的终点非常少见,因为建筑的修建通常没法永远持续下去,但是UI设计则不一样,无限地滚动下去是无比受欢迎的设计手法。



Pinterest的APP中就是这样做的,持续不断的图片沿着中轴线的方向持续不断地滚动下去,只要你有兴趣一直观看下去。

二、对称

当元素被均匀地放置在轴线的两侧之时,他们构成了对称的关系。当元素被精准地在轴线两侧一一对应之时,它们就形成了完美对称。

1、平衡

对称令整个设计更加平衡,当元素与控件在轴线两侧处于相同位置之时,会给人以协调和谐的设计感。

当我们在规划街道两侧的房屋建设的时候,如果左右两侧都是5间大小一致的房子,当你走在街上的时候这种平衡的设计会令人非常舒适,这是平衡给人的感受。



Rdio的APP设计就遵循着这样的设计规则,屏幕两侧的控件是相同的规格,这类布局很适宜阅读,用户会自觉地自上到下,从左向右查看。

2、不对称

如果轴线两侧的控件布置不再是一一对应尺寸相近,那就是不对称的设计,不对称的设计会给人明显的失衡感,可能会令人不舒服,但是也能造就残缺美,当然这要看你具体怎么做。



虽然Pinteret的APP设计在整体上是沿着中轴线对称的(宽度一致),但是两边的界面控件并非是对称的,它们的高度并不一致,位置也是错落的,稍微一点的落差都会被眼睛捕捉到,而这样的差异让用户无法准确地左右顺序阅读,不对称设计打破了设计的平衡性和舒适性,但是也可以缓解了规律性设计带来的视觉疲劳。

三、层级

当某个元素出现在比其他元素更重要的位置的时候,层级就出现了。

1、尺寸

如果一个设计元素在尺寸上比其他的控件更大,就会区分出层级。毫无疑问,我们查看某个设计的时候,通常会被最大的元素吸引到。如果一个建筑物有5个出窗户,其中一个是其他四个的两倍大,我们的注意力自然而然会被吸引过去。



通过尺寸来区分文章列表层级的典型就是稍后读应用Pocket,顶部的轮播文章拥有更大的图片,它的位置和尺寸会令我们一眼注意到(具体可查看马海祥博客《详解移动端设备页面尺寸设计原理》的相关介绍)。

2、形状

如果一个控件在形状和形态上同其他的不一样,也可以让它独立出一个层级,不规则的设计同样会令人侧目,建筑物的正面拥有五个相同的窗户和一闪大门,你会立刻注意到门的独特之处。



在Instagram的个人信息页中,圆形的个人头像在方形的图片中别具一格,非常抓人眼球。它会让人意识到,这个独特的东西,更为重要。

3、位置

位置的存在同样能彰显层级的不一样,在圆圈之内,中心位置的东西比边缘部分的看起来更重要,位于轴线顶端的控件会显得比其他部分的优先级更高。



以设计应用Path的设计为例,时间轴顶点处的用户头像就明显比时间轴上的其他部分更重要,而这个地方正好展示的也是用户头像。

四、韵律

UI设计和建筑设计同样有着韵律之美,重复的模式会营造出独特的节奏之美。

1、模式

理解韵律最直接的方式就是听歌,音乐拥有节奏感,绝大多数的音乐遵循着相同的节拍,节拍就是音乐模式的一部分。



这方面最典型的APP是Airbnb,APP列表中每一间房子都占据一个模块,模块中有着大小相同的图片,价格、位置和房东信息和图片的相对位置一定,且排版匀称舒服,两个模块之间的间距也相同,当你浏览的时候,熟悉的节奏会让你清楚地知道上哪看关键信息。

2、间断

当节奏被间隔打断的时候,会形成不同的层级,听歌的时候,均匀的节奏被其他的音乐元素打断的时候,你会意识到这是比较特别的部分。



在Twitter的APP中,推文和推文保持着相同的样式,均匀的节奏,但是其中的“推荐用户”一项有着不同的样式,它插入到推文列表中,打破了整个信息流的节奏,凸显出不同的层级,会很快抓住你的注意力。

一:遵循一致的准则,确立标准并遵循
无论是控件使用,提示信息措辞,还是颜色、窗口布局风格,遵循统一的标准,做到真正的一致。
这样得到的好处:
1:使用户使用起来能够建立起精确的心里模型,使用熟练了一个界面后,切换到另外一个界面能够很轻松的推测出各种功能,语句理解也不需要费神理解
2:降低培训、支持成本,支持人员不会行费力逐个指导。
3:给用户统一感觉,不觉得混乱,心情愉快,支持度增加
二:(Color)颜色使用恰当,遵循对比原则:
1:统一色调,针对软件类型以及用户工作环境选择恰当色调:
如:安全软件,根据工业标准,可以选取黄色,绿色体现环保,蓝色表现时尚、紫色表现浪漫等等,淡色可以使人舒适,暗色做背景使人不觉得累等
2:如果没有自己的系列界面,采用标准界面则可以少考虑此方面,做到与操作系统统一,读取系统标准色表
3:色盲、色弱用户,即使使用了特殊颜色表示重点或者特别的东西,也应该使用特殊指示符,?quot;!,?着重号,以及图标等
4:颜色方案也需要测试,常常由于显示器、显卡的问题,色彩表现每台机器都不一样,应该经过严格测试,不同机器进行颜色测试
5:遵循对比原则:在浅色背景上使用深色文字,深色背景上使用浅色文字,蓝色文字以白色背景容易识别,而在红色背景则不易分辨,原因是红色和蓝色没有足够反差,而蓝色和白色反差很大。除非特殊场合,杜绝使用对比强烈,让人产生憎恶感的颜色。6:整个界面色彩尽量少的使用类别不同的颜色
三:(Resource)资源
一个多姿多彩的人机交互界面,少不了精美的鼠标光标、图标以及指示图片、底图等。
1:也需要遵循统一的规则,包括上述颜色表的建立,图标的建立步骤也应该尽可能的形成标准,参考itop的outlookbar图标设计标准
2:有标准的图标风格设计,有统一的构图布局,有统一的色调、对比度、色阶,以及图片风格
3:底图应该融于底图,使用浅色,低对比,尽量少的使用颜色。
4:图标、图像应该很清晰的表达出意思,遵循常用标准,或者用户机器容易联想的到物件,绝对不允许画出默认奇妙的图案。
5:鼠标光标样式统一,尽量使用系统标准,杜绝出现重复的情况,例如某些软件中一个手的形状就有4钟不同的样子。
四:(Font)字体
使用统一字体,字体标准的选择依据操作系统类型决定。
中文采用标准字体,“宋体”,英文采用标准MicrosoftSansSerif不考虑特殊字体(隶书、草书等,特殊情况可以使用图片取代),保证每个用户使用起来显示都很正常。
字体大小根据系统标准字体来,例如MSS字体8磅,宋体的小五号字(9磅)五号字(10.5磅)。
所有控件尽量使用大小统一的字体属性,除了特殊提示信息、加强显示等例外情况
Windows系统有个桌面设置,设置大字体属性,很多界面设计者常常为这个恼火,如果设计时遵循微软的标准,全部使用相对大小作为控件的大小设置,当切换大小字体的时候,相对不会有什么特殊问题。
但是由于常常方便使用点阵作为窗口设计单位,导致改变大字体后,出现版面混乱的问题。
这个情况下,应该做相应处理:
1:写程序自动调节大小,点阵值乘以一个相应比例
2:全部采用点阵作为单位,不理会系统字体的调节,这样可以减少调节大字体带来的麻烦。BCB/DELPHI中多采用这种方法,但是必然结果是和系统不统一。
五:(Text)文字表达
提示信息、帮助文档文字表达遵循以下准则:
1:口语化、客气、多用您、请,不要用或少用专业术语,杜绝错别字
2:断句逗号句号顿号分号的用法,提示信息比较多的话,应该分段,
3:警告、信息、错误使用对应的表示方法
4:使用统一的语言描述,例如一个关闭功能按钮,可以描述为退出、返回、关闭,则应该统一规定。
5:根据用户不同采用相应的词语语气语调,如专用软件,可以出现很多专业属于,用户为儿童:这可以语气亲切和蔼,老年用户则应该成熟稳重。制定标准遵循之。
六:(STYLE)控件风格,不要使用错误控件,控件功能要专一
有设计好的同一风格的控件,如果没有能力设计出一套控件,则使用标准控件,绝对不能不伦不类,杂乱无章
不要错误使用控件,例如:
使用Button样式做TTable的功能,拿主菜单条显示版权信息,
统一类型的控件操作方式相同,例如一个控件双击可以执行某些动作,而同样控件,双击却没有任何反映
一个控件只做单一功能,不复用
七:(ALIGN)控件布局,窗口不拥挤,按功能组合控件
1:屏幕不能拥挤
拥挤的屏幕让人难以理解,因而难以使用。试验结果(Mayhew,1992年)屏幕总体覆盖度不应该超过40%,而分组钟覆盖度不应该超过62%。
让人看上去,不能太拥挤,也不能太松散。
整个项目,采用统一的控件间距,通过调整窗体大小达到一致,即使在窗体大小不变的情况下,宁可留空部分区域,也不要破坏控件间的行间距。
2:区域排列
一行控件,纵向中对齐,控件间距基本保持一致
行与行之间间距相同,靠窗体Border距离应大于行间间距(间距加边缘留空)。
当屏幕有多个编辑区域,要以视觉效果和效率来组织这些区域。
3:数据对齐要适当
说明文字,中文版应使用中文全角冒号,纵向对齐时,并按冒号右对其,如图。纵向控件宽度尽量保持相通。并左对齐。
4:有效组合
逻辑上相关联的控件应当加以组合,以表示其关联性,反之,任何不想光的项目应当风格开,在项目集合间,用间隔对其进行分组,或者使用方框划分各自区域。
例如:以下界面,选择搜索方式来判断号码范围是表示主叫号码范围还是被叫号码范围,和入帐方式无关,
则应该修改为:搜索方式和入帐方式调换位置。以免用户产生误解。
5:窗口缩放时,控件位置、布局:
为了使界面不出现跑版或者难看的局面,解决方法:
1:固定窗口大小,不允许改变尺寸,
2:改变尺寸的窗口,在Onsize的时候做控件位置、大小的相应改变。
BCB/DELPHI的VCL中,大部分控件有布局属性: 某些控件拥有alignment属性,可以用来做布局调节:TcustomPanel,Tmemo等,考左靠右靠上靠下以及撑满(Client)属性,用来根据版面自动调节。
大部分控件有属性Anchors,里面上下左右akLeft,akTop等如果为true,则表示相对各个边缘的距离是否改变。这个可以进一步设计好排版工作。
八:(TABORDER)TAB顺序
习惯用法,阅读顺序,从从左到右,从上到下
窗体中控件的Tab按键激活顺序,TabOrder,.BCB/DELPHI中使用窗体设计右键菜单选择taborder设置,VC中窗体RES编辑区域使用ctrl+D
九:(ShortcutKey&Accelerator&PopMenu)快捷键、加速键和弹出菜单
快捷键:
1:全局快捷键菜单中加以描述CTRL+XXX并入帮助列表。
2:快捷键写入帮助,特殊说明,并在使用培训时强调使用
十:(ACTION)用户交互
1:disable而不是notvisible
要使一个功能有时允许有时不允许用户使用,则这个控件的不能随便隐藏,应该使用disable属性进行表示,以免用户发现控件失踪后措手无策
2:窗口弹出位置要明显
点击一个控件,弹出窗口或者菜单,应该给人明显提示,最低要求是覆盖刚才点击的位置,让用户轻松跳转到新的界面。
3:执行动作要提示
十一:(HELP)联机帮助:
1:系统默认、行业标准的控件操作不需要逐一描述,只需要对特殊控件加以描述
2:特殊操作、特殊功能界面,在界面上加控件直接连接到对应的HELP文件中
3:特殊设置详细,应该在界面上用简洁明了的语句说明,或者是好用Tiptool,并由第二步帮助
十二:发行时阐明规则
对统一的东西进行逐一阐述,并加以典型描述,放入HELP和用户手册中,同时加有词汇表

附录:
美工何时参与进来:
美工作为界面美化的主要人员,不但拥有艺术设计、包装设计的才能,还应该穿插整个项目,给界面程序设计人员提出系统参考意见。
1:软件设计前期,美工参与需求了解,分析同类软件界面有缺点,提出主色调、典型界面风格、以及构思整个美术包装等。
2:界面原型设计过程中,与开发人员共同修改、商榷最终表现样式,以及确立UI标准。
3:程序开发过程中,提供标准风格的资源文件(icon,cur,bmp等),并总结出统一风格的资源的设计过程,形成规范文档*.
4:产品化方面,协助制作帮助文件、网站风格以及参与制作,制作附带宣传图片、动画、产品包装、海报等。

  一:遵循一致的准则,确立标准并遵循
  无论是控件使用,提示信息措辞,还是颜色、窗口布局风格,遵循统一的标准,做到真正的一致。
  二:(Color)颜色使用恰当,遵循对比原则
  三:(Resource)资源
一个多姿多彩的人机交互界面,少不了精美的鼠标光标、图标以及指示图片、底图等。
  四:(Font)字体
使用统一字体,字体标准的选择依据操作系统类型决定。
  五:(Text)文字表达
提示信息、帮助文档文字表达遵循以下准则:
1:口语化、客气、多用您、请,不要用或少用专业术语,杜绝错别字
2:断句逗号句号顿号分号的用法,提示信息比较多的话,应该分段,
3:警告、信息、错误使用对应的表示方法
4:使用统一的语言描述,例如一个关闭功能按钮,可以描述为退出、返回、关闭,则应该统一规定。
5:根据用户不同采用相应的词语语气语调,如专用软件,可以出现很多专业属于,用户为儿童:这可以语气亲切和蔼,老年用户则应该成熟稳重。制定标准遵循之。
  五:(Text)文字表达
提示信息、帮助文档文字表达遵循以下准则:
1:口语化、客气、多用您、请,不要用或少用专业术语,杜绝错别字
2:断句逗号句号顿号分号的用法,提示信息比较多的话,应该分段,
3:警告、信息、错误使用对应的表示方法
4:使用统一的语言描述,例如一个关闭功能按钮,可以描述为退出、返回、关闭,则应该统一规定。
5:根据用户不同采用相应的词语语气语调,如专用软件,可以出现很多专业属于,用户为儿童:这可以语气亲切和蔼,老年用户则应该成熟稳重。制定标准遵循之。
  六:(TABORDER)TAB顺序
习惯用法,阅读顺序,从从左到右,从上到下
窗体中控件的Tab按键激活顺序,TabOrder,.BCB/DELPHI中使用窗体设计右键菜单选择taborder设置,VC中窗体RES编辑区域使用ctrl+D

UI设计不仅是让某个APP或软件有个性有品位,吸引用户,还有一个是操作舒适、简单、突出软件的定位和特点,蓝湖的设计规范云可以尝试一下

UI界面设计原则有哪些?
答:① 一致性原则。在界面设计中,一致性原则通常包含窗体大小、形状、色彩的一致性,文本框、命令按钮等界面元素外观的一致性,界面中出现术语的一致性等。一致性原则在设计中最容易违背,同时也最容易修改和避免。缺乏一致性使得界面混乱而无序,这样的界面会使应用程序看起来混乱而不严密,会给用户的使用...

UI设计有哪些要求?
答:UI设计有的要求有:1、保证界面清晰 清晰的界面,是每个 UI 设计师都必须遵从的原则。一个让用户看起来非常模糊,主题杂乱的界面会让用户对这个软件产生一种厌烦感,还会让用户产生视觉疲劳。所以一个优秀的 UI 设计师第一要求就是要建立一个清晰的界面,提高用户体验。2、实现软件简洁 对于 UI 设计来...

手机UI设计有哪些规范?
答:手机UI设计规范:1、尺寸问题: 480乘800,540乘960,720乘1280,1080乘1920象素尺寸是较常见的手机屏幕尺寸,在设计时可以根据实际产品要求进行设计,更大的屏幕可以有更多的交互表现和视觉元素的支持,较为自由;2、色彩问题: 由于手机lcd本身的限制,在色彩的还原程度上没有pc如此完善,因此在选用色彩...

ui设计的质量标准是什么?
答:手机界面设计的重要性1、ui设计原则的重要性一个清晰的界面是最重要的清晰的界面是UI设计最重要的原则之一。要让用户喜欢您的用户界面,您必须首先让他们认识到它并知道如何使用它。2、”界面设计“不论对于何种产品都是非常重要的营销手段,为什么将其称之为”营销手段“呢?其实界面对于产品本身来说,...

如何建立一套UI设计规范
答:确定好模块与模块之间的分割方式后,还需要确定模块内部的,确定之后就要严格执行。比如规范定的模块与模块之间用线,模块内部之间用留白,那后续所有页面都需要按照这个规则来(特殊情况除外)。3、标准色 颜色是设计最重要的部分,没有之一。细节决定品质,所以对颜色的运用格外细致,颜色的搭配直接决定产品...

ui设计规范怎么写
答:一、UI标注的规范 1、尺寸。例如图标、图片这些内容关于尺寸维度的标注。需要注意,比如图片的尺寸比例,不是固定的它的大小数字,这样开发才能更好的适配,常用的图片比例有4:3、16:9等。如果控件给出固定的尺寸数值,按钮的宽和高度都标注出来,开发就会写死按钮的尺寸,一旦遇到屏幕有比例不同的时候...

ui界面设计有哪些原则
答:导语:软件设计可分为两个部分:编码设计与UI设计。UI的本意是用户界面,是英文User和 Interface的缩写。从字面上看是用户与界面2个部分组成,但实际上还包括用户与界面之间的交互关系。那ui界面设计有哪些原则?下面就由我为大家介绍一下,希望对大家有所帮助!1.简易性 界面的简洁是要让用户便于使用...

PC客户端UI设计有哪些规范
答:3、记忆负担最小化 人脑不是电脑,在设计界面时必须要考虑人类大脑处理信息的限度。人类的短期记忆有限且极不稳定,24小时内存在约25%的遗忘率。所以对用户来说,浏览信息要比记忆更容易。4、一致性 它是每一个优秀界面都具备的特点。界面的结构必须清晰且一致,风格必须与产品内容相一致。软件中往往...

UI设计的基本设计原则都有哪些?
答:所以,漂亮和美观只是提升体验和激发共鸣或者说愉悦的一个重要手段。对于一个产品而言,特别是那种大的产品,完成目标任务永远是第一位。设计师所要做的是细节耐心的打磨界面,让别人更加愿意花费时间和精力去使用你的产品。以上就是UI设计的基本设计原则,要想成为一名优秀的设计师,需要从多个角度去给自己...

web界面设计规范有哪些-UI设计规范:如何构建Web端?
答:网站界面设计规范有哪些? 易用性规范 2.001常用按钮要支持快捷方式。 2.002完成同一功能或任务的元素放在集中位置,减少鼠标移动的距离。 2.003界面要支持键盘自动浏览按钮功能,即按Tab键的自动切换功能。 2.004界面上首先应输入的和重要信息的控件在Tab顺序中应当靠前,位置也应放在窗口上较醒目的位置。 2.005分页界面要...