• 热门专题

建立设计体系规范之色彩篇

作者:wy  发布日期:2019-01-14 08:42:00
  •   在设计理念中最重要的就是色彩,一个好看的版面能给我们带来多大的起手,色彩不仅仅只局限于彩色丰富鲜艳等,还有一个很重要的关键那就是阴影,阴影是立体感的展现,是一个心情的释放,以下文章我们就来学习一下设计的色彩和阴影。

      在开始设计组件之前,我们需要为这些组件奠定基础。我们需要把产品分解成最基本的形式。

      即使是最简单的标题组件,它是多个可重用的风格的集合…

      我们需要打破思维直到我们到达最低点:最基本的风格。一个很好的起点是建立CSS样式属性。大多数的这些属性只能设置固定值,这样可以重用在每一个网站上。设置特定的属性值是最终会将我们的产品与其他产品区分开来。这些自定义值将定义我们全球化风格模式。我们的风格模式是我们将使用在设计和建造我们产品的每一个方面。

      当我们完成设计时,每一个风格都存在于我们的产品预定义的全球化风格模式中。

      让我们从最明显的样式属性入手,这是唯一一个样式属性可以用现代设计工具进行命名、存储和重用:颜色。

      我们的主要品牌色彩选择蓝色。辅色选择与其互补的:橙色。

      色彩搭配的成功与失败是一种常见的设计模式,让我们添加绿色和红色。颜色像黑色和黄色也会看起来很好。

    设计蓺喎?http://www.hxgoods.com/design/wrss/rsso=" src="http://www.hxgoods.com/uploadfile/2019/0113/20190113101305995.jpg" style="width: 614px; height: 670px;" />

      最后,我们需要一些灰色。大多数UI至少需要以下几种灰色:

      一个非常浅的灰色背景。

      一个稍暗的灰色作为边界、线条、分隔线。

      一个中度的灰色作为小标题,支持附加内容。

      一个深灰色作为主标题、内文和背景。

      当然,你可能需要更多的灰色。可能在内容上需要三个不同的色调。你可能喜欢两个不同的深度。这完全取决于你。重点是,预先确定的任何风格它们需要是可重用的在整个产品在稍后的阶段。最后一个点,我们还需要为每个颜色添加色调或阴影。这些在设计组件或者添加背景或深色线条中可能是有用的。

      阴影在UI中是另一种常用的样式属性。我们所看到的许多设计师仅仅是在设计的组件中加入阴影。这适用于大多数的样式属性。孤立地设计常常会导致不一致的用户界面。

      让我们退一步想想到底想要实现怎样的阴影。我们显然试图在UI中添加了一些阴影,但很可能许多组件可以受益于同样的效果。所以让我们从风格模式中分离出单个组件的样式。

      这四个阴影样式应该足以满足系统中的每个组件:

      一个淡淡的阴影用来表示交互式的组件。

      一个稍明显的阴影表示悬停效果。

      很大很深的阴影用于视角的下拉/弹窗和其他类似的组件。

      一个长阴影表示模态组件。

      我们描述了色彩和阴影在设计上的适用性,我们还解析了利用色彩和阴影能怎样的把设计感推到最高处,这些看似很小的设计理论对于设计来说是一个非常大的进步历程。想要学好怎样把设计感的美观放大,先从最简单的开始。

延伸阅读:

About IT165 - 广告服务 - 隐私声明 - 版权申明 - 免责条款 - 网站地图 - 网友投稿 - 联系方式
本站内容来自于互联网,仅供用于网络技术学习,学习中请遵循相关法律法规
怎样玩上海快3才能赚钱秒速时时彩计划预测贵州快3必赢技巧贵州快3提前开奖软件贵州快3玩法规则吉林快3玩法诀窍秒速飞艇怎样做代理贵州快3聊天室秒速时时彩玩法诀窍秒速飞艇线路