12个关于用户体验的界面设计细节

点击上方"工信商务培训学校"↑文章列举了一些界面设计中的案例细节,希望对产品设计工作有所帮助。UI设计工作中,设计师们往往不喜欢将界面设计得与原型图一致,总会刻意的去寻求存在感与原型做出差别,那么对于UI设计师来说,更应该懂得用户体验,成为办个用户体验设计师。以下列举了一些界面设计中的案例细节,希望对设计师们有所帮助。一.图标1.统一图标的样式图标在界面设计中还是占着较大的比重,它的存在有利于平衡界面,也让页面看起来更加的美观,也有一定...

12个关于用户体验的界面设计细节 点击上方"工信商务培训学校"


  文章列举了一些界面设计中的案例细节,希望对产品设计工作有所帮助。

  

12个关于用户体验的界面设计细节

 

  UI设计工作中,设计师们往往不喜欢将界面设计得与原型图一致,总会刻意的去寻求存在感与原型做出差别,那么对于UI设计师来说,更应该懂得用户体验,成为办个用户体验设计师。

  以下列举了一些界面设计中的案例细节,希望对设计师们有所帮助。

  一.图标

  1.统一图标的样式

  

12个关于用户体验的界面设计细节

 

  图标在界面设计中还是占着较大的比重,它的存在有利于平衡界面,也让页面看起来更加的美观,也有一定的提示作用。图标风格有:线性图标、填充图标、面型图标、扁平图标、手绘风格图标和拟物图标等。

  在决定使用某一风格的图标设计之后,在相同木块下,请尽量使用同一的风格的图标,如填充图标的色彩饱和度;线性图标的线条粗细;拟物风格的光线阴影等。

  2.意义明确的图标

  

12个关于用户体验的界面设计细节

 

  很多人都喜欢纯图标式的设计,去掉文案试图让图标看起来更高大上,但是往往忽略了图标最重要的作用是提示用户该按钮的功能。如上图所示,去掉文案之后很多图标根本无法准确表达出确切的含义,这也是图形的缺陷。

  做好图标和文字的排版与比例一样可以设计出好看的界面。

  3.图标的视觉平衡

  

12个关于用户体验的界面设计细节

 

  同一个界面出现多个图标时,我们需要保持整体的视觉平衡。并非是所有图标都采用相同的尺寸就能达到平衡,由于图标的体量不同,相同尺寸下不同体量的图标视觉平衡也不相同,例如相同尺寸的正方形会比圆形显得大。因此,我们需要根据图标的体量对其大小做出相应的调整。

  4.符合用户心理的图标(按钮)

  

12个关于用户体验的界面设计细节

 

  图标在大多数情况下都是充当着按钮的作用。设计时必须要清晰准确的传达出当前状态,不能为了视觉效果而带给用户错误的判断,例如深灰色的按钮用户会理解为是禁用状态而放弃点击。

  通过图标(按钮)的颜色、大小、风格等来引导用户进行操作,需要强化的就要做得突出,不要整个界面都处于主次不明的状态,分散用户的注意力,削弱了界面需要传达的主旨。

  二.布局

  1.合理的模块区分

  

12个关于用户体验的界面设计细节

 

  界面设计中不乏内容信息很多,需要折叠的情况。因此经常存在信息的层级关系,而这时就需要利用不同的颜色对各个模块进行区分,利用同色系不同明度来体现这样的层级关系。这样也让用户更容易理解当前所处的模块。也让页面看起来更丰满些。

  2.正确的文字层级关系

  

12个关于用户体验的界面设计细节

 

  工作中我们拿到的需求总会出现大篇幅的文案,不能像概念设计那样任性的删减,在进行文字排版的时候,正确的处理信息之间的层级关系将会提高用户对信息的识别度。我们通常会通过字体大小、颜色、留白、层级分割等技巧来处理,把相同属性的信息归类设计,通过留白的不同达到层级的区分,让整个信息排列主次分明,层级清晰。

  3.合理的内容归纳

  

12个关于用户体验的界面设计细节

 

  应该善用色块和分割线对页面的内容进行合理的归纳和整理。线条通常用于分割同一类别或拥有相同属性的元素;而色块更多的是用于分割不同类别或者区分不同属性的元 素,以达到层次清晰,归类明确的目的。但是所有的一切都应该服务于信息的准确表达,切忌不可为了视觉上的协调而强行的合并或折叠。

  4.预估内容承载范围

  

12个关于用户体验的界面设计细节

 

  新人总是会忘记规范信息呈现的边界宽度。程序在开发的时候总会问,你这个超过长度之后如何显示。有一些程序更是直接用右图的”…”显示。但是在这样的情况下,作为地址这样的简单信息的展示,还需要用户去点击一次才能看见全部地址,明显是不合理的交互。因此我们在设计界面应该要考虑到超过展示边界的时候该如何展示,如何取舍。

  5.尊重App用户的使用习惯

  

