交互设计之架构真经

建立信息架构是交互设计师主要工作之一,是需求转向交互稿中非常重要的过程。一个架构的好坏决定这这个产品未来的命运,只有具有一个好的信息架构,才会具有一个好的产品体验。以下将从认识——前期工作——如何产出——如何判断,四个步骤来介绍信息架构。一、何为信息架构信息架构设计是对信息进行结构、组织方式以及归类的设计、好让使用者容易使用和理解的一项艺术与科学。这是比较官方的说法,简单通俗的说法就是对信息进行组织和层级分层。当我们一看到购物车这个信息...

        建立信息架构是交互设计师主要工作之一,是需求转向交互稿中非常重要的过程。一个架构的好坏决定这这个产品未来的命运,只有具有一个好的信息架构,才会具有一个好的产品体验。以下将从认识——前期工作——如何产出——如何判断,四个步骤来介绍信息架构。

一、何为信息架构

        信息架构设计是对信息进行结构、组织方式以及归类的设计、好让使用者容易使用和理解的一项艺术与科学。这是比较官方的说法,简单通俗的说法就是对信息进行组织和层级分层。

交互设计之架构真经

        当我们一看到购物车这个信息的时候,我们就会知道这是一个购物类的APP,这就是信息架构的一个非常重要的点——你的产品必须非常容易让用户理解,在第一眼就有个简单的认识。这是淘宝与京东,他们的信息架构是不是特别的相似.淘宝是首页—微调—消息—购物车—我的,京东是首页—分类—消息—购物车—我的。当然这么相似也是有原因的,当中这涉及到用户的习惯,用户已经被培养出这样的使用习惯,当你在去换另一种方式,就会增加用户的替换成本,当然如果你的新的体验非常的出色,那么可以进行替换,否则还是按照用户使用习惯进行设计,这有个用户价值公式可以参考——用户价值=(新体验—旧体验)—替换成本。同样的例子还有很多,如下:

交互设计之架构真经

        当我们看到这个架构,一看到消息和通讯录就会知道这是一个社交类软件。

交互设计之架构真经

        还有这个例子,一看到今日学习——知识账本——已购,就会知道是一个知识付费的平台。

        这就是信息架构的重要的点——让用户易于理解。用户第一眼就必须知道你这个的产品是用来干什么的。如果你信息架构让用户感到迷茫和不知道怎么用,那么用户是不会在这个APP上待太长时间的,用户使用APP不是用来学习怎样操作它的,一个好的设计要做到自然。用户都能在需要的时候容易找到某种功能(分清主次),更好的体验将会带来更高的留存率。

        信息架构绝不是功能的简单堆叠,我们需要去重新的组织它,去设计它,提取出第一层级、第二层级、第三层级、等等的功能层级,然后再把这么多杂乱的功能进行有组织的排序。


二、产品信息架构设计的前期工作


1 了解用户、场景、使用习惯

        任何一个产品都必须考虑到目标用户,用户需要什么、他们用产品来干什么、最关心产品哪些功能、有没有用过类似产品,在设计前必须要对用户进行分析。一般会进行用户研究,进行数据收集过后,会制作用户角色模型(persona)。当我们在考虑用户时候,是将用户放在场景中进行考虑。什么是场景,场就是时间+空间,景就是情感出发,用户在这个场景中使用产品会有哪些感受。

交互设计之架构真经

        这是抖音和腾讯的微视,相同的使用操作,为什么微视不要另外一种方式呢?——抖音已经培养出了用户习惯,并且这个习惯用也非常的顺手,在找不到更好的方式的情况下,尊重用户当前的用户习惯无疑是最好的选择。

2 了解业务需求

        在这里的业务需求不仅仅只单单只上次讲的产品目标和产品目的了,还包括了运营需求、技术需求等等其他部门的需求。

交互设计之架构真经

        例如左图是WPS页面,将广告放入页面中,APP里面有广告不是产品要考虑的,这是商业的需求(当然WPS这种广告具有强烈的误导性,这下次另外分析,误导用户等于欺骗)。右图是百度地图的,在其上方有个小游戏是推广小智的,这是运营的需求。因此了解其他部分的业务需求是非常必要的。

3 竞品的调研

        在进行竞品的调研,主要要分析出竞品的共性与差异,分析共性和差异形成的原因,因为技术、习惯还是资源等等。共性是我们很难改变的,也是我们很可能借鉴的,而差异就是我们进行创新的地方。

交互设计之架构真经

        还是用抖音和微视分析,共性就是主要操作和架构是差不多的,形成这个的原因是用户已经被培养出使用习惯,而差异就是微视将关注移动到上部分的标签栏中,底部的导航栏加入了发现。这就是微视与抖音的最重要的区别,腾讯进行了资源的组合与分类。这也算是腾讯的创新点。(虽然很鸡肋)

