交互设计笔记整理

PC与手机对比使用环境pc:固定位置,干扰少,注意力集中,输入方式强大。手机:任何地方,干扰多,注意力难集中,输入方式单一。交互媒介pc:操作精准快速,桌面大显示内容多,过大屏幕会有视觉盲点。手机:手指操作,精准度低、速度慢。使用特点pc:需处理复杂任务,多任务切换,讲究效率和强互动,没有电池流量问题。手机:适合处理简单任务,多任务切换困难,适合各种姿势使用,电池流量问题严重。web与APP界面对比web是书架,内容繁多,一目了然。更直...

PC与手机对比

  1. 使用环境

    pc:固定位置,干扰少,注意力集中,输入方式强大。

    手机:任何地方,干扰多,注意力难集中,输入方式单一。

  2. 交互媒介

    pc:操作精准快速,桌面大显示内容多,过大屏幕会有视觉盲点。

    手机:手指操作,精准度低、速度慢。

  3. 使用特点

    pc:需处理复杂任务,多任务切换,讲究效率和强互动,没有电池流量问题。

    手机:适合处理简单任务,多任务切换困难,适合各种姿势使用,电池流量问题严重。


web与APP界面对比

  • web是书架,内容繁多,一目了然。更直观,跳转少,分类更清晰。

  • APP是抽屉,内容需要有条理的分门别类摆放。信息隐藏深,跳转多,逻辑性强。


APP界面布局

  • 沉浸式:如膜拜单车,导航隐藏,首页内容浏览为主,切换放到下一级别中。

  • tab式:如微信,左右滑动浏览多个模块,适用于多个模块重要程度相同时。一个tab可能有子集,可以更多的分类过滤内容。

  • 大数据式:如UC浏览器,一堆导航的罗列,容量大,大部分行为是寻找入口,特点是可以无限扩充。


web界面布局

  • 展示类:信息少,展示空间大,大图片,布局灵活,艺术感自由度高,结构简单随意。

  • 电子商务类:

    (1)平台类,信息大,布局规则,展示空间有限,逻辑严谨复杂,导航清晰、更多跳转。(如天猫)

    (2)垂直电商,信息相对单一,导航简单,图片展示空间大,视觉效果好。(如苹果官网)

  • 门户类:信息量极大,导航 众多,布局规则,展示空间有限,屏幕黄金位置被导航占据,多跳转。(如腾讯网首页)

  • 博客类:信息量大,导航简单,跳转少,内容为王,视觉干扰少,符合人的阅读习惯。(如知乎)

  • 工具类:功能性强,目的明确,视觉集中。(百度)


信息架构基本原则

  • 一致性原则:结构一致性、色彩一致性、操作一致性、反馈一致性、文字一致性。

  • 对软件的控制:加载等待时间不能太长,对用户的动作及时作出反馈,预防出错(如输入校验),对用户的误操作可以撤销。

  • 软件的服务性:干扰(如突然的弹框),体贴(如输入提示),有时选择本身也是一种干扰,它会让用户思考。

  • 误操作:过多的误操作基本判定了产品的失败,预防误操作通常有几个原则。

    (1)删除不要和常用的东西放一起。

    (2)一个新的状态引入可能干扰其他设计,从而形成误操作。

    (3)防止误操作,要么给它合理的摆放,要么给它单独的使用状态。

  • 入口与出口:

    (1)点击这个按钮要知道去哪里。

    (2)点击这个按钮知道可以回到哪里。

    (3)进入这个界面后,知道自己在哪里。

    (4)进入一个界面,发现下一个要去的界面就在旁边。

    (5)有一个固定的办法能让用户返回。

  • 法则三定律:

    (1)给用户的入口选择越少,他犯错的记录越少。

    (2)不要试图给用户更多的选择,选择权交给用户往往让他们更迷茫。

    (3)不要觉得对入口的引导很有效,用户往往看不到他们。


信息架构的特性

  • 二八法则:你设计的100个功能,只有20个会经常被用到。

  • 费茨定律:操作的按钮越小,需要点击时话费的成本(精力)越大。所以被点击越频繁的按钮可以考虑设计的越大一些。

  • 格式塔原则:格式塔心理学,人对图形自发性的心理活动。在形式、颜色、距离上进行自发的关系构建。所以同类的ico应该更靠近,这样用户可以自动把它们归为一类。

  • 剃刀原理:用户选择越多,做选择的时机越长。所以尽量少的选择,简单的界面更吸引用户。

  • 精简界面:

    1、只放置必要的东西

    2、减少点击次数

    3、减少段落个数

    4、给予更少的选项

  • 7分钟阅读:注意力在7分钟后开始减弱。

  • 视觉流:

    1、图片和鲜亮的颜色都能吸引用户的视觉,应谨慎使用。

    2、没什么比动画更能吸引眼球,没什么比低劣的动画更能毁灭体验。

减少负荷与交互设计

  • 认知负荷:对产品熟悉、使用需要付出的思考。

    操作负荷:操作的难易程度。

    视觉负荷:界面的简洁程度。

  • 负荷越低,用户的内心期望值越低,进而体验越高。

    负荷越高,用户的内心期望值越高,进而体验越低。

  • 用户宁可付出更多的努力也不喜欢更多的思考。

    必要时增加视觉负荷或者动作负荷,减少认知负荷。

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

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