12个关于用户体验的界面设计细节

 

  许多App的设计师都是由网页设计师转行而来的,但是App界面有其特殊性。它界面小,过小的按钮无法像鼠标一样能够精确点击。因为有一些网页的设计习惯不应该带到App的设计中来,这也是交互设计师在App的设计过程中需要去把关和注意的。

  三.设计元素

  1.颜色

  

12个关于用户体验的界面设计细节

 

  页面信息总是各有权重。在选用配色方案的时候,在界面中最好不要使用3个以上的颜色。最好能以一个主色+两个辅色最佳。颜色太多会让用户模糊界面的焦点。无法聚焦在我们想让用户聚焦的信息上。

  2.透明度与投影

  

12个关于用户体验的界面设计细节

 

  通过对按钮、卡片等进行投影运用可以增强立体感与层次感。

  给予用户该卡片能够切换,且当前展示的信息为该卡片的详情的交互暗示。虽然不加投影和阴影也能达到这个效果,但是效果会弱不少。

  3.表单

  

12个关于用户体验的界面设计细节

 

  表单设计在界面中随处可见,看到一望无际的表单用户总是望而却步。为了缓解用户的这种心理活动,我们设计的时候通常会通过合并归纳相同属性的表单,采用逐步填写来让用户感觉内容很少,通过这样的视错觉让用户完成表单的填写。

  4.缺省页

  

12个关于用户体验的界面设计细节

 

  作为用户当遇到页面内容为空的时候本身就是一件比较沮丧的事情。因为应该加入一些情感化的设计。在空界面的一些设计中也由以前的纯文字转变为一些应景的插画表现,带给用户更多的愉悦感。

声明:该文章版权归原作者所有,如涉及作品内容及版权问题,请及时联系我们删除。

12个关于用户体验的界面设计细节

12个关于用户体验的界面设计细节

济宁市工信商务职业培训学校属于山东著名的山东中煤工矿物资集团有限公司,始建于2001年。中煤集团是工信部电子商务示范企业、中国电子商务企业信用等级AAA级信用企业、中国互联网企业信用等级AAA信用企业、山东省电子商务认定企业、山东省电子商务示范企业、山东省电子商务示范园区、济宁市电子商务协会会长单位、济宁市首批科技型“小巨人”企业、济宁市高校毕业生就业见习基地等


12个关于用户体验的界面设计细节


·网络营销推广

·新媒体营销

·电子商务

·网络营销文案与策划

·网络营销项目实训与就业指导

·SEM搜索引

联系我们

电话:400-068-0537
地址:山东省济宁市高新区开源路北11号
官网:www.gongxinsw.com
邮箱:zhongmeigk@163.com

12个关于用户体验的界面设计细节

原创文章,作者:交互精选,如若转载,请注明出处:https://www.iamue.com/36262/

(0)
交互精选交互精选
上一篇 2018-04-05
下一篇 2018-04-06

