IAMUE
  • Home
  • 文章分类
    • 交互
      • 从零开始学交互
      • IxD案例
      • 微信热点
    • UXD
    • Wireframes
    • GUID
    • PM
  • More
    • AID
    • 资源下载
    • 作品集
    • 电子书:《从零开始做交互》
    • Sketch 4.9 - Sketch全系列免费下载(更新Sketch4.9)
    • 淘宝手机H5版UX移动交互设计规范
    • Axure基础入门
    • 隐私政策

译文 | 在UX设计中利用色彩影响情绪

Catherine • 2017-05-25 22:27 • 交互设计

颜色是我们观察事物的第一认知,是最能触动我们感官的视觉元素。颜色可以激发我们的联想,刺激我们的情绪。在设计中,颜色的合理运用一直是个很重要的课题。现在就让本篇文章带你认识每种颜色的独特作用和如何运用在UX设计之中吧。

文章目录[隐藏]

  • 红色
  • 橙色
  • 黄色
  • 绿色
  • 蓝色
  • 紫色
  • 粉红色
  • 棕色
  • 黑色
  • 白色
  • 灰色
  • 结论

颜色是我们观察事物的第一认知,是最能触动我们感官的视觉元素。颜色可以激发我们的联想,刺激我们的情绪。在设计中,颜色的合理运用一直是个很重要的课题。现在就让本篇文章带你认识每种颜色的独特作用和如何运用在UX设计之中吧。

译文 | 在UX设计中利用色彩影响情绪

在现在设计中,颜色的选择在任何情况下都非常重要。在设计中,我们想通过无声无语的方式表达设计,颜色就是其中最重要的关键。

在通常情况下,不同颜色唤起不同的感情。为了让你认识到其中的奥秘,我们已经编写了一个快速参考指南,涵盖了每种颜色的独特的作用,以及如何将它运用到UX设计中。

红色

危险性,重要性,激情

在所有颜色中,其中一个表现力最强的颜色,表达战争和爱情的同时。俗话说,“看到红色”突出了愤怒的颜色。

红色元素更明显,加上一个重要的意义,无论是好的还是坏的。淡红色的图片是主题是青春和爱情的好,而暗红色强调力量和持久性,如可靠的朋友。

译文 | 在UX设计中利用色彩影响情绪

红色可以作为警戒色,如在交通灯和标志,参考已从自然,红色是作为威慑。但是,你应该小心的使用它,作为一个小走一段很长的路。这是一个伟大的颜色需要注意使用,但过量则会过于紧张。

译文 | 在UX设计中利用色彩影响情绪

最后但并不是最不重要的,红色与热的关联。

译文 | 在UX设计中利用色彩影响情绪

橙色

自信,乐观

橙红色在股票里面意味着刺激增长但是增长程度较轻。橙色可以与健康有关,如维生素C.

译文 | 在UX设计中利用色彩影响情绪

橙色是一种活泼,乐观的颜色,非常适合休闲场所,但是他不适合最要出现在企业网站中,一些研究表明,橙色给人感觉便宜或者更坏的东西。但是物业这个行业使用橙色效果是很好的方式.

译文 | 在UX设计中利用色彩影响情绪

黄色

注意,幸福

奇怪的是,黄色代表幸福与焦虑。他通常是充满活力与乐观的。但是明亮的色调会有一种强调效果,这个方式经常使用在警告标志上采用。

译文 | 在UX设计中利用色彩影响情绪

加上黑色可以获得更多关注。一个最好的例子就是设计一个出租车,通过和黄色结合,可以获得更多关注。

译文 | 在UX设计中利用色彩影响情绪

如果你使用黄色请注意下里面简单的规则:淡黄色可以让用户感觉到阳光快乐,暗色调给人感觉很严肃以及古老.

绿色

增长,自然,成功

绿色让人第一感觉关联到植物上,因为大多数植物都是绿色的,它与生长和健康有关.

译文 | 在UX设计中利用色彩影响情绪

在色彩饱和度上要注意。

译文 | 在UX设计中利用色彩影响情绪

饱和的绿色给人感觉令人兴奋和充满活力,绿色的按钮可以获得更多关注,所以一般的执行按钮都是使用绿色。

译文 | 在UX设计中利用色彩影响情绪

蓝色

信任,舒适,放松

蓝色是UI设计中的最重要的颜色之一,也是最常见的。根据对色彩和色调的改变,它可以代表不同的感情,思想和情绪。暗蓝色能给悲伤的感觉。

浅蓝色是天空和水的颜色,它可以提神,自由和平静。这种放松的友好也会转化为内在的信任,这就是为什么它是经常使用的原因.

译文 | 在UX设计中利用色彩影响情绪

并非巧合的是,两个最大的社会媒体,Facebook和twitter蓝色为核心的色彩都使用。

