项目中的设计心理学

By heiry on 2017-10-19 [ in 设计 ]

原文作者: zlipy

原文出处:http://www.zcool.com.cn/article/ZNDM1NTky.html

———————————————————————————————————————-

结合自己的实际工作项目分享出的《设计师要懂心理学》;希望对大家有帮助

1、贯穿整个项目的设计思维(UE、UI必看)、本人亲测用心理学做金融设计网站改版
2、分析人的心理活动、记忆、思考、行为、感知、决策从而协助到大家的工作中来

3ece57e4a2a20000018c1b630608.jpg

这本书给我的启发很大~影响了我做对产品的思考;特写写文章与酷友共赏

此内容是根据自己的在工作中实际运用的思维;想获取我全部的文章总结;我已经附上了自己的压缩包(书籍、图片、源文章的总结)可以供大家下载;但是你必须要下载思维导图;我的格式为xmind;不想下载我也导出为图片格式可以供大家观看

1、卡尼萨三角

首先,说说我们眼睛在观察时的一点习惯。当我们观察周围的一切时,眼睛会将看到的信息传输给大脑,大脑再对信息进行处理,让我们感受到真实的世界。但其实不然,脑见并非眼见,因为大脑总会解析眼睛看到的所有信息。

(更多…)

>> 阅读全文  >>

版式图片运用技巧

By heiry on 2017-10-17 [ in 设计 ]

原文作者:风的诗人

文章转自:http://www.zcool.com.cn/article/ZNTU2NzMy.html

——————————————————————————————-

undefined
(更多…)

>> 阅读全文  >>

“触动人心的设计”的方法研究

By heiry on 2017-10-17 [ in 设计 ]

原文作者: 阿里 B2B_UED团队

原文标题:《“触动人心的设计”方法初步探究》

————————————————————————————-

用户体验设计的精髓,在于恰到好处的设计出最合适的用户场景体验,而这种体验是不知不觉给予用户同时能让用户在触点的那个瞬间怦然心动,那如何让用户心动呢?

古人云:“动人心者,莫先乎情。”,同样的我们从约翰.奈斯比特的语言中窥见:”无论何处都需要高补偿的情感,社会中高技术的越多,我们就越渴望高情感的环境,用设计软性的一面来平衡技术硬的一面。设计作为人的创造性活动,不是摒除激情或者情感,而是要创造一种中性的、能容纳和激起使用者情感的东西,这种东西是一种境界。”

因此,我们1688UED在2014年组建了人文情怀课题研究小组专门来探讨如何进行“触动人心的设计”,课题研究的范围从马斯诺需求到各种效应理论以及设计心理学,大家在浩瀚的知识学说中徜徉,并不断碰撞产生了各种的灵感火花,最后得到了一个关于“DesignO2O”的设计思路以及“CORE”的方法模型,同时找到了如何验证我们“触动人心的设计”是否有效方法。

DesignO2O这个思路是由课题小组不离同学提出的也是我们整个设计方法的理论基石。(见下图)

人的大脑是个超级存储器,总是通过五感接受信息,被大脑识记,并且保存在记忆当中,五感由于我们是从事互联网设计行业,都是偏电脑页面的一些设计,所以主要能发挥的是视觉和听觉,线下某些实物的工业设计还会有嗅觉,味觉,触觉等等。图中的“识记-保存-重现”是人类记忆的主要过程,重现包括回忆和再认两个环节,我们这里提到的主要是指回忆,是在一定诱因的作用下,过去经历的事物在头脑中的再现过程。拥有记忆的人通过看见了一些事物或者听见了某些信息,和大脑保存的过去进行了重合配对,唤醒了记忆,那些画面会被重现,在这个过程中你的大脑已经不知不觉中招了、被刺激了,重现的画面在你的脑海里久久不能离去,以至于让你做出一些意想不到的事,就是我们说的情绪行为,以我们自身为例,影响的就是购买决策,在我们的平台上就有一群这样的用户,人称“月光族,剁手党”…所以我们发现对于一个完全没有记忆的人来说,其实是很难触动情感的。通过大量的案例收集和讨论给这样的方式在设计中的运用总结为“DESIGNO2O”,offline2online,就是刚才所说的过程,这个过程转化为设计就是把线下的场景或者人物或者事件等等还原到我们的设计中,公式就是要简单好记,才能被广泛引用,这也是O2O业务模式的设计延伸,也同样印证了一句哲学思想:everything is connected。万事万物都是互相联系的。 (更多…)

>> 阅读全文  >>

