资讯类产品阅读列表的交互设计思考交互设计

时间:2023-02-21 04:01:28 作者:月亮叉子 综合材料 收藏本文 下载本文

【导语】“月亮叉子”通过精心收集,向本站投稿了7篇资讯类产品阅读列表的交互设计思考交互设计,这次小编在这里给大家整理后的资讯类产品阅读列表的交互设计思考交互设计,供大家阅读参考。

篇1:资讯类产品阅读列表的交互设计思考交互设计

列表,定义为:以表格为容器,装载着文字或图表的一种形式,根据产品类型的不同,大部分都有其各自样式的列表,有些成为产品的主体,有些则为其他页面的辅助。列表设计的主要目的,就是让用户快速浏览、扫描,从中选择出自己想要“费力”点击并“费时”去仔细阅读的内容。

与传统阅读平台比较,阅读列表就像是实体书中的目录。小说的目录简洁:标题+页码;杂志的目录则相对丰富:标题、副标题、图片、摘要、页码,精致的排版,有些甚至还包括广告。每种内容都会有适合其展现的列表形式,资讯类产品的阅读列表需要考虑的几点:

1. 视觉重心

把产品希望用户看到的内容凸显出来,引导用户去阅读那些重点推荐的内容。

在阅读信息的时候,常常受到周围文字和图像的干扰,并不是那么顺畅,根据人眼视觉心理,会有几种容易引导或者说干扰到视觉移动方向的特点。

1) 视线引导

a. 一般,暖色比冷色,鲜艳比暗淡,更容易吸引视线。

一般阅读时,视线是从左到右从上到下的,但颜色的引导会改变视线的顺序。合理运用能给列表以重点,反之则会破坏用户的心理预期,造成阅读的负担,影响认知效率。

b. 图片比文字更吸引人。

图片在视觉传达上能辅助文字,帮助理解,更可以使版面立体、真实。

大多数资讯类列表中都含有文章配图的缩略图。缩略图的摆放位置,根据产品定位也有所不同。

更专注于资讯本身较为稳重的产品,倾向于将缩略图放在新闻标题的后面。这类资讯内容的图片质量往往较为一般,同时,能够让用户处于较平稳的心态阅读每一条标题,从而选择自己喜欢的内容,图片只期待起到辅助标题的作用。

而对于偏娱乐化,碎片化的资讯类产品,缩略图放在标题前面能够更直观的传达出内容的含义,从而缩短用户理解文字标题的时间,让用户的时间顺着右侧的图片向下快速浏览,起到快速筛选的目的。

c. 环形能够汇聚视线

d. 视线会随箭头,或数字或编号移动。

规律的箭头或数字排布,容易造成页面一侧过重,或有强烈的提示意味,要注意页面的平稳。

2) 突出

如果需要你认为用户会感兴趣的文章,或者花了很多功夫设计的部分真的吸引到他们的注意,那就要想办法把这些部分“突出”出来。

最简单的方法是使用亮色的样式,或者改变该项的背景颜色。还可以为这篇文章找一个可以突出于其他层次的位置,比如在标题前面放一个缩略图之类的。但也需要考虑到页面的整体视觉效果,一个原则是“太多重点等于没有重点”。

3) 反馈

给予已阅读内容相应的视觉反馈,并使用区别于“突出”内容的交互方式,

比如已经使用不同颜色的圆点区别内容的重点或普通,就不要再用圆点的形式提示已读。相同的样式在人们的心中暗示相同的内容,而未读和已读则是同种内容的两种状态。

2. 不打扰

1) 长列表

如果能够有效的扫视浏览,长列表并不会是种麻烦,至少它可以让浏览不用付出多少努力和代价。

在资讯类的长列表中,没有必要使用标准的页码指示,原因如下:

a. 从一个阅读内容的世界到一个导航的世界。

当每一次用户都通过选择页码去看更多内容,他需要把自己从一个阅读内容的世界拖出来,再放到一个导航的世界中去。用户思考的不再是他们要阅读什么样的内容,而是怎么找到更多的东西去看。选择页码增加了自然的停顿时间,也给了用户机会能够评估他们是否想要继续阅读或者是直接离开。

b. 另外页码没有本质的含义。

用户按页码选择只是为了方便他们找到在第2页或者更早以前想要阅读的内容而已。给他一个更好的方法,比如按照周、月、年,分类,标签等属性的方式筛选,远比页码有效的多。也有很多的移动终端中,使用了分页的指示控件,但将页码数去掉了,这不失为一种好办法。

2) 广告

阅读的重点在于内容,用户并不在意看到与内容相关的广告,或不影响列表浏览的广告。

经常使用浏览器或使用免费应用的用户应该已经较为习惯广告的存在,也能够理解广告于产品的意义,只要不太打扰他们的正常阅读就好。