4 卡片分类法——获取用户的心智模型

        在用户分析中曾经提及过卡片分类法,其的目的就是获取用户的心智模型,用户心理是怎想的,是怎么分类的。它是一种让用户对功能卡片进行分类、组织,并且给相关功能的集合重新定义名称的一种自下而上的整理方法。通过这样,我们了解用户是怎么思考这些功能并且怎么合并这些功能的。

        卡片分类法的流程:a 介绍卡片——b 用户归类卡片——c 让用户取名——d继续归类——e 简单的访谈——f 拍照存档

        关于卡片分类中卡片设置的要求:

        第一、它是功能或者界面的名字:比如对话窗口、拨号呼叫

        第二、他来自于你现有信息架构数的树叶部分。(没有子树的部分)

        第三、 不要过分细分,例如不要细分列表单元格内的元素,不要细分一个相对稳定的页面

        第四、功能/信息卡片不能出现包含关系

        第五、卡片总数不能超过30张。

       卡片分类法的产出物(信息架构图):

交互设计之架构真经

交互设计之架构真经

三、产出产品信息架构设计

1 整合信息——形成自己的产品框架

        利用上文中竞品分析和用户心智模型形成的信息架构图,进行信息的整合。形成自己的信息架构图,可以利用思维导图和axure等工具。

2 寻找层与度的平衡

        层是广度,度是指深度,把握两者的平衡会影响体验的好坏,深度太深,用户有耐心连续探索8个页面吗?(一般5个为突破值),如果广度大太广,用户一下能看这么多信息吗。层和度是相互变化的,层多了,度就少。在进行信息架构设计的时候要做到两者的平衡。

3 验证核心使用流程

        在信息架构完成后,然后验证这个架构是否可以用,这是一个至上而下的过程,来验证是否这个信息架构可以走的通,可以利用用户体验地图进行模拟。

4 考虑信息架构与交互构图的关系

交互设计之架构真经

        在移动端,一级导航的样式分辨为Tab式导航与抽屉式导航,Tab式导航虽然中规中矩,但是容易让用户理解并且记住,抽屉式导航给人的感觉会很酷,但是对信息是一种隐藏,如果第一重要级不是很突出,最好不要使用抽屉式导航,正如behance找图看图的第一重要级相较于其它就非常突出,打车软件与地图软件的地图首页的重要级就非常突出,在这样的情况下就可以使用抽屉式导航。所以为什么说TIM的信息架构非常的差,第一,一个社交软件,没有特别突出的重要级,竟然使用类始于抽屉式导航的形式将相对于比较重要的联系人页面进行了隐藏,相对于不太重要的办公页面去放置在主导航中。

交互设计之架构真经

        到苹果官网的图,你一样你会看到iphone8那几个字,因为这是苹果想要突出的第一优先级。

交互设计之架构真经

         这这里我调了一下的图片,第一眼,你会看到手机。

        也就是说在进行页面信息排布的时候,也可以更加信息优先级来进行交互架构的设计。确定页面所需呈现信息——绘制信息架构树状图(找到连同信息)——进行重要心分级——绘制页面。

四、判断产品的信息架构


判断产品信息架构好与不好有两个方法:

1 用户测试:

第一,用户在你不介绍具体产品的情况下,通过短时间的使用,说出产品可以用来作什么

第二,让用户进行核心人物流程,检查完成是否流畅

第三,给用户一个寻找一个相对层级较深的功能任务,检测用户是否能通过信息架构名称找出功能

2 撰写产品说明书

以非常简单的交互框的形式,看用户能不能看懂。


超sir 

第八日




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

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

