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

相关推荐

  • 用户体验地图

    利用用户体验地图实现产品的情感化设计;先来看一张图:我们可以将用户体验地图分为三个区域,其中:# ZONE A 提供了对地图的界定;# ZONE B 是视觉化的用户体验过程;# ZONE C 描述了用户的痛点;我们通过拆分各个区来实现一个用户体验地图的构建;A区:1 : 表示一个角色,即体验的用户是谁,或者说你的产品的目标客户群体是什么样类型的人;2 :表示待调研的场景,即在用户什么情景下会使用你的产品;B区:3 :可分段的体验过程,即...

    2018-03-28
  • Magic Sketch——寓教于乐的哄娃神器

    棒妈说这是一款哄娃神器。坐飞机火车时,需要娃瞬间安静时,这款神器简直好用到飙泪。这是一款玩具,也是一款画画工具。寓教于乐,大概说的就是这款过年可以代替压岁钱的神器。(请于微店购买)面对市场上琳琅满目的玩具很多宝妈宝爸表示挑花了眼、剁断了手还是没有买到让宝宝满意的到底应该选择什么玩具,才符合宝宝的成长需求?小汽车呀,变形金刚、芭比娃娃,还是...现在还在买这些玩具?你OUT了!孩子开心固然重要,但也别错过宝宝早期智力开发的黄金阶段!寓教于...

    2018-04-12
  • CTB50成员周红军| 从互联网用户体验谈交易银行创新发展思路

    诚邀各领域专家学者、从业者及机构投稿或荐稿与30余万行业精英分享与共同发展投/荐稿邮箱:tougao@sinotf.com中国交易银行50人论坛:客户在使用交易银行服务过程中所关注的用户体验,是竞争激烈的交易银行服务能否在市场上取得优势地位的决定性因素。文/安邦保险集团国际部总经理、中国交易银行50人论坛(CTB50)成员 周红军来源:中国交易银行50人论坛 学术成果汇编(2017)当下,随着互联网技术的迅猛发展,各行各业已经融入到“互...

    2018-03-31
  • 场景是如何应用到交互设计的?

    我想在互联网领域,大家对“场景”这个概念并不陌生,但组成场景的关键因素有哪些?场景是如何应用到交互设计的?在工作之余,整理下相关知识,相信对大家的产品日常工作有一定的帮助,感谢大家抽出时间阅读,欢迎批评指正。1.场景的基本概念场景是指用户在一定的时间、地点等特定的情景下为了满足某种需求而触发的使用某种方法解决需求的行动画面。其关键因素包括用户、情景、需求、方法。产品的应用场景就是用户使用产品来解决需求的实际应用场景,比如上班族小张在午餐...

    2018-03-02
  • 设计和记录用户体验的细节

    设计和记录用户体验的细节体验设计是产品开发过程中一个复杂、多用途、耗时的阶段。组织良好的流程通过减少误解使结果可预测来减轻团队压力,在本文中,我希望着重将主流方法映射到实际项目中,并且将可交付的成果归总在一起。阶段1: 构想这个阶段的目标是弄清楚客户的业务如何运作以及产品目标是什么。低保真原型是一种工具,它可以帮助你与利益相关方确认产品的心智模型,并讨论设计方法,在这一点上,我们正在寻找一个关于“我们正在建设什么东西?”问题的答案。附注...

    2018-03-31
  • 设计×交互 | 在做交互的时候,我们可以从不好的设计与好的设计中学到什么?

    让人人都懂点儿设计设计史论全文字数 :4689 | 阅读 时长:12分钟今天史论君为大家分享一篇来自interaction design foundation的文章原文作者:TEO SLANG    |    翻译:于于于Jessica编辑:Sujay Wu转载后台回复 :史论君把不好的设计和好的设计的反面例子一起看,不仅有趣,而且为设计师们提供了重要的经验教训。它们突出了设计人员要避免的陷阱,并让我们理解如何将设计理论转化为在现实世界...

    2018-04-07
  • Fitbit:一份用户体验案例研究

    当谈论到锻炼时,这个世界上有三类人:每时每刻都在健身的健康达人;那些一天中全部锻炼内容就是从前门走到车里,每天在沙发看电视的人们;在这两者之间,想变的健康强壮但缺少一些动力去健身房的人(又称在屁股上踢一脚才行动的人)。 我,和我知道的大多数人一样,都是第三种类型的人。我们被称为是

    微信热点 2018-03-31
  • SKETCH Hong Kong 2016 作品展

    SKETCH Hong Kong将于2016年7月1至10日在太古广场2层(Kelly & Walsh书店附近)、及7月15至30日在3812画廊(香港西营盘皇后大道西118号地下)举办SKETCH Hong Kong 2016作品展,展览由Miele全力支持,展出超过50件出自本地业余速写画家手笔速写作品。李唯芳  湾仔4色  钢笔铅笔水彩纸本参加者运用多样的绘画工具,从多角度描绘了香港著名的历史性地标,记录了香港独特的文化生活方式。...

    2018-04-16
  • 2017新零售用户体验观察

    互动新零售专为互联网人打造的新零售智库。关注过去的2017年被誉为“新零售元年”,从早前颜艳春的《第三次零售革命》到阿里的“五新”战略,再到京东的“新零售革命”等等,一系列关于“新零售”的概念被正式提出。而行动上,无论是互联网电商巨头,还是传统线下零售企业均在紧锣密鼓地展开此次零售变革的布局。此次“新零售”变革概念从中国提出之时,从全球范围来看,和传统零售形态不太一样的商业形态和消费者体验已经在世界各地慢慢的生长起来。这一年中各式各样关...

    2018-02-08
  • 重版权轻用户体验 盲目IPO的腾讯音乐或成下一个多米

    最近,音乐版权又起风云,各大新闻版面被网易云音乐因版权续约未果,下架周杰伦作品的信息霸占,这场由杰威尔音乐独家版权方腾讯音乐主导的“版权狙击战”再次成为行业焦点。众所周知,自在线音乐兴起至今,腾讯与网易云音乐、虾米音乐等音乐平台之间在版权上的纷争已经历了多个回合。但是,距离国家版权局宣布推动腾讯音乐和网易云音乐达成版权合作还不到两个月,在线音乐市场版权之争就因腾讯再起硝烟,令人诧异之余不免有些心寒。所以,腾讯音乐“阳奉阴违”背后,到底有...

    2018-04-08