移动终端中的视觉引导
在传统网站设计和平面设计中,大量信息的整理规划需要设计者用合理的排版,将信息顺畅的传达给用户,连贯的不间断的视线移动阅读会给人舒适的感觉,反之,视线被引导的满屏幕跳来跳去的,会让用户不知所措,给人乱无章法的感觉,无法更好的接收信息。
在阅读信息的时候,常常受到周围文字和图像的干扰,并不是那么顺畅,根据人眼视觉心理,会有几种容易引导或者说干扰到视觉移动方向的特点。
在上左图中,第一眼看到的是不是红色的色块?右图中,是不是感觉红色的色块向前突出,而灰色的色块向后退?这就是视觉心理造成的,波长长的色彩比波长短的色彩更容易被人眼识别,也就是暖色的、鲜艳的比冷色、暗淡的颜色更“跳”一些,当一个页面中,“更跳一些”的元素无章的排列的话,人眼的视线就会跟这这些吸引人的小元素也跳来跳去了,感觉“页面花”就有这个原因,合理的运用这个规则,就可以达到增强信息顺畅的传达的目的。
人物图片可以锁住用户的目光,牵引用户的视线路径,合理的使用可以烘托气氛,提高访问者的兴趣,留下深刻印象。
一般人都会有这样的体验,当看到1的时候就想找2在那里,视觉有的数字敏感性,很多设计在需要视线牵引的时候,用数字当标头,使视线在即使色彩丰富的页面中也会合理的跳跃。
移动终端中的视觉路径
移动终端具有轻便,屏幕小,单屏内容少等特点,表现的空间比WEB 少了很多,但是视觉规则都是相通的,很多在平面,WEB中适用的规则在移动终端中也照常适用。
左图为IPHONE平台QQ2010界面,视觉通过鲜明彩色的头像图片牵引视线顺势向下。
右图为IPHONE平台 TIME MOBILE 界面,鲜明红色的title条显示新闻的种类,视线路径在红色标题间快速跳跃,帮助用户更快找到所需要的新闻类型。
在这个界面上第一眼看上去,你会发现视线快速的被橙色文字扑获,然后不自觉的在橙色的文字间跳跃,仔细看这几段文字确是并不十分重要的新闻日期信息….. 相对主要信息新闻标题被忽略了,用户会迟疑一下重新找到白色被忽略的新闻标题,造成了视线路径的混乱和信息传达的不顺畅。
大块的清爽颜色作标题条,吸引用户视线,带来亲和的感觉,主内容区用小区域色块或者有色文字去牵引视线,极其珍惜谨慎的使用icon和有色文字,达到用户一眼从头看到底, 飞流直下三千尺的顺畅感觉,得到没有多余干扰的舒适体验。
在设计过程中,产品经理提出“XX链接很重要需要强调,能不能加粗变红?”“颜色单调,要丰富的颜色搭配”等意见, 经过沟通后否定了这些意见,在设计排版中信息的顺畅传达才是最重要和最基本的要求,再丰富再漂亮的图片处理排版布局干扰信息的顺畅传达也是不可取的,特别是在终端小屏幕的情况,相比PC大屏幕,每一个元素和文字的处理都会很大影响整屏给人的大的感觉,影响视线的正常移动。
举几个例子关于在移动终端设计中所注意的视线移动问题,移动终端设计跟PC端设计有很多相通的地方,特别是在高端机型和大屏幕机型上, 希望这些在WEB、 平面设计中的经验能够大量用在移动终端设备上,指导我们做出更多更好用户体验的产品。
(本文出自Tencent WSD Blog,转载时请注明出处)
-
微信创始人张小龙首次公开演讲(官方无删减版)
微信创始人张小龙首次公开演讲(官方无删减版) -
如何通过APP看到产品战略层面
产品经理拿到一款产品的时候,不能只能看到表面信息,而是要能看到产品背后的信息。 -
基于用户的“真需求”创新产品
产品创新是保证企业在竞争激烈的市场上长久生存的关键,今天,我们就围绕产品创新和用户研究分享一些看法。 -
有一种交互设计研究验证叫“设计走查”
如何在最短的时间内对自己的产品做出检验,确保其在定位、设计、营销计划等多个环节,在可视范围内是正确的,需要一套比较科学、完善的方法去做出检测。 -
你为什么离不开微信?
张小龙说用完即走,你却爱不释手; 到底是什么让你离不开微信? -
移动互联时代APP的发展方向
现在我们已经走上了移动互联网时代,无论是企业还是公司,都会经过网络竞争中争取有利的优势,较为传统的产品竞争逐渐向互联网竞争转型,出现了很多数据云大数据等等 -
AI 时代产品经理的机遇和挑战
AI 时代产品经理的机遇和挑战 -
前1%与前10%的产品经理差距在哪?
前1%与前10%的产品经理差距在哪? -
你有哪些策略应对不断的需求变更?
你有哪些策略应对不断的需求变更? -
如何运营天猫【十亿俱乐部】商家页面?
如何运营天猫【十亿俱乐部】商家页面?