相关推荐

  • 华景招聘用户体验分析师啦!

    作为华景员工,除了能体验旅游之外,还能体验华景食堂的凉皮儿和拉面,包子和油条,腊牛肉和酱猪肘,狮子头和卤肉饭,肉夹馍和艇仔粥,老婆饼和豆沙酥,酸辣汤和叉烧饭,泰式河粉和肉酱意面,干煸四季豆和蒜蓉蒸茄子……华景集团招聘1. 用户体验部    用户体验分析师岗位职责:*负责产品的用户研究,分析用户的使用习惯、情感和体验需求*负责原型/产品用户体验评估工作,参与产品的交互界面的设计,分析影响产品用户体验的因素*定期开展用户测试,观察用户使用产...

    2018-05-04
  • 学而思网校UED部门招聘

    简介INTRODUCTION学而思网校,纽交所上市公司好未来集团旗下品牌,专为3-18岁孩子提供小初高全学科课外教学。UED负责K12在线教育全业务体验闭环的设计工作,我们的团队活力创新、勇往无前,真诚期待你的加入~UI设计师UI DESIGNERS岗位职责负责网校全平台产品体验设计工作;可以主导设计风格,参与设计规范和流程的制定。岗位要求3-5年视觉设计经验,美术、设计、艺术学等专业,本科及以上学历;有移动客户端设计经验更佳;熟悉用户...

    2018-02-16
  • Axure RP入门第七篇——中继器来实现聊天室效果

    产品经理入门:Axure RP入门第七篇——中继器来实现聊天室效果

    2018-03-24
  • 用户体验再度升级,共享租车现里程碑式进步

    近日,国内共享租车领导品牌凹凸租车发布最新APP 4.0版本,该版本通过优化匹配算法和系统功能,在业内首度实现共享租车平台零拒单,免除了用户交易后租不到车的后顾之忧。同时,新版凹凸租车上线了“精选优车”频道,全面提升用户的租车体验。零拒单,用户所租即所得在共享租车行业,用户租车后遭遇车主临时拒单或取消的现象成为一大痛点。在凹凸租车4.0新版本中,平台通过车源端优化、车辆接单标准化、智能推荐匹配算法和系统功能升级,实现了工作时段的无拒单、...

    2018-02-01
  • 解析「交互设计七大定律」在设计中的应用(上篇)

    交互设计之父阿兰·库珀说过这样一句话:“除非有更好的选择,否则就遵从标准”;在交互设计领域中,有很多被时间和前人验证过的设计法则,这些法则是从用户的行为逻辑中总结出来的,掌握这些法则能让我们迅速有效的完成自己的设计,接下来,笔者通过一些实例来解析下这些原则在设计中的应用~由于文章有点长,影响阅读体验,本文将分为上下两篇来发~一费茨定律(Fitts’ Law)1、费茨定律(Fitts’ Law)简介费茨定律是由保罗·费茨(Paul M. ...

    2018-02-03
  • 集创堂交互设计课程(零基础)详解

    零基础课程5月2日开课,咨询请加微信:yyy8010557经过将近一年的反复打磨,集创堂交互设计课程(零基础)终于出炉了!从内容上来说,这套课程采取了基础设计能力+交互设计思维+项目实战+设计软件学习全方位培养的模式,学员毕业后直接具备实际工作能力;从师资上来说,除了集创堂纯色、潇潇、青木三大导师外,网易云课堂的Nina、拥有六年教学经验的蜡笔强力入驻,课程直接对标网易云课堂;从时间上来说,长达七个月的浸入式学习,听课+作业+实战+讨论...

    2018-04-17
  • 【免费试听】成都UI-UE交互设计免费试听课了解一下!

    德阳中公教育官方微信长按关注,了解更多资讯。周一见!周一见!周一见!没错下周一!成都UI-UE交互设计免费试听课开课啦!与其宅在家里浪费时间不如来体验一下UI设计前五天免费试学4月16日--4月20号机会有限,先到先到得哦!UI-UE交互设计是什么?UI-UE交互设计就是指对产品的人机交互、操作逻辑、界面美观的整体设计!为什么要学习UI-UE?人才需求旺盛,成IT行业职位新宠人才缺口大,行业势头发展迅猛虽然UI这么好,但是不仅对人才的需...

    2018-04-11
  • 2018年用户体验趋势(一)

    2017年,我们见证了很多。在与全世界的189489位设计师策划并分享了1926条链接后,我们从行业内的所写、所说和所想中,预见了几个趋势。以下就是2018年用户体验的预期。#1UX的死亡和重生作为设计师,我们一直致力于能够参与早期的战略决策。如今,我们获得了一席之地,接下来要怎么做呢?APP关掉了新手体验怎么办?这有一份最好的实践清单;不确定网站适合哪种菜单?就用这个模板库吧;首页的标题不够吸引人?咱们来做做A/B测试...与此同时,...

    2018-02-28
  • 如何完美碾压用户体验职位面试

    作者: Patrick Neeman |  翻译:Shea ,校审:Ariel本文长度3082字,建议阅读5分钟当你成功进入了电话面试或者面对面面试的阶段,这就意味着你已经通过了最艰难的考验:你已经具备了在该公司工作的技能。现在要被评估是否具备软实力以及能否适应公司的文化。在上次西雅图用户体验组见面会主持的谈话之后,我发现很多公司没有在面试中明确表达对面试者的期望,而且并不知道如何去面试。面试的过程其实是个自我展现的机会,作为设计师来说...

    2018-02-07
  • 微信公众号哪些细节会影响用户体验?

    公众开发运营官网公众运营平台微信公众号哪些细节会影响用户体验?在微信公众号里面,哪些细节会影响大家对公众号的体验呢?下面小编就来为大家讲解一下这些细节,快来看看吧。1.无意义的自定义菜单内容第一个就是毫无意义的自定义菜单内容,很多企业公众号费心费力通过了企业认证,好像不用这个自定义菜单挺可惜的,然后就非得放些东西进去,但是并没有考虑目标用户是否需要。如果把公众号视作一个小应用的话,自定义菜单的功能可以类比App里的Tabbar,主要是实...

    2018-02-12