Niki Design

最痛苦的事,不是失败,是我本可以。

人如何观察 ——《设计师要懂心理学》

别人在你的网站上看见的内容未必符合你的设想,他们的个人背景、文化水平、对眼前事物的熟悉度以及期待看到什么,都会影响他们的观察结果。


这需要我们确定自己网站的用户群,即做好自我定位。


--------------------------------------------------------------------------------------------------


人们看电脑屏幕时会用到周边视觉,而且经常只扫一眼周边视觉区域便以此判断整个页面的内容。

虽然屏幕中央是重要的中央视觉区,但别忽视周边视觉区域。一定要确保周边内容清晰地表现了网页的用途。


如果你想让用户集中注意力观察屏幕某处,就别在周边视觉区域内放置动画和闪烁元素。


现在好多产品都有专门的展示页,产品介绍主要集中在中央视觉区,周边视觉区域大多采用留白的方式,顶多放置导航按钮,以此使访客专注于产品。


相反,如果有其他想要吸引用户注意的,可以在周边视觉区域放置一些简单的动画或色彩鲜艳的元素,比如新浪博客右上卷起的一角,还有花瓣网有活动时网页最顶端的通知。当然,动画和色彩运用都要掌握限度,太显眼的闪动或太刺眼的颜色会让人反感。


--------------------------------------------------------------------------------------------------


既然人会不由自主地寻找规律,那就尽量多使用规律,利用分组和间隔创造规律。


这在大多数APP设计中已有所体现,比如QQ、淘宝等客户端的个人账户页面,都对功能做了分组。


要让某个物体(例如图标)易于识别,就用简单的几何图形来画它。这会让构成物体的几何离子更明显,从而使人更快、更轻松地识别该物体。


抽象的小图标已广泛应用于APP、网页等的设计中了。


--------------------------------------------------------------------------------------------------


多用二维元素,少用三维元素。大脑以二维形式接收人眼观察到的信息,因此屏幕上的三维图形可能会减慢识别和理解的速度。


--------------------------------------------------------------------------------------------------


人在观看网页时,首先会对人脸作出识别和反应(至少没有自闭症的人都是如此)。


在网页上直视用户的脸最具感染力,也许因为眼睛是面部最重要的部分。


如果网页上的人眼看着旁边的位置或产品,那么人们往往也会看向同一处,但未必关注,只是看而已。


--------------------------------------------------------------------------------------------------


标准视角的画像和物体更容易识别和记忆。如果你的网页或程序里包含一些图标,那么不妨把它们画成标准视角的。


--------------------------------------------------------------------------------------------------


最重要的信息(或希望用户关注的内容)要放在屏幕的上面三分之一部分,或放在屏幕中间。


原来博客的布局,头像在左,博文在右。每次登录,首先看到的便是头像,而先在我想把重点放在博文上,就调整了首页布局,将头像移到右侧,这样视觉的起点就是最近的一篇博文,而不是头像了。黑色背景,黑白头像,使头像更加不显眼。


既然人们不看屏幕边缘,就不要把重要信息放那儿。


按照正常阅读顺序合理设计界面,避免让人来回跳着阅读内容。


--------------------------------------------------------------------------------------------------


设计时要考虑功能可见性的提示。给用户操作提示后,他们就更容易正确使用物体。


设计触摸设备界面时,请慎用悬停可见的提示。


--------------------------------------------------------------------------------------------------


不要认为物体出现在屏幕上就一定会被用户看见,特别是刷新页面出现改变时,用户很可能完全意识不到页面前后的区别。


如果你要保证用户注意到界面上的某处改变,应该增加视觉提示(如使之闪烁)或听觉提示(如“哗”的一声)。


Weico 客户端在刷新页面后,会有水花的声音。


对眼动跟踪数据进行分析要谨慎,别过于重视它,也别把它作为设计决策的主要依据。


--------------------------------------------------------------------------------------------------


你如果希望读者认为某些图片、照片、标题或文字是相关的,就将这些内容相邻放置。无关内容间距要大,相关内容间距要小。


《写给大家看的设计书》一书中“设计四原则”之一,四原则分为 亲密性、对齐、重复、对比。亲密性:彼此相关的项应当靠近,归组在一起。如果多个项相互之间存在很近的亲密性,它们就会成为一个视觉单元,而不是多个孤立的元素。这有助于组织信息,减少混乱,为读者提供清晰的结构。


如果想使用线或框分隔内容,先尝试能否只调整间距就达到效果。有时,调整间距足以划分内容,还能使页面具有简洁的视觉效果。


留白,已经成为一门学问,做好合适的留白也是一件极具技巧性的事情。


--------------------------------------------------------------------------------------------------


在同一页面内,避免使用红蓝或红绿搭配。红色背景上不要使用蓝色或绿色文字,蓝色背景上不要使用红色或绿色文字。


红、绿、蓝 为色彩三原色。


设计配色方案时,请考虑使用所有人都能正常识别的颜色,如不同色度的褐色和黄色。避免使用红色、蓝色、绿色。


如果使用颜色来代表特定含义(如绿色代表需要紧急处理的东西),应该同时使用另一种区分方案(需要紧急处理的东西不但应该设为绿色,还要在周围加上方框)。


谨慎选用颜色,多考虑色彩可能具有的含义。为多国设计时,请找出你的设计可能涉及的几大文化或国家,避免出现不当的理解。


需要读一下《每天懂一点色彩心理学》这本书。

评论

© Niki Design | Powered by LOFTER