相关推荐

  • 交互设计在商业中的价值

    转载自“创设空间”:chuangshe_space简书链接:http://www.jianshu.com/p/d0b5baa600d2作者:Mr汤进er一、前话问题:一句话概括你理解的交互设计是什么?部分回复摘录:@哎呀,我擦~:大概就是通过使用者的某些动作才能激发出的产品或包装的第二功能吧。@捉急的小慢~~O~~:界面设计,形式和功能相融而令人愉悦的互动。@lcy:信息的输入,输出的过程。从大家对于这个问题的回复,不难看出,不同人对于...

    2018-03-05
  • 关于用户体验&交互设计的视频分享【日常思考0001】

    (。・∀・)ノ゙嗨这里是Chiki的深夜抽风小记录,做个日常思(bing)考(zheng)收集。公众号取名“Design for What"是希望以后自己做设计的时候可以多思考设计是为什么Find your passion,and let it kill you那么开始今天的开场首秀!今晚本想磕磕榛子垫垫肚子就……就开始做事来着,结果不小心打开平板……看了会视频(明明是好久……都是借口😭)不过视频不错分享给大家👇视频在这:截了有点不一样...

    2018-04-14
  • 优逸客【交互设计】直播课今晚8:00正式开播!

    提起交互设计,它既没有界面视觉设计绚丽,也没有用户体验设计有趣,看起来枯燥乏味,学起来复杂难懂,但它却是整个产品流程中最核心的部分之一。一个牛X的交互设计师是睥睨天下的,无论薪资还是技术。(以上海地区为例)但在通往牛X的路上……很多人还没开始就放弃了经常会有人说交互设计好像已经趋于饱和,现在从事这个行业没机会了。照这么说,公务员是我见过的饱和度最高的行业了,但每年还是有那么多人争得头破血流要为人民服务。就像金字塔一样,往往最底层的那一部...

    2018-04-19
  • iPhone X 交互设计官方指南

    编译|覃云北京时间 9 月 13 日凌晨,苹果发布了带刘海的 iPhone X,这个屏幕需要 iOS 开发者做新的适配,会后苹果发布了 iPhone X 的适配指南,我们将它翻译出来供大家参考。本文首发于 InfoQ 垂直号移动开发前线,ID:bornmobileiPhone XiPhone X 拥有一个宽大的、高分辨率、圆角的、扩展到边缘的屏幕,提供了以前从未有过的沉浸式、内容丰富的体验。屏幕尺寸在纵向方向上,iPhone X 显示屏...

    2018-01-31
  • Excel表格常用快捷键大全之1-10个

    为了小伙伴能更懂Excel 快捷键的具体使用场景,小雅不是单纯的像网上看到的一堆快捷键堆上去就好,做了更详尽的解释,希望大家能喜欢!收藏一下,记住些Excel常用快捷键还是不错的!善用快捷键,新手到高手的蜕变!不废话,进入正题,本篇是1-10个快捷键,后续会陆续为大家呈现更多的Excel快捷键。第一,插入工作表默认情况下,我们新建一个Excel文档,只有3个工作表。3个sheet,即sheet1,sheet2,sheet3。如果这三个s...

    2018-03-17
  • 用交互体验方式感受人类智慧结晶

    2017年9月26日,中国科技馆“华夏之光”展厅经过为时半年的更新改造后,将面向公众进行试运行,并于10月1日正式重新开放。“华夏之光”展厅位于中国科技馆主展厅一层,设有“中国古代的技术创新”、“中国古代的科学探索”、“华夏科技与世界文明的交流”三大主题分区,围绕不同主题,讲述中华民族在生存发展过程中不断创造与发明、探索与发现、交流与融合的科技故事。此次封厅改造是在原有展览的基础上进行的局部性升级换代。“华夏之光”展厅维持原有展览框架,...

    2018-01-30
  • 动起来才好玩——创意交互设计景观

    设计是靠亮点征服人,吸引眼球,大部分方案构思雷同,建成后风格水平都差不多,如何让场地更加吸引人而脱颖而出,这就需要在新、奇上下功夫。电子梦幻天幕世贸天阶最著名的“全北京向上看”的“超豪华LED天幕”,这座天幕将为整条商业街带来富于梦幻色彩和时尚品位的声光组合,成为一座吸引人潮的世界级奇观。建成之后,人们在这里可以欣赏缤纷悦目的日夜景观,感受现代科技带来的富于梦幻色彩和时尚品位的声光艺术。而且游客可以把想说的话发送短信到平台号码,天幕上就...

    2018-02-03
  • 《用户体验要素》读书笔记:要理解为何这样做产品

    《用户体验要素》是一本实用类书,试图回答如何以用户体验为中心进行产品设计。作者通过构建自下而上的五层模型:战略层,范围层,结构层,框架层,表现层;来将以用户体验用户需求为中心的设计方式层次清晰的表达出来。并指出;一开始对战略层的深思熟虑,会帮助我们在整个产品设计中节约大量的时间。作者这本书写于pc时代,大多案例都是网站的建设。但是整个思考产品的思路,直到今天;都没有过时。一、 以用户体验为中心设计产品用户体验是指产品如何与外界发生接触,...

    2018-04-08
  • Axure用的溜,并不代表你就能成为一个产品经理

    作者:杨俊全文共 2497 字,阅读需要 5 分钟—— BEGIN ——当你在人人都是产品经理上搜索“Axure”时,会有98页的结果。在知乎以及其它一些产品经理相关的网站上,也总是能够看到诸多Axure的使用问题和经验分享。但是,作为一个产品经理确实是需要会使用Axure的,但你使用Axure并不代表你就能成为一个产品经理。用户体验五要素在《用户体验的要素》中提到的五要素,自上而下分别是:战略层、范围层、结构层、框架层和表现层。当你能...

    2018-03-04
  • 随想:智能车人机交互设计三要素

    BYTON拜腾标志性的共享体验屏和触摸式方向盘近期会总结下自己对智能车、自动驾驶人机交互相关的思考,很碎片,想到哪总结到哪。今天先写智能车相关的内容。这里的智能车先缩小范围到还需要人类驾驶员的智能网联汽车。1、总结之前,有个疑问。我很想知道各大车企在研发测试智能车的时候,是否有认真、大量地拿真实用户、真实场景,而非实验室场景去测试其诸如中控大屏这样的智能产品/功能?在我的印象里,或许车企更多的测试依旧在传统意义上汽车这一交通工具的性能、...

    2018-04-22