译文 | 在UX设计中利用色彩影响情绪

传闻:扎克伯格曾经提到,他用蓝色,因为他是色盲,所以他不能真正地看到任何其他颜色时,他设计的原创网站。

紫色

豪华、浪漫、创造力

高贵与皇室被紫色所代替。紫色暗示产品或网站比较华丽高端.

译文 | 在UX设计中利用色彩影响情绪

因为紫色周期回到红色的光谱,它有红色的激情的特点,尤其是淡如薰衣草。

译文 | 在UX设计中利用色彩影响情绪

粉红色

温柔,纯真,青春

粉红色通常是含糖的糖果色,所以颜色会有嬉闹的气氛,有点幼稚。这就是为什么你可以添加一点粉红色让用户高兴的原因。

译文 | 在UX设计中利用色彩影响情绪

粉红色并不总是意味着女性。事实上,过度使用粉红色的“女性特质”很容易激怒用户。

译文 | 在UX设计中利用色彩影响情绪

棕色

保守主义、地球、稳定

伦敦的绅士不穿棕色。同样的棕色不适合大多数网站,但对于那些比较完美的作品。棕色可以用于一个乡村,老式的感觉,完美的户外场所,甚至有机产品。木材的内涵也建议稳定性和可靠性.

译文 | 在UX设计中利用色彩影响情绪

在一般情况下,使用饱和色的棕色来作为菜单、面板和背景。

黑色

正式,权力,成熟

黑色是最强的所有颜色,它吸引的注意力比其他颜色的更快,即使是红色。这就是为什么它是最常用在文字中。当作为一个配色方案的主要组成部分,如背景、黑色比任何颜色都适合创造自己的感情。

译文 | 在UX设计中利用色彩影响情绪

结合银色或灰色,它可以代表成熟,如上面的例子:

译文 | 在UX设计中利用色彩影响情绪

白色

新鲜、健康

黑色正好是它的相反色,白色颜色普其他颜色在它的周围,使它为辅助色的首选。

译文 | 在UX设计中利用色彩影响情绪

当白色是主色,其黑色具有压倒性。如果你的白网站似乎太单一,试着白 的分支- 用象牙和奶油色组合。尝试使用色调让白色元素看起来不错。

译文 | 在UX设计中利用色彩影响情绪

灰色

形式,中立性、复杂性

灰色代表中立。如果你的网站或应用程序使用冷色,一个灰色的混合和一点冷色会补充它。如果您的网站使用暖色,一个灰色的混合和一点温暖的颜色将补充它。添加到您的灰色色调,增加色彩饱和度。

译文 | 在UX设计中利用色彩影响情绪

通过改变它的阴影,灰度可以在黑色或白色的特点。当作为一个主要的颜色,灰色给人居于形式的印象,但是这并不总是意味着坏事。Dropbox使用灰色突出按钮免费注册用户能够找到正确的按钮,真的很快。

译文 | 在UX设计中利用色彩影响情绪

您可以使用内容和相应的图像,以避免“忧郁”的感觉,通过一个元素可以给人感觉强烈关注。

译文 | 在UX设计中利用色彩影响情绪

浅灰色的颜色最适合按钮禁用(无效)状态

译文 | 在UX设计中利用色彩影响情绪

结论

正确的设计决策才是用户认为是正确的.可以通过A/B测试转换.

译文 | 在UX设计中利用色彩影响情绪

 

颜色的使用是很重要的,有时候很多情况下没有设置好通用的颜色。在一个网站或应用程序的东西,不一定适合另一个,从你的目标市场在设计过程的早期很重要。

最初发表在www.babich.biz

 

本文由 @bluelovemagic 翻译发布于人人都是产品经理。未经许可,禁止转载。

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/29773/

logoUIUI设计UXUX设计产品产品经理免费用户色彩视觉设计译文转载配色
赞 (0)
CatherineCatherine
0
生成海报
响应式网页图片库设计的九个注意事项
上一篇 2017-05-25 21:31
译文|「设计师学习商业」中「Why」与「How」的问题
下一篇 2017-05-25 23:22