a. 不要假装广告是一则有趣的内容。

这样做虽然可以增加广告的点击量,但是用户也会因为“受骗”而恼怒,带来不好的体验。

b. 为内容提供相关的广告。

数据表明,用户愿意点击与汽车相关的广告。当用户查看车型的时候,相应的专卖店推荐正好为他提供了购买的渠道,甚至比价的渠道,用户当然欣然前往。

c. 易于忽略。

有时为了列表的整齐和产品的美观,在设计中会将广告插在列表间,并假装它是列表中的一条项目。但应尽量减少广告的视觉效果,让其看起来不起眼,可以轻松跳过而不被意识到。

有些将广告放在页顶部的产品,虽然位置明显,但可以通过按钮关闭或只有下拉才显示,也是种折中的选择。

3. 阅读节奏

整齐而重复的格式和产品把握“第一屏”的策略,容易使筛选阅读列表的过程产生一种类似于“白噪音”的屏蔽效果。再好的东西都会产生“审美疲劳”,在稍长时间的阅读后,用户往往会觉得内容都相对平淡无奇而离开列表。

微博产品作为一种阅读媒介的优点在于它不时的出现亮点,让阅读保持节奏和惊喜。

保持节奏的呼吸可以让运动更持久,保持内容的节奏也会让阅读长时间的延续下去。有趣与无趣的交替反复,给用户休息和从新提起兴趣的间歇,加上对于下一个小惊喜的期待,从而产生产品整体的舒适体验,而不是很多有趣之后与很多无趣的平均值。

4. 列表中的项目

大部分产品都会包括的项目有:标题,摘要,发布日期,操作(点击阅读更多,查看更多);

常见的项目:分类,缩略图,评论数,图片数,作者。

篇2:关于“交互设计”交互设计

记录刚才和HEXIAO闲聊中,说到的一席话,

1、以前的”人机交互”更偏向于”机器”。

更多的是考虑”机器”能提供什么给”人”,如何提供。如,戴国忠老师一直在致力研究的”手写输入“。

2、最近两三年我们很欣喜的看到了很好的变化,我们的”人机交互”慢慢更偏向于”人”了。

“人”需要什么,”人”需要”机器”做什么变得越来越重要。因为真正的瓶颈已经不在于”机器”的技术问题了。

3、其实,一直以来在人机交互领域其实都是这么两个流派。

计算机相关学术的人比较偏向于”机器”,心理学相关的都比较偏向于”人”。

我个人相对比较主张:基于人的交互研究可以相对快速的推动社会的发展,也可以更好的推动”机器”的进步。

4、其实我们现在都在解决的问题是”如何让机器更加聪明起来,如何让机器有更多的’思考’能力”。

实际上,我认为”如何更好的让人互动起来,如何更好的提炼人与人的互动信息”反倒比这一切更加的重要。

5、对于”交互设计”,现在有三种层次的认识。

第一种:视觉交互

“有一个提示窗口要弹出来,是从左边弹出来好呢,还是从右边弹出来好? 还是下边?”

我一直认为这应该是视觉设计的范畴,而非”交互设计”的主要工作。

6、第二种:流程设计

现在有”打电话”这个任务,设计一种什么样的流程和互动方式让”打电话”这个任务可以更加方便快捷并符合用户习惯的完成。包括某个按钮要放在什么地方,用按钮还是用链接。

我个人认为:这部分工作是”交互设计”的具体”执行”阶段。

7、第三种:机器应用

“有什么样的处理方式可以使机器与人的交互更加的顺畅和快捷”。

如,ajax就是一个极其有价值的人机交互创新。包括Flash, Java, VC..

8、我认为还有一种:人与人的交互

“如何更好的促进人与人的交互,有什么更多的应用方式”。

比如,设计Digg这种信息的交互方式。

9、实际上现在的搜索引擎都是很初级的很笨的搜索引擎。

我们可以有什么更多的人与人的交互方式、人与机器的交互方式可以创新呢?

我们现在很多的”交互设计师”在做着”某个窗口是从下面弹出还是从右边弹出”、”某个功能是用按钮还是用链接”的工作;也有很多”交互设计师”在做着”某个流程先让用户做什么再让用户做什么”;很少有”交互设计师”在思考着”除了ajax以后还有什么更多的技术应用呢?”。

谁在思考”如何在人与人的交互上做更多的创新……”?

做到什么程度”交互设计师”才可能像”产品设计师”一样颠覆一个产业呢?

值得所有”交互设计师”思考…

PS –

HEXIAO语:

交互设计师的关注点是什么?

决定一个Button放在页面的什么位置? 决定哪个流程的设计更合理? 还有更多吗?

