IAMUE
  • Home
  • 文章分类
    • 交互
      • 从零开始学交互
      • IxD案例
      • 微信热点
    • UXD
    • Wireframes
    • GUID
    • PM
  • More
    • AID
    • 资源下载
    • 作品集
    • 电子书:《从零开始做交互》
    • Sketch 4.9 - Sketch全系列免费下载(更新Sketch4.9)
    • 淘宝手机H5版UX移动交互设计规范
    • Axure基础入门
    • 隐私政策

用好这些可用性原则,你就能简单做好交互设计!

Catherine • 2017-05-20 02:10 • 交互设计

做产品经理不懂交互设计,那就是寸步难行。“交互原则多,体验出彩少”,既然要做好产品体验,那么吃透基本的交互设计原则,就是必须且必然的事儿。今天给大家挖了很多可靠的栗子,直接给你提供干货,拿走不谢。

文章目录[隐藏]

  • 1、系统状态可见性 (Visibility of system status)
  • 2、系统与现实世界的匹配性( Match between system and the real world)
  • 3、增加用户操作感和自由度 (User control and freedom)
  • 4、一致性及标准化 (Consistency and standards)
  • 5、预防错误(Error prevention)
  • 6、美与简单的设计(Aesthetic and minimalist design)

做产品经理不懂交互设计,那就是寸步难行。“交互原则多,体验出彩少”,既然要做好产品体验,那么吃透基本的交互设计原则,就是必须且必然的事儿。今天给大家挖了很多可靠的栗子,直接给你提供干货,拿走不谢。

用好这些可用性原则,你就能简单做好交互设计!

1、系统状态可见性 (Visibility of system status)

帮你理解:系统应该总是在合理的时间内,通过适当的反馈让用户了解正在发生什么。

用好这些可用性原则,你就能简单做好交互设计!

帮你总结:提高产品状态的可视化程度,从而提高用户对自己在使用系统过程的情况的透明度。

2、系统与现实世界的匹配性( Match between system and the real world)

帮你理解:系统应该讲用户的语言,用单词,短语和概念让用户感觉到熟悉,而不是用面向系统的术语来面对用户。同时按照现实世界的惯例,让信息出现在自然和逻辑顺序中。

用好这些可用性原则,你就能简单做好交互设计!

用好这些可用性原则,你就能简单做好交互设计!

帮你总结:

  1. 从用户的角度出发,推荐Banner内容,用户可以花更好的时间明了这些滑动的Banner是“可能适合我的”课程。我们可以在产品的细节处继续使用user’s language来提高用户的UE。
  2. 根据用户的日常行为,判断用户的偏好,做个性推荐也是这个原则的案例之一,这类案例用得最多的是在购物类、音乐类、阅读类应用。
  3. 用户产品的名字代替“首页”类的形容词,解决从用户角度体现内容和意图的问题,在细节处使用user’s language来提高用户的体验感。

3、增加用户操作感和自由度 (User control and freedom)

帮你理解:用户往往会不经意选择错误的系统功能,那么产品设计就需要一个明确标明“紧急出口”的状态或者功能规避不必要的操作,譬如:支持撤销和重做。

用好这些可用性原则,你就能简单做好交互设计!
帮你总结:从用户体验的角度来看,自动切换的信息在“播放”时需要放慢速度,通过内容本身或者配色去调亮引导dots,可以增加用户的操作感。另外,对用户可能出现反悔操作的功能,应该提供撤销和重做的入口,让用户能更加自如的使用你的产品。

4、一致性及标准化 (Consistency and standards)

帮你理解:在一个系统或者应用中,用户不应该想知道不同的单词,或者理解同一个功能的被展示出不同情况的原因。对于一致性,浅显易懂,现在普遍都用的很好,那么对于标准化,很多网站或者app,特别是新的产品,开始通过衍生自己的LOGO、品牌,充分洗脑用户,强化用户对自己产品的记忆点。甚至可以根据自己的产品定位,创新一类icon等,通过图形的表达让用户更加对你的产品记忆深刻。推荐一款个人非常喜欢的App:“想去”,它的设计就从App的icon到内饰都一气呵成,甚至连loading都是惊喜设计的,让人用着非常舒服。

用好这些可用性原则,你就能简单做好交互设计!

帮你总结:适当的给自己的产品拟定标准化的记忆库,不但让用户体验你的产品时,觉得走心,也会让用户在不经意间把你的产品记得牢牢的。

5、预防错误(Error prevention)

帮你理解:在首次使用系统或者产品的时候,巧妙的设计比好的错误提示更加能弥补不足。最好能在用户进行下一步之前,避免掉低级的错误,让用户的使用过程是舒服顺畅的。

用好这些可用性原则,你就能简单做好交互设计!

帮你总结:在可能出现错误、空白的情况之前,利用加载的可视化、再加上比较nice的动效、提示会让用户减轻失败带来的不爽。

6、美与简单的设计(Aesthetic and minimalist design)

帮你理解:设计不应该包含不相关或不常用的信息。重点的内容和核心的元素应该与其他的信息形成鲜明的区别。譬如在配色上,可以选择1个主色,2个以内的辅色,构成整个设计的骨骼,用主色告知用户目的与指示。

用好这些可用性原则,你就能简单做好交互设计!

帮你总结:

增加美感的同时也需要最小化设计元素,做减法。
以上6条可用性原则,是小M做产品过程中能无时无刻不记起的。每一次小细节的打磨都是一次回溯基本原理及原则的好机会,是否灵活运用并烂熟于心,这是需要所有产品人er用心去感受的。加上小M前不久写过的在做交互设计时,你需要知道这几大定律。希望能给你足够的基本方法去做好自己的产品。