相关推荐

  • Axure RP 8软件和安装教程

    Axure RP 8(64位)下载链接:百度网盘:https://pan.baidu.com/s/1hsfD3Kg提取密码:ivma软件简介:Axure RP是一个专业的快速原型设计工具,让负责定义需求和规格、设计功能和界面的专家能够快速创建应用软件或Web网站的线框图、流程图、原型和规格说明文档。作为专业的原型设计工具,它能快速、高效的创建原型,同时支持多人协作设计和版本控制管理。(仅供学习交流使用)安装前须知:1.解压和安装前请关闭...

    2018-04-17
  • 新零售下的智能终端设备全链路用户体验设计分析

    作者:阿里UED/丹妮2017年被称作是新零售的元年,阿里巴巴集团CEO张勇提出的“新零售”概念,提出通过大数据、互联网重新构造“人、货、场”场景,数字化技术已被逐渐应用在传统实体零售的每一个环节。在小店业态中,智能终端设备成为收集大数据的唯一通道,被互联网行业视为重中之重,而在纷杂的POS市场中,绝大部分都是沉重的桌面式收银POS机器,这时智能移动POS机作为收银POS机器的补充设备应运而生,智能移动POS机以移动便捷、功能齐全等优势...

    2018-01-31
  • 人工智能对用户体验的影响

    最近两年人工智能技术在金融、安全、交通、医疗、公共服务和制造业等领域逐渐落地,随着技术的成熟,人工智能将会在更多领域影响人类的生活。以人为本的人工智能设计会变得更加重要,本文会从安全性、效率、易用性、场景化、个性化五个方面阐述人工智能如何改善现有的产品和用户体验,这五个方面存在着各种联系并相互影响。安全性越接近系统底层的技术越影响用户体验,例如手机中毒或者信息被盗都会对用户产生巨大影响;如果关系到国家安全,整个社会的秩序都会被扰乱,所以...

    2018-03-26
  • 【用户体验】机器人教练:第三季!

    【本文转自:哈尔滨腾达集团驾校】WELCOME TO TENGDA我们的腾达欢迎来到腾达驾校机器人教学活动已经举办了两期,机器人教学俨然已经成为了一种时尚热潮,同时也在学员中树立了良好的口碑,学员反响热烈,有越来越多的学员通过此次活动认识了机器人教练,并且想来体验一下机器人教练的庐山真面目。近一周的科二学习,可累坏了学员们、也累坏了教练。在此对大家说一句:大家辛苦了!经过几天风吹日晒,我们的科二学习已经正式接近尾声,本周最后一个科目的练...

    2018-04-23
  • 用户体验才是真正的“一句顶一万句” 安徽燕之坊食品公司用勤哲软件实现生产、经营和管理数据的互联互通

    统计数据显示,截止2017年底,国内食品工业企业超过4万家,主营业务收入占全国工业的比重十分之一强。在实施制造强国战略和推进健康中国建设中,食品工业作为传统的“以食为天”的民生产业占据着不可或缺的重要位置。当前,食品行业在实现快速发展的过程中,面对城乡居民安全、多样、健康、营养、方便的食品消费需求时,与其他行业一样面临着转型、升级的动能和压力。尤其是在食品质量安全水平和高品质食品有效供给方面,利用现代信息技术创新消除安全和质量隐患等领域...

    2018-02-13
  • D1-交互设计入门

    一阶段:1.交互设计基本原则2.平台特性及其设计规范3.做交互设计的方法,工具4.掌握交互设计的基本流程二阶段:1.特定控件设计,2.特定界面设计3.独立常用功能设计三阶段:1.多项功能设计2.方法研究,总结3.竞品和优秀产品分析4.最新的系统和产品分析5.了解前段技术四阶段:1.产品架构2.设计趋势3.产品发展趋势Windows 用户体验交互设计规范http://www.uxguide.net/wiki/windows:HomeiPh...

    微信热点 2018-04-07
  • 交互设计申请竞争白热化,你该如何“杀出重围”?

    只要你想改变自己汉艺陪你死磕到底对于学习交互设计的同学来说,多数同学的作品集项目最终效果是这样的:这样的一个网页,几个app界面的最终效果图在各大设计网站,更是一抓一大把,导致很多同学对于交互设计的认知更多的停留在网页设计或者app设计上,浏览越多案例,思维越被局限。如果一个交互作品集中四五个项目全是这样的“大众脸”,想要从全球大量相似的“竞品”中脱颖而出,吸引到考官注意力,可以说困难重重。本期文章,为了让大家的作品集能够在全球竞争中脱...

    2018-02-03
  • 蓝鸽集团2018校园招聘,多岗位,提供食宿,年薪8-20万!

    蓝鸽集团是一家专业从事语言教育技术的高科技. 集团化企业。目前拥有5个子公司. 1个研究院. 3个科技园。在全国30多个省. 市. 自治区设立了200多个分支机构,现有员工1000余名,是我国语言教育技术行业的龙头企业和第一品牌。蓝鸽在2006年与广东省电视台合作承办了国家级“英语辅导”电视台。2008年被认定为国家级高新技术企业。2013年经国务院批准设立博士后工作站。2015年第一个研制成功了具有物联网功能的智能化多媒体教室。201...

    2018-04-08
  • 芝加哥艺术学院交互设计硕士成功案例

    等你点蓝字关注都等出蜘蛛网了学生档案毕业院校:北京某大学本科专业:网络设计本科平均分:3.45申请学位:硕士申请专业:交互设计TOEFL:95GRE:无案例回放W同学是2015年10月底进入公司服务体系的,想要申请2017年秋季入学的设计类相关专业。通过第一次电话联系,名校规划导师了解到W同学的基本情况是:北京某大学网络设计专业学生,GPA:3.45,TOEFL:77分,没有GRE成绩。再通过头脑风暴课上的深入挖掘,名校规划导师更全面更...

    2018-04-26
  • 亚马逊语音交互设计规范(三)Alexa的回应

    作者:Amazon翻译:原形必录这篇是整个设计规范的重点,因为在设计语音交互时最主要的就是Alexa的回复内容,本篇给出了很多让对话更自然易懂的方法,希望对大家有帮助。往期回顾:《亚马逊语音交互设计规范(一)设计流程》《亚马逊语音交互设计规范(二)用户说的内容》本文讲的是Alexa如何表达能让人们更容易理解和更好的回应。Alexa能够以自然的对话方式来回应、通知,还能问问题。 在设计Alexa对用户说什么时,我们可以参考以下做法。本章目...

    2018-03-18