事实上在应用层面的思考决定交互设计师同样可以关注架构(Architecture)和产品形态(Ecosystem), 在这个方面也可以展开.

网友评论(17)

子狼手记- 07/05/17 8:53 PM

开阔了眼界,展示了更广阔的前景。

交互设计师任重道远。

青椒土豆丝- 07/05/17 11:13 PM

有启发,三种层次。

为什么我老感觉“交互设计师”做着“产品设计”的东西呢?

yellow- 07/05/18 12:52 AM

感觉自己要学的东西太多太多

GOVO: links for 2007-05-17- 07/05/18 6:23 AM

[…] 白鸦 » 关于“交互设计” 谁在思考”如何在人与人的交互上做更多的创新……”? 做到什么程度”交互设计师”才可能像”产品设计师”一样颠覆一个产业呢? (tags: reading) […]

dte- 07/05/18 9:36 AM

上周五在北邮听了戴国忠老师的演讲了呢 确实是围绕他那些个手写输入设备来说的

工业设计出生的确实适合做交互设计…挺赞同人与人交互这点的,是个需要突破创新的点

myspace- 07/05/18 11:18 AM

与青椒土豆丝有同感

范畴的大小,领域促就了职位名称不同

Amy- 07/05/18 11:23 AM

交互是什么,你看我一眼,然后我也看你一眼,这样就交互了,

呵呵,听一个朋友说的,感觉很有意思。

awflasher- 07/05/18 12:22 PM

对了老白,告诉你一个好消息。

你的blog是我见过为数不多的拥有Compete Rank的中文个人blog。

www.awflasher.com/blog/archives/888

Compete Rank here ^_^

千鸟- 07/05/18 1:20 PM

有点不同意见

1. “视觉交互”也应该属于交互设计师的职责,页面内的交互技术含量不比流程低,尤其是现在的ajax技术应用,“视觉设计”不应该涉及行为设计。

2. “交互设计师”从定义上就决定了不可能颠覆一个产业,如果具有了这种实力,并且能够实施,那么他做的事情一定不局限于“交互设计”。

xiaoxiao- 07/05/18 3:38 PM

同意千鸟的第一点,视觉考虑的是更好的呈现产品

第二点是我觉得是一个老总考虑的事了,呵呵。

jaryxie- 07/05/18 7:24 PM

我觉得这都是产品设计里面的角色分工问题,没必要整天在划界线和职责,合作应该是无间和高密度的,不是相互分割的关系,视觉图形设计在产品设计中承担界面的最终呈现,是相当重要和易感知的.是对交互的提炼和理解继承的过程,不是单纯的你管那,我管这,最后凑成一个产品的概念.

交互和信息呈现有很必然的联系,非要以职位来划分,是很可怜的事情.

jaryxie- 07/05/18 7:32 PM

交互设计更多处理交互对象间的关系和逻辑,以及交互的方法,是产品设计中一部分,任何一个角色和职位在产品设计中都不具备颠覆一个产品或者产业,如果非要那样认为,那只能自以为是.

noway- 07/05/18 10:40 PM

“我认为还有一种:人与人的交互

“如何更好的促进人与人的交互,有什么更多的应用方式”。

比如,设计Digg这种信息的交互方式。”

在流程里面,很自然的地,包含人与人之间的信息交流,交互设计中,在设计流程时,本身就很自然需要考虑到人与人之间的交互。

人为进行这种划分,没有什么意义,除了制造一些“错误”的分类。

hexiao- 07/05/21 10:31 AM

建议白老师把交互设计和交互设计师稍做区分…

mihu- 07/06/16 8:04 PM

前段时间,学校有个心理系的去cmu学习交互设计,

当我们谈到交互设计时,国外更多的计算机和心理的在做,

他们不太认同设计作的是交互设计,可能还是归在界面设计师!

现在也不清晰交互设计的定义。

来自:uicom.net/blog/?p=614

篇3:商品列表排序方式的思考交互设计

这里的商品列表不包含站内搜索结果列表,商品搜索结果的排序和内容呈现,请参考我的另一文章:B2c站内搜索初探–排序和内容呈现/searchengine/20111211/316046.html

传统零售中,货架的陈列对销量的影响巨大,如何合理的分配有限的空间,通过促销品吸引顾客、从而促进最大利润产品的销售、清理滞销品和库存货,显得尤其重要。网上零售虽然理论上没有货架和空间的限制,但商品的展示机会从来都是不公平和不平等的。

有人总结b2c商品销量是二八法则,20%的商品贡献了80%的销量,但很多网站可能更加极端,10%以下的商品贡献了90%的销量。导致这种结果的原因之一是商品的展示机会严重不均衡。

总结下来,以下因素将直接影响商品的展示机会:

着陆页导致的流量分布不均。

通常b2c网站的主要着陆页面有3种:首页、