最后送给所有产品人er一句装逼的话:“形式是跟随功能的,功能是满足用户需求的。尊重你的用户,让每个产品的细节都是合情合理的,让每一寸体验是‘走心’的!”

 

作者:权莉,微信昵称:Mandy权。一名快乐的产品经理!

本文由 @权莉 原创发布于人人都是产品经理。未经许可,禁止转载。

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/28139/

logo交互交互原则交互设计产品产品体验产品经理产品设计动效可用性原则微信用户用户体验设计设计原则转载配色
赞 (0)
CatherineCatherine
0
生成海报
平庸的产品和伟大的产品中间只隔了一个:微交互
上一篇 2017-05-20 01:15
交互小细节——信息层级展示规则
下一篇 2017-05-20 03:15

相关推荐

  • 微信热点

    《2017中国设计行业价格报告》——交互设计

    《2017中国设计行业价格报告》——交互设计创意点亮生活设计美好人生创意设计一个有温度有格调的公众号合作、投稿:cda-zj@vip.163.com微信:13777850472微博:@浙江省创意设计协会

    2018-02-14
  • 微信热点

    如何将“用户体验”做到极致?我有绝招!

    如何将“用户体验”做到极致?我有绝招!无崖子现在大多数掌柜的没有重视用户体验或者说不知道如何做用户体验。三只松鼠相信很多掌柜的都很熟悉,坚果类目的老大,三只松鼠是如何成功的呢?三只松鼠的成功不是偶然的而是必然的,三种松鼠将“用户体验”做到了极致,三只松鼠的创始人:章燎原是传统行业出身,在做三只松鼠之前在传统行业就对坚果非常熟悉,章燎原对坚果行业的把控至今无人能敌,三只松鼠的成功一部分是对供应链和仓储的把控,还有就是注重“用户体验”的极致...

    2018-03-16
  • 如何改版一个3亿用户的神奇网站 IxD案例

    如何改版一个3亿用户的神奇网站

     #交互学堂#十年后的今天,随着58的业务越来越壮大以及一些创新产品的加入,单纯的形式越来越难以承载业务含义,统一的样式也越来越难很好地满足用户的需求。  为什么要改版 58同城自2005年创立以来在APP、M、PC主…

    2016-11-03
  • IxD案例

    淘宝天猫个性化推荐技术演进史

    小编说:个性化推荐技术直面用户,可以说是站在最前线的那个。如今,从用户打开手机淘宝客户端(简称“手淘”)或是手机天猫客户端(简称“猫客”)的那一刻起,个性化推荐技术就已经启动,为你我带来一场个性化的购物…

    2017-05-09
  • 微信热点

    最新软件安装包目录【18年4月】

    悦台新媒体欢迎关注我们图文美编部关注软件导航电脑办公室内/外设计平面设计机械设计影视动画建筑设计地理信息网页设计屏幕录像编程类电子绘图数据库数据统计理科工具软件目录【电脑办公】电脑系统(U盘安装)PE制作WIN7WIN8WIN10XP电脑系统(直接安装)WIN7WIN8WIN10Officeoffice2003office2007office2010office2013office2016Projectproject2007projec...

    2018-04-09
  • 当交互设计师承担视觉设计 交互设计

    当交互设计师承担视觉设计

    有人说,工科背景出身的交互设计师 跟视觉出身的交互设计 是的区别之一是,前者设计的东西会不够有美感,也就是很Low。虽然逻辑架构,特别是做大型管理系统的时候,可以很快把信息和功能模块归类,但是视觉知识和审美积淀,对我们这种工科生来说, 却是天生的Bug。

    2017-05-28
  • 交互设计中的项目跟进怎么进行? 交互设计

    交互设计中的项目跟进怎么进行?

    交互设计的常见流程可以划分为:需求分析、设计规划、设计实施、项目跟进、成果检验五个流程。很多人以为从无到有的过程才是最重要的环节,观点并没错,但我今天想说的是如何进行项目跟进。

    2017-05-30
  • 请记住,视觉设计远不止“好看”这么简单 交互设计

    请记住,视觉设计远不止“好看”这么简单

    设计师和理发师其实有点像,理发师基本分为三种:一种是只会搞基础发型的,比如寸头、中规中矩的长发、老太太卷头等;一种是只会剪流行发型的(这种发型师还很容易 摇身一变成为造型大师,告诉你你应该改变,应该剪目前最流行的某款发型,但实际上可能是他只擅长这款发型);还有一种是最可遇不可求的,他根据你的脸型、 性格等,用最简单的手法量身设计发型,让顾客的气质度立刻得到提升。

    2017-06-03
  • 【分享】最全界面设计模式、APP和Web交互流程图 交互设计

    【分享】最全界面设计模式、APP和Web交互流程图

    这次设计夹的主编-晓黑同学为大家整理了史上最全面的APP和Web交互流程图的标准画法,内容非常的全面。通过结合自己的项目经验,把交互流程图做的更加清晰。在后面,还为大家整理一般的web设计模式及APP设计模式,以…

    2016-07-13
  • 【交互设计面试经验】2015年1月20日-交互设计师面试问题分享 交互设计

    【交互设计面试经验】2015年1月20日-交互设计师面试问题分享

    面试时间 2015年1月20日 阿西导读: 今天起我们给交互设计行业的朋友们开一个福利栏目:交互设计师面试分享我们在分类里叫交互设计面试,无论你是新手交互还是UI转UE 或是PM转UE又或者PM兼职UE。 不论怎样你都需要知…

    2015-01-21
  • UED书单
  • 微信精选
  • 投稿说明
  • 赞助

Copyright © 2024 WPCOM 版权所有 粤ICP备000000000号 Powered by WordPress