空间配色解密 - 腾讯ISUX

故事是这样的

过去空间的配色很多,每次提取确实如同解密一样的充满“惊喜”。

亮瞎眼的邻近色 相近颜色太多,差异不大,光一个灰色都有三四个,隐隐的感觉这是在做色盲测试。

设计师的痛 明明只是想要一个色值,却不得不打开差不多100M的PSD文件,去吸取颜色,去寻找颜色代码,打开时间可以看看小说了~~~

坑爹的沟通 每次找开发调整颜色,都要从界面中截图说明是跟哪里的颜色,色值多了,别说是开发,设计师都疯了!

虽然有了标注,但是还是可能遇到开发问:正文色是指什么颜色?色值是? “色无能” 害怕增加颜色,想想每个主题都增加一个配色,每次增加一个模块都需要随着主题的增长而增长,这是找死的节奏啊 我们对商城说:姐姐,不要再增加主题了,面对产品说:姐姐,不要异化模块了。 社稷师: 我本将心对颜色,谁知颜色照沟渠!趁着夜黑风高,咬咬牙,一不做二不休,不如来个“杀集取卵”~~~

其实就是合并相近的颜色,在设计的过程中,经常会遇到同一个页面出现2种或2种以上类似颜色的情况,为了规避这种情况,把相近的颜色进行“合并再调整”,选出一个更适合的颜色。

1.对不同模块的颜色进行分类,包括“文字、色块、图标、线条、按钮”等等。并规范好每个分类的名称,针对每个分类下的颜色差异使用1、2、3…的序号进行命名,例如正文色T1、辅助文字T2、高亮文字颜色T3…

2.规范好能够适配主题的几套配色,只拓展主题、不增加配色,多套主题配合一套颜色,让主题使用无极限。

让设计和开发迅速传递信息。确定好10套配色的代码,并按分类定义色值。这里每一套主题的色值可能会不一样,但是编号肯定是一致的,例如文字T1~T10、按钮B1~B5…

当你已经完成了上面所有的事情,这个时候,你只需要给到一个“txt”文档开发,就可以一键完成单套主题所有的配色调整。

开发哥调整颜色只需要更新txt文档即可,再也不用一个代码一个代码敲了,大大提高效率,同时也提高了设计同学对颜色使用的把控度。

感谢你的阅读,本文由 腾讯ISUX 版权所有,转载时请注明出处,违者必究,谢谢你的合作。 注明出处格式:腾讯ISUX (http://isux.tencent.com/colors-decryption.html)

原文发布于微信公众号 - 腾讯ISUX(tencent_isux)

原文发表时间:2015-04-20

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏MixLab科技+设计实验室

UI2Code 之 利用 antd.sketchapp 生成训练数据

封面由ARKie智能设计助手生成 Ant Design 最近发布了 antd.sketchapp : 使用 skpm 构建工具,基于 React Sketch....

3997
来自专栏CDA数据分析师

手把手教你用Python分析电影 | 以《蚁人2》为例

《蚁人2》自8月24日在中国大陆上映以来,已经有将近一个月。作为《复仇者联盟3》之后漫威出品的首部电影,《蚁人2》对漫威宇宙电影的剧情承转起着关键作用。9月20...

1292
来自专栏天天

网页图片的压缩优化

在网页建设过程中,图片的使用时必不可少的,甚至有些网站的80%~90%的部分都是图片,那么如此之多的图片怎么才能保证良好的用户体验,好的加载速度呢,其实从很多角...

1484
来自专栏区块链源码分析

用零知识证明解决投票安全

我们经常会遇到需要给别人投票的情况,比如有些公司会组织员工给领导做反向打分,但是往往员工都不敢“真心实意”的打分,为什么呢?归根结底是害怕所谓的匿名不是真匿名...

35218
来自专栏DeveWork

为你的WordPress 主题添加结构化数据/丰富文本摘要,高亮搜索结果(上)

对于SEO ,咱们这些业余人士只能是从技术的角度来驾驭。网站经营的前期需要做好搜索引擎优化,对于WordPress 网站,其实最好的方式是在WordPress ...

3116
来自专栏机器之心

教程 | 如何使用Swift在iOS 11中加入原生机器学习视觉模型

选自Hackernoon 机器之心编译 作者:Alex Wulff 参与:侯韵楚、李泽南 随着 WWDC 大会上 iOS 11 的发布,苹果终于推出了原生机器学...

3125
来自专栏数据小魔方

创意彩虹图表!

今天跟大家分享一款当前非常流行的创意彩虹图表! ▽ 这种图表其实制作起来没有任何难度,主要是使用特殊的数据展现形式以及协调匀称的配色,使得整个图表看起来非常的新...

2719
来自专栏Coding迪斯尼

VUE+WebPack精美游戏设计:实现微信红包铜钱转动特性和页面数据的本地存储

1724
来自专栏数据小魔方

R语言可视化——ggplot图表系统中的辅助线

在之前的推送中,曾经有过一篇介绍excel图表辅助线的制作方法,其中用到的技巧五花八门、令人眼花缭乱。 而ggplot图表系统中的辅助线添加起来却异常简单,非常...

37713
来自专栏何俊林

一个跑步时用的轨迹记录和计步器APP

今天推荐是一款像咕咚一样计步和轨迹记录app,作者zhenqianfan github:https://github.com/Alost/TrackPedo...

28810

扫码关注云+社区