UI形状和空间两者之间关系.docxVIP

UI形状和空间两者之间关系 设计就是处理形状和空间两者之间关系。为了更有效的利用空间，首先你必须意识到它，并且学会看它。就是学会如何看空间中的图形，空间的形式和空间与空间之间是如何交流的。这是初学者要学习和了解的系列设计原则的第二部分。第一部分就是之前介绍的格式塔,而剩下的文章（包括这篇）都是在格式塔原则的基础上构建的，并且表明我们设计工作中用到的所有基础原则都是有来源的。 图底关系原则 格式塔原则在空间中用得最多的就是图底关系。你设计中的所有元素都会被看作是一个图形或者是另一个背景，并且它们之间的关系实现互排斥的。两者都不会被感知的，除了涉及到另一个，并且只改变其中一个不改变另一个也是不可能的。图底关系也是互补的。图形和背景的关系可能对比强烈或是对比减弱，并且在组织这两个彼此之间的关系是设计重要的方面之一。因此设立了这么一个情景，——如何沟通你的设计和如何解读你的设计。 “白色空间被认为是一个活跃的元素，而不是一个被动呆板的背景”——Jan Tschichold 图中（从左到右）： 图1 ：等距的黑色线创建了一个灰色区域。图和背景的关系是稳定的。 图2 :?去掉空间后，图形占主导地位，并且我们看到了一个实心的黑色的区域。 图3 :?两行黑色的线被去掉后，空间变得活跃了，并且似乎位于灰色区域之上。 小编语：图片来源Alex White写的《The Elements of Graphic Design》这本书中，亚马逊有卖，大家可以购买。 考虑上面图片中的三段话。左边的，我们看到一组黑色的线，在黑色线中间是等距的白色空间。黑色线条和白色空间一起形成了一个灰色区域，每一个都对结果有影响。删除白色空间，正如第二个图一样，完全改变了区域样子，它变成了一块纯黑色的图形。不仅空间消失了，而且可视的独特的多元素变成了一个单一的元素。第三个图形，去掉了两行黑色线。这一行为激活了这个空间，使它看上去好像在灰色区域的上面。背景变成了图形并且添加了更深入的设计，丰富了设计效果。 稳定的，可逆转的，和模棱两可的图底关系。 有三种类型的图底关系： 1.稳定形（上面左图示例） 什么是图和什么是底的关系很清晰。它们其中一个会作为主导成分。 2.可逆性（上图中间的图片） 这两个图和底关系是一样的，同样吸引观众的注意力。这就创造了张力，它们中的任何一个都可以压倒对方，从而产生动力设计。 3.模棱两可暧昧的关系（上图中最右边的） 元素可以同时是图和底。它们形成同样有趣的图形，和观众在这个构成作品中会找到他们自己的切入点。 这取决于你设置的关系和你怎样去平衡图和底二者的关系，你导向观众来看设计的不同部分，并且解释在不同环境下他们看到了什么。 图和底并不是唯一一个格式塔原则在空间中扮演的重要角色，还有两个分别是： 接近原则（proximity) 接近原则是使用空间来连接元素和通过空间中闭合一些元素来分离元素。我们可能会想到的例子是页面上的文本段落。 段落与段落之间的空间大于一个段落中文本的行间距。 闭合原则（closure) 闭合原则是利用元素之间的间隙空间。观众用自己的信息来填补空白从而完成一个整体的部分。 大量的留空间和留空间太少都是闭合原则的忌讳。只有已有的空间和需要被填充的空间之间保持正确的平衡关系，才会使空间灵活并且产生闭合原则。 闭合原则 作为一个设计的元素——空间 考虑一下音乐。如果音乐中的每个音符和和弦同时出现，音乐就不会产生。你有的只是噪音。音乐是在声音和安静对比中产生的。不同的声音和静音创造出了节奏韵律和歌曲。没有安静就没有音乐。 空间在视觉上执行者同样的功能。它给元素提供呼吸的空间。通过设计它让眼睛自由移动，并且来发现它要找的元素。正形和负形形成对比。没有空间，就没有设计。你的视觉就会混乱。（也就是我们通常说的留白。） 除非噪音是你想在空间中试着用来交流的。与空间太小相比，人们不可能抱怨空间太多。 空间中可以做到以下几点： 建立对比，重点和层次； 形成戏剧性和视觉张力； （小编语：大家可以看些平面设计中视觉张力，和利用留白增强海报设计的视觉张力） 在元素与元素之间提供视觉休息的空间。 只有一些东西出现在你的空间中时，图底关系才会蕴含其中。在加入正形和空间是没有定义的。图底关系是必须建立在之前的空间的中间，是存在的并且在开始就是可交流的。一个更重要的空间功能是提高可读性和易读性。宏观的空间使文字更引人注目，微观的空间使文字更清晰易读。 微空间 这是指在一组中元素的空间。是字母之间，单词之间和段落之间的空间。 宏观的空间 这是主要元素之间的空间。它区分元素或者是元素组和提供眼睛跟随的的路径和元素之间休息的地方。 空间与品质相关。更多的空间需要更少的元素或极少的元素。比较一下高端店铺和折扣零售店。在商店里面哪一个有更多空间，哪一个利用空间中的每一个角