相关推荐

  • 网站交互细节,打动用户还是伤害用户? 交互设计

    网站交互细节,打动用户还是伤害用户?

    细节决定成败,也许一个小小的细节,就能够让用户对你的产品情有独钟,弱水三千只取一瓢。也能够让你的用户从此陌路,再无关联。

    2017-05-30
  • 微信热点

    你真的了解交互设计吗?

    回顾2017年,我们发现交互设计受到越来越多学生的青睐,这个新型专业在国内的认知度与外国并不完全同步。为了给更多学生带来交互信息的普及,设想决定带大家预测一下在2018年,信息体验设计会如何发展、还有哪些值得我们关注的趋势。更简单的导航方式导航体验是2017年的热点话题之一。为了设计出顺畅的用户体验,导航扮演的角色至关重要。线性导航Linear Navigation为了简化导航体验,很多app和网站致力于创造线性的导航体验(即分布式),...

    2018-03-19
  • 微信热点

    上海benhealth招聘实习生 150/天

    回复「简历」,送你优秀简历模板。岗位岗位实习生岗位职责参与公司移动端、小程序以及 PC 端 Web 产品的交互设计;与产品经理和开发人员共同完成产品开发。岗位要求1. 平面、视觉传达相关专业本科或以上学历;2. 熟悉 Axure 和 Sketch 等交互设计工具;3. 热衷网络文化,熟悉网络热点和主流 App;4. 良好的沟通学习能力,工作热情高,责任感强。薪资福利150 元/天工作地点上海简历投递投递邮箱:jun.pan@benhea...

    2018-04-08
  • 微信热点

    用户体验设计与创新怎么做?首期高端讲座,听世界知名企业用户体验设计总监为你答疑

    4月28日一大早海信学院的阶梯教室就已经满!满!都!是!人你看,现场是这样的还有这样的大家聚精会神,全神贯注地在做什么?原来,咱们首期高端讲座开讲啦!大家都知道,做高质量好产品一直是咱们集团的重点战略在高端讲座的首期,我们就邀请到了世界知名企业用户体验设计总监现任韩国某体验设计公司总裁Yoo老师给大家进行分享三个小时的讲座中,Yoo老师阐明了他对用户体验设计创新的理解他提到,大部分大企业往往就问题而直接解决问题,而忽略了去进行充分调查,...

    2018-05-05
  • 几种常见移动导航模式详析 交互设计

    几种常见移动导航模式详析

    虽说一款应用的生死不是由导航决定,但毋庸置疑,导航模式的选择在产品用户体验上占有很大的比重。就导航本身来说,没有优劣之分,端看你的应用适合哪种。下面是我罗列的一些常见的移动导航模式,接下来会对其一一举例说明(注:重要模式会重点分析,其余简略,篇幅略长,不喜可跳过)

    2017-06-02
  • 实例分析:关于上传照片交互逻辑的思考 交互设计

    实例分析:关于上传照片交互逻辑的思考

    最近在重新设计公司APP上传照片的组件,研究了很多移动端上传照片的组件,下面来简单单谈谈自己的总结。

    2017-05-12
  • 微信热点

    用户体验“大不同”,合作伙伴分享会

    2018年3月15日,“用户体验“大不同”,合作伙伴分享会”在福建省科威技术发展有限公司举行。虽然屋外下了很大的雨,但也没能减小屋里同行朋友们的热情。分享会一开始,惠普华南区业务开发经理李浩泉就以十分轻松幽默的氛围,将与会者带入状态。随后介绍了页宽产品的主要特点,并对惠普A3页宽复合机作了产品推介。惠普新一代A3智能复合机页宽产品的主要特点是:最新技术(集激光/喷墨优势于一身)高速(40ppm~80ppm输出速度)经济(购买/使用/维护...

    2018-03-17
  • Apple Watch界面设计规范之UI设计基础(2/2) 交互设计

    Apple Watch界面设计规范之UI设计基础(2/2)

    六、布局 并排放置的按钮数量要控制好。当并排放置按钮时,使用图标来代替标题文案。一行不要放置3个以上,否则按钮的尺寸将会太小,很难被点到。 完整利用左右两个边缘之间的全部空间。Apple Watch的边缘斜面会在…

    2015-03-10
  • 【交互设计】入门交互设计需要注意什么

    作者:Mufly 最近一直在想,交互设计的核心是什么?因为身边不少设计师对交互设计有也兴趣,常常被问到怎么学呢?交互设计要注意什么?对于入行不久的我,如何回答这类问题成了难点,因为我怕回答得不好,误人子弟…

    交互设计 2015-07-20
  • 如何获取设计灵感?你没理解它真正的含义 交互设计

    如何获取设计灵感?你没理解它真正的含义

    今天要告诉大家的不是说怎么借鉴好的设计或者如何获取灵感,毕竟市场上好设计这么多,难道每个都去借鉴,到最后变成所谓的抄袭?我们应该站在自己产品的角度,去吸收好设计的核心点,然后找到真正解决问题的方法,而不是纯粹的“借鉴”。呆总,我平时看了不少图,但是做项目的时候没办法用上,怎么办呀?看得多没用的,要多想多做。(虽然是至理名言)

    2017-05-01
  • UED书单
  • 微信精选
  • 投稿说明
  • 赞助

Copyright © 2024 WPCOM 版权所有 粤ICP备000000000号 Powered by WordPress