设计中的视觉误差

By heiry on 2017-10-15 [ in 设计 ]

转自:http://www.shejidaren.com/ui-shi-jie-wu-cha.html

1. 物理尺寸与视觉尺寸

长宽 400px 的正方形与长宽 400px 的圆形哪一个更大?假如这样问你的话,那么正确答案当然是一样大。但是来看看下面这张图,长宽各 400px 的两个图形看起来并不一样大。你的眼睛告诉你 400px 的正方形比 400px 的圆形更大一些。物体的物理尺寸是一样的,但视觉尺寸却有可能不一样的。

为了更加准确地证明这个现象的存在,下面这张图给出辅助线,大家好好看看。

我们改变一下圆形的尺寸,看看现在这两个图形的视觉尺寸有没有更接近一些?

每个人的感官可能都不一样,但对于我来说,调整尺寸的后的两个图形看起来才是一样大的,至少也不会像图一一样,让人第一眼就认为正方形比较大。为啥会这样?因为我将圆的直径增加了 50px。

现在我们将图形都叠起来看,看看为什么会产生这种那么明显的误差。400px 的两个图形叠在一起,你会发现整个圆形都被包裹在了正方形之内,而正方形多出的四个面积巨大的 a 区域就是造成这种视觉误差的原因。再将 400px 的正方形与 450px 的圆形叠在一起,正方形无法将整个圆形包裹在内了,圆形超出的四个 b 区域又与 正方形多出来的 a 区域在视觉上互相抵消,所以 450px 的圆形与 400px 的正方形在视觉尺寸上更接近,也就是我们常说的“一样大”。

不仅是圆与方,所有的图形都能够造成这样的偏差。当我们追求“看起来一样大”这个目标的时候,某些形状的物理尺寸应该更大一些。

这个现象对于界面造成的设计会有哪一些呢?譬如说,当绘制一套 icon 的时候,我们当然是追求每个 icon 都看起来一样大对吧?但假如我们只通过物理尺寸来进行量度的画,画出来的 icon 必然会个大个小,乌七八糟,更伤的是,这种问题经常发生,手机里随便打开个 app 都能发现这样的问题。
(更多…)

>> 阅读全文  >>

文字版式的深层理解

By heiry on 2017-08-21 [ in 设计 ]
>> 阅读全文  >>

透视网易UI设计规范

By heiry on 2016-10-21 [ in 设计 ]

原文作者:网易UEDC / 吴良

一、设计规范有什么用?

设计规范能为团队解决不少问题,并提升工作效率,主要体现在以下三个方面:

1、解决多人协作时控件混乱问题

wyued201607182

一个大型项目的视觉稿,往往会有几十个甚至是上百个页面。对于第一次做这种大项目的设计师,如果在视觉风格成型后没有做规范的话,哪怕自己一手包办全部页面,恐怕也很难统一视觉样式。在创作阶段设计其他页面时,如果没有规范来指导,设计过程中很容易产生细微的出入,导致每个控件都会有细微的差别,经常会做着做着就出现控件不一致的问题,比如A页面的按钮是4PX圆角,B页面的按钮又做成了6PX圆角,再后来做的C页面的按钮又做成了2PX圆角。如果一直埋头苦干赶页面,没检查出这些问题,页面做的越多错误就越多,到时候几十个页面的控件都要修改,那可真是苦不堪言啊。 (更多…)

>> 阅读全文  >>

360安全卫士11.0背后的UI设计思路

By heiry on 2016-10-21 [ in 设计 ]

原文来源:https://www.zcool.com.cn/work/ZMTgwNzgzMzY=.html   作者:TAD360

转眼间360安全卫士已经陪伴我们走过了10余年,这10年,安全卫士经历了多次的改版设计,就在今年年初的时候我们团队正式接手安全卫士11的改版设计需求,在这之前我们并没有参与过安全卫士相关的设计,而安全卫士是一个服务超过13亿用户的安全产品,毫无疑问这对我们来说这是一个新的挑战。在设计开始前期,我们在一起研究了之前所有版本的界面设计,总结出每个版本的优点和缺点,并对每一步操作流程都做了详细的了解,之后我们在界面布局、功能设置和视觉展示等一些方面,进行了很多种方案的设计尝试,不断改进优化调整,希望经过我们的努力能使安全卫士11成为一个经典版本。下面跟大家分享一下我们的设计思路。

360安全卫士11.0官网 http://www.360.cn/weishi/

>> 阅读全文  >>


© 2009-2024 MOSANG.NET DESIGNED BY HEIRY