软件ui设计原则(软件的ui设计)
大家好!今天让创意岭的小编来大家介绍下关于软件ui设计原则的问题,以下是小编对此问题的归纳整理,让我们一起来看看吧。
本文目录:
一、软件界面设计原则有哪些
界面设计原则总的来说可以概括成界面在用户的掌控之中、保持界面的一致性和减少用户记忆的负担这三大点,下面就给大家具体介绍一下界面设计原则。(一)界面设计原则(1)用户原则。人机界面设计首先要确立用户类型。划分类型可以从不同的角度,视实际情况而定。确定类型后要针对其特点预测他们对不同界面的反应。这就要从多方面设计分析。(2)信息最小量原则。人机界面设计要尽量减少用户记忆负担,采用有助于记忆的设计方案。(3)帮助和提示原则。要对用户的*作命令作出反应,帮助用户处理问题。系统要设计有恢复出错现场的能力,在系统内部处理工作要有提示,尽量把主动权让给用户。(4)媒体最佳组合原则。多媒体界面的成功并不在于仅向用户提供丰富的媒体,而应在相关理论指导下,注意处理好各种媒体间的关系,恰当选用。(详见媒体的选择)(二)界面分析与规范在人机界面设计中,首先应进行界面设计分析,进行用户特性分析,用户任务分析,记录用户有关系统的概念、术语,这项工作可与多媒体应用系统分析结合进行,囊括于用户分析报告里。(三)人机界面的类型任务设计之后,要决定界面类型。目前有多种人机界面设计类型,各有不同的品质和性能,下图进行了详细的描述。创造性地使用多媒体环境,将会使应用程序功能大大增强。要做到这一点,需从如下两方面考虑:(1)媒体的功能:没有任何一种媒体在所有场合都是最优的,每种媒体都有其各自擅长的特定范围,各种媒体功能参考如下:①文本:在表现概念和刻划细节时可用表现。②图形:擅长表达思想轮廓及蕴含与大量数值数据内的趋向性信息,在空间信息方面有较大优势。③动画:可用来突出整个事物,特别适于表现静态图形无法表现的动作信息。④视频影像:适于表现其它媒体所难以表现的来自真实生活的事件和情景。⑤语音:能使对话信息突出,特别是在于影像,动画集合时能传递大量的信息。⑥姿态与动作:在与别的媒体结合时具有较强的信息引用能力,可以在相关信息之间建立起时间、空间以及逻辑上的联系。(2)媒体选择的结合与互补:脚本设计可根据内容需要分配表达的媒体,这里要特别注意媒体间的结合与区别。提出几条原则如下:①人们在问题求解过程中的不同阶段对信息媒体有不同需要。一般在最初的探索阶段采用能提供具体信息的媒体如语音、图像等,而在最后的分析阶段多采用描述抽象概念的文本媒体。而一些直观的信息(图形、图像等)介于两者之间,适于综合阶段。②媒体种类对空间信息的传递并没有明显的影响,各种媒体各有所长。③媒体结合是多媒体设计中需要研究的新课题。媒体之间可以互相支持,也会互相干扰。多种媒体应密切相关,扣紧一个表现主题,而不应把不相关的媒体内容拼凑在一起。④目前,媒体结合在技术上主要通过在一个窗口中提供多种媒体的信息片段(空间结合)和对声音、语音、录相等随时间变化的动态媒体加以同步实现(时间序列组合).⑤媒体资源并非愈多愈好,如何在语义层上将各种媒体很好的,结合以更有效地传递信息,是要很好地探索的研究课题,也是应用系统人机界面设计的关键问题。(四)界面设计原则中的用户心理学认知心理学,从广义上来说,就是关于认识的心理学。人类认识客观事物,主要就是通过感觉、知觉、注意、记忆、思维想象等来进行,因此,凡是研究人的认识心理过程的,都属于认识心理学。实际上,我们这里所指的认知心理学是指纯粹采用信息加工观点来研究认知心理学过程的心理学,也就是运用信息论以及计算机的类比、模拟、验证等方法来研究的的知识是如何获得、如何存贮、如何交换、如何取使用的。所以,我们这里所指的现代认知心理学实质是信息加工心理学。一般地,人们将信息加工心理学又称为狭义的认知心理学。1.认知过程看和听的过程构成知觉,图像和声音作为刺激的特征被接收并以抽象的方式被编码,把输入和记忆中的信息进行对比得出对刺激的解释,这一过程就是认知。人体信息处理器包括感官,短期记忆、长期记忆及与其相联系的动作处理器和认知处理器。每种知觉均有一个对应的短期存储器和处理器,人体信息模型总体框图如左图4.3.1所示。其中认知处理器执行的工作就是我们通常所说的思维。思维的结果或被存储起来,或送至动作处理器控制行动。2.认知心理学(1)现代认知心理学的核心: 现代认知心理学的理论实质,就是以计算机信息加工的观点来研究人的心理学活动,把人脑看作是一种如同计算机的信息加工系统。(2)现代认知心理学两个关键的重要概念: 现代认知心理学的学说内容集中体现在两个关键的重要概念上。现代认知心理学的一个重要的中心概念,就是“信息”。在某种程度上说,抽掉了“信息”的概念,认知心理学的理论也就会散架解体,难以存在。 现代认知心理学的另一个重要的中心概念,就是“信息加工系统”。信息加工系统的理论,是现代认知心理学理论的主体。(3)现代认知心理学的研究方法:现代认知心理学的研究方法有实验法、观察法(包括自我观察法)以及计算机模拟法等。3.人机交互设计遵循的认知原则根据用户心理学和认知科学,提出了如下基本原则指导人机界面交互设计。(1)一致性原则。即从任务、信息的表达、界面控制*作等方面与用户理解熟悉的模式尽量保持一致。(2)兼容性。在用户期望和界面设计的现实之间要兼容,要基于用户以前的经验。(3)适应性。用户应处于控制地位,因此界面应在多方面适应用户。(4)指导性。界面设计应通过任务提示和反馈信息来指导用户,做到“以用户为中心”。(5)结构性。界面设计应是结构化的,以减少复杂度。(6)经济性。界面设计要用最少的支持用户所必须步骤来实现。在界面设计原则指导下,提出以下几点针对界面设计与屏幕设计的参考:(1)由具体到抽象。即首先通过多媒体界面给用户提供具体的对象。然后从具体对象、内容中让学习者归纳出抽象的概念或原理,或用模拟系统来引导出抽象的原理。(2)由可视化的内容显示不可见的内容。尽可能利用数字、图解、动画、色彩等清晰爽目的对象显示原理、公式或抽象的概念。(3)由模拟引导创新。突出人机交互,尽量启发用户的积极思维和参与,并激起用户的学习和创造欲望。(4)合理运用再认与再忆,减少用户短期记忆的负担。所谓再认就是从系统给定的几个可能答案中要用户选择一个正确的或最好的。再忆即要求用户输入正确的答案或关键字。(5)考虑用户的个别差异,使用用户语言。以上五点具体体现了“由易而难,逐步强化。”这一源于认知心理学的原则。上文介绍的界面设计原则应该让大家心中对界面设计原则有了一定的认识,当然,因为界面设计是复杂的需要多学科参与的,心理学、语言学、设计学等学科都在里面占有重要作用。而用户界面是与程序交流的唯一方式,为了给用户提供最便捷的服务,界面设计原则是一定要遵守的。
二、UI设计的经验法则有哪些?
1.针对像素密度设计,而不是像素
例如,如果我们设计一个按钮元素,大小是200x50dp,那么它在160ppi的屏幕上显示为200x50dp,在320ppi的屏幕上显示为400x100px,即原始资源的2倍。
在某些屏幕每英寸的像素要比其他屏幕多,但设计资源却不会在像素密度高的屏幕上显得更小,这是因为在这些屏幕上会以原始尺寸的2倍,3倍,4倍进行渲染。这样的机制可以确保所有设计资源可以在不同密度和设备之间保持同样大小。
例如,iPhone XS Max的屏幕尺寸是414x896,但这不是像素尺寸而是点的数量,以像素为单位时是1242x2688px。考虑到这一点,在设计iPhone XS Max时,我会将在414x896点下设计,然后交付@3x的设计资源。
2.善用8dp增量
为什么设计中要用8dp这个增量规则?这里有一个简单的解释:我们使用8而不是5这个神奇数字的原因是,如果设备有1.5倍的分辨率,就很难被整除而出现锯齿。
此外,绝大多数的屏幕尺寸都可以被8整除,这就是使得我们的设计在这些屏幕上适配变得很简单。
在做设计的时候,应该时不时的停下来看看,确定下设计出的容器是否会使得UI变得混乱。通常,用于分隔内容的框和线可以用留白代替。
我们以前做设计的时候,喜欢将元素套在盒子里。所以,只需要把这些盒子去掉就能使页面看起来不那么密集,并给元素更多的呼吸空间,整个界面就能提升一个档次。
3.关注对比度
合适的对比度不仅可以让用户看到页面上的相关信息,还可以提高产品的易用性。
设计一款产品就类似于建造一个公共建筑,比如图书馆或学校,它需要包容所有人:盲人,色盲或视力受损的用户。
网页可用性标准(WCAG) (https://webaim.org/articles/contrast/ )规定对比度至少要达到4.5:1。
为了确保你做的设计符合标准,建议下载一个叫“stark ( https://getstark.co/)”的插件,来检查设计是否OK。
4.遵循用户习惯
某些元素被认为是标准的原因有很多。
例如,如果将按钮设计为圆形,那么当文本需要为“Start Free Trial”时,按钮就会占用不必要的垂直空间。
除此之外,用户已经开始期待类似的产品体验。如果你设计出来的网站,App,软件功能和用户所习惯的不太一样,那么它就是不直观的,用户就可能对这种体验感到失望。
因此,最好是在现有的设计规范的范围内进行创新,而不是去重新发明轮子。
5.用颜色深浅构建层次结构
每种颜色都有一个视觉权重,这有助于在内容中建立层次结构。通过使用颜色的深浅,为元素赋予不同的重要性。
这里的经验就是,如果一个元素比另一个元素更重要,那么它就应该具有更高的视觉权重。这能让用户很容易区分重要和不重要的信息,从而快速浏览页面。
更大,更醒目的信息会首先吸引用户的眼球,然后才会看向它下面的次要信息。
6.避免使用超过两种字体
一个普遍接受的设计共识就是在同一张界面中使用的字体数量应该要有限制。一般来说,两种不同的字体就足够了。这不是说不能用更多的字体了,而是最好要有合理的理由,否则最好不使用。
解决这个问题的方法是使用字体族。
使用字体族,我们可以在设计中使用具有不同变体的相同字体,来自同一家族的字体被设计成可以一起使用,是灵活且一致的。
在选择字体时,优先选择具有各种权重的字体,如细体,标准体,中粗体,加粗体,超粗体,宽体,扩展体和斜体。这将给你更多的发挥空间,而不需要添加额外的字体。
三、UI设计原则背后的认知心理学
了解人的感官和大脑是如何工作的,去衡量及判断那些设计原则更靠谱;UI设计师需要确定哪个设计原则更适用于给定的环境,从而优选应用,UI设计师必须深思熟虑,而不是盲目的应用设计原则,应该理解其基本原则并有过应用经验的人来使用和诠释;
所有设计原则其实都是基于人类心理学,从认知和心理学角度剖析交互设计本质,去解读人们如何感知、学习、推理、记忆,以及把想法转换为行动。将实际的设计原则联系起来会让心理学变得更具体、更容易理解。
此篇是给自己解惑的文章,也是一篇学习笔记总结;也让自己知道就算背熟了著名的交互原则后仍做不好设计,究竟是因为什么?现实中,很多设计原则,有一致的场景却又有互相冲突的场景,到底该怎么推断那些设计准则更靠谱?
我们的感知与现实存在一定的偏差
不要怀疑,就是我们所看到的并不是真相,我们的大脑在影响我们的感知;很大程度上是我们“期望”感知到的。感知至少受到以下3个因素影响,与现实存在偏差
1、过去:先入为主的经验影响我们的感知
人常根据以往的经验来对事物进行理解和判断;先入为主的经验会给用户不一样的感知和理解;你看到什么取决于经验/别人告诉你什么?
R.C.James的素描:给人的第一印象是随手泼出的黑点,如果有人和你说这是一只在树附近嗅着地面的斑点狗后,你就很难再把这张素描看成是随手泼出的黑点了;看过刘亦菲演的神雕侠侣小龙女后,后面再有(陈妍希、毛晓慧)翻拍都觉得没有比刘亦菲更适合小龙女这个角色,而且还被黑的很惨;这都是因为人会被先入为主的经验影响感知
我们认知会受熟悉的感知框架影响;
我们生活中大部分时间都是在自己熟悉的环境中度过(比如:家、公司、去公司的路上、附近的商场),久而久之这些熟悉的环境会在我们心智中建立框架;比如,你并不需要经常检查你家里的东西,但你对家里够熟悉,也就知道某些东西大概放在哪里,因为你已经建立了你对自己家的认知,有点刻板印象那么回事,专家们都管这个叫“感知模式/感知框架”
感知框架能帮助我们应付所处的世界,但是呢也会让我们看到并不存在的东西;比如,有时候你觉得你身份证明明放在家里某个地方,你就是找半天没找到;还有你去饭店吃饭,去饭店吃饭的心智框架里有部分是付款,可能你没有付款走出来饭店,但你的潜意识以为自己已经付款过了,查看账单才发现真没付!!!!
不同场合的心智框架影响我们在不同场合下对期待见到的事物感知;使用电脑、网站及手机的人对桌面和文件、网页浏览器、网站和各种类型的APP都会有相对应的心智框架;用户经常不认真看屏幕就点击按钮或链接,他们更多是靠以往的经验来引导他们对界面的感知,没错就是在盲点瞎点!!!能不动脑就不会动脑那种,所以知道这个原理我们可以更好的了解那些设计原则
所以这页就是为什么UI设计原则中需要保持一致性,一致性也包括3个方面:
1.和用户预期保持一致性。
如果不符合人熟悉的心智模型及框架,就很容易很抓狂;经常炒股的朋友,会对红色绿色很敏感,绿色代表下跌红色代表涨,但其实北美的股票市场则反之,红色代表下跌;很多用惯安卓的用户,突然用iOS会很不习惯,最明显的微信APP的iOS版本和安卓版本就有很多不一样的地方;用习惯win的系统用户新买了个macbook电脑,刚用的时候很奔溃,时时刻刻都感觉自己是个智障~
app中就有很多案例契合用户心智模型,减轻用户的学习成本和记忆负担
QQ阅读的电子书还是保留了翻页效果都是模拟现实翻书的效果,这样大大降低用户理解左右滑控制翻书上下页的理解成本。微信红包设计形式就很像现实中的红包,所以很多人也一下子就理解这是红包,而且点开就是拆红包了。网易云音乐也是做成黑胶唱片的即视感,播放暂停都会相应变化,营造了听歌的氛围。
微信朋友圈广告的样式也是符合用户心智模型,呈现形式与好友发的朋友圈保持一致。以明星作为好友,插入大图,底部还可以看到好友的评论和互动,这样给人的感觉就像好友发了一个状态,而非一条赤裸裸的广告。
还有在支付宝好友对话页面转账的场景中,用户有着不同的使用习惯,他们认为来这里就是转账的,所以有的用户进入对话框后,输入完数字,就认为自己已经转账成功了,其实并没有,于是有了现在改版后的方案;bilili在输入密码的时候2个小人会捂住眼睛,像极了现实中别人输入密码自己会走开不偷看。
2. 和平台规则保持一致性
产品的设计要和平台的规范保持一致,比如ios、Android及网站规范;也需要与竞品保持一致比如同类型的app也会大同小异;
3. 产品内部规范一致性。
其中包括迭代版本保持一致性,同一层级图标颜色字体保持一致性,品牌一致性,交互行为一致性;不同的品牌有自己的调性,可以直接通过设计语言传达给用户,而且能够达到一个良好的品牌辨识度,成熟的产品有自己的设计标准。
4. 遵循用户的操作习惯;
有时候在找某件东西的时候,如果它不在老地方或者看起来和以前不一样,就算在我们眼前,我们也找半天,这也是因为我们受以往的经验影响感知;因此相同或相似产品的用户习惯保持一致,即意味着用户需要更少的时间去学习甚至不需要学习;
微信的iOS和安卓版本不一致,是根据2个终端不一样的交互习惯操作;比如微信2各版本的搜索位置不一致,安卓在右上角,iOS是一长条;发现页iOS是没有搜索和添加的,安卓却有;在iOS系统中,想要删除一条信息只需要向左轻轻一划,而在安卓系统中,需要长按信息在弹出的选项中选择删除选项,然后再按确认删除的选项;安卓左右划可以切换4个tab但iOS却不行,安卓和iOS二级页面的返回键也是不一致,安卓底部有返回操作,iOS则是右滑返回上一级。
2、当前:环境影响感知
周围环境对感知的影响也同样存在于不同感官之间。五个感官任何之一的感知都可能同时影响其他感官的感知。例如:我们听到的能影响我们看到的,反之亦然;我们听到、看到或者闻到的能影响我们的触觉。
总之,对于识别一个字母、一个单词、一张脸或者任何物体的神经活动,都包含了环境刺激产生的神经信号的输入。这个环境包括感知到的其他临近对象和事件,甚至由环境激活的对以往感知到的对象和事件的记忆。
人们经常根据周围的情景去理解事物,视觉感知也是一样的,上下文会影响我们对某一个词的理解;环境有时候会产生歧义。同样的一段话放在不同的语句当中,会有不同的理解。视觉上也是如此:
视觉设计可以通过应用的背景、界面元素的摆放等来烘托情感、主题和气质。比如天猫、京东及拼多多618这种节日活动主场景,也是利用了这种心理将买买买的活动氛围营造出来。
3、将来:目标影响感知
除了视觉,我们的目标还过滤其他感官的感知。
例如:在嘈杂的环境中与人交谈,你能把大部分注意力放在他说的话上,即使身边还有许多人在对话。你对谈话的兴趣越大就越能过滤掉周围的声音。
当用户登录网站执行操作时通常都是带有目的性的去操作,这个过程中会过滤与其达成目标操作无关的东西,当用户在软件或网站上寻找信息或某个功能时,他们并不会认真的阅读,只是快速而粗略的扫描屏幕上与目标相关的东西。他们不是不仅仅忽略掉与目标无关的东西,而是经常不注意它们。
目标影响我们注意什么--感知是主动的,我们动用五官去找到和目标相关的东西。目标使我们的感知系统对某些特性敏感--例如在下图找红色的圆点,大脑对红色就会特别敏感,而其它颜色就几乎不会被注意到,即使我们的确“看到”了它们
目标对感知的过滤在成年人身上特别可靠,他们比儿童对目标更专注。儿童更容易被刺激驱使,目标较少地过滤他们的感知。这种特点使得他们比成年人更容易分心,但也使得他们观察时更不容易被影响。
当用户充分的调动感知来寻找目标的时候,由于用户的注意力处于一种高度的紧张状态,这是一种不好的用户体验,我们要做的是让用户能够轻松的完成目标任务,而不需要有高度的紧张和寻找。
比如淘宝在注册账号的时候,清晰告知用户注册整体流程状态
由于用户在完成某项操作的时候,非常容易忽略和目标任务无关的信息,所以如果需要在用户处理任务的过程中,使用户注意到一些额外的重要信息的话,应该将这些信息做的醒目或者将它们摆放到适当的位置,比如:Behace在用户创建密码时,会贴心在下面把已满足密码项☑️,避免不满足密码要求又被打回
总结:最后对设计有什么影响?
避免歧义
避免显示有歧义的信息,并通过测试确认所有用户对信息的理解是一致的。当无法消除歧义时,要么依靠设计标准或用户习惯,要么告知用户用你期望的方式去理解歧义之处。
保持一致
在一致的位置摆放信息和控件。不同页面上提供的相同功能的控件和数据显示应该摆放在每一页上相同的位置,而且它们还应该有相同的颜色、字体和阴影等。这样的一致性能让用户很快找到和识别它们。一致性的交互设计原则对用户而言可以让信息传达和用户使用体验更好;对产品研发团队来说,也会减少设计的研发成本
理解目标
理解用户目标,知道它们强烈的要感知什么,从而确保提供必要的信息清晰的对应用户的感知,用户去用一个系统是有目标的。设计者应该了解这些目标,要认识到不同用户的目标可能不同,而且他们的目标强烈左右他们能感知到什么。在一次交互的每个点,确保提供了用户需要的信息,并非常清晰地对应到一个可能的用户目标,使用户能够注意到并使用这些信息。
四、什么是ui设计?包括哪些方面
UI 设计(或称界面设计)是指对软件的人机交互、操作逻辑、界面美观的整体设计,也叫界面设计。UI 设计分为实体 UI 和虚拟UI,互联网说的 UI 设计是虚拟 UI, UI 即User Interface(用户界面)的简称。
UI 设计师的职能大体包括三方面:一是图形设计,软件产品的产品“外形”设计。二是交互设计,主要在于设计软件的操作流程、树状结构、操作规范等。三是用户测试/研究,这里所谓的“测试”,其目标恰在于测试交互设计的合理性及图形设计的美观性,主要通过以目标用户问卷的形式衡量 UI 设计的合理性。
UI设计目前的前景还是很不错的,很多企业都缺少 UI设计师。而且可以看到的是,现在社会的发展,更多的智能机和智能机器人研发出现,这些都离不开UI 设计师。所以说 UI 设计的是很有前途的,是不会失业的。而且 UI 设计门槛不高,要入门也不难的。
从工作内容来说,UI 设计在当前的互联网领域、科技领域可以说无处不在,
好的 UI 设计能够明显提升用户的使用体验,从而给产品带来更多的附加值,所以UI 设计对于互联网产品是非常重要的。目前 UT 设计通常分为两个大的工作方向,一个是交互设计,另一个是视觉设计。
总的来说,UI 设计相比较于编程而言,还是非常适合大众学的并且就业前景很广阔。学完 UI 设计,能获得一份稳定而又不失乐趣的工作,同时有利于追求更高品质的生活,在艺术领域可以获得更多的启迪。
以上就是关于软件ui设计原则相关问题的回答。希望能帮到你,如有更多相关问题,您也可以联系我们的客服进行咨询,客服也会为您讲解更多精彩的知识和内容。
推荐阅读: