80%设计师设计平庸？掌握这3个方向，破局UI版式设计

每次着手进行原型设计时，往往缺乏灵感；而完成的设计要么缺乏个性，要么显得平淡无奇，究竟该如何打破这种局面呢？

众多设计师中，有八成正面临这样的境遇，精心设计的用户界面布局难道真的那么难以实现吗？显然，答案并非如此。

若大家时常留意那些前沿的设计作品与设计理念，便会察觉到，他人的设计其实并未运用什么特别高超的技巧，仅仅是采用了常规的排版，却同样能展现出强烈的视觉设计感。

他们到底怎么做到的？

接下来，我将为你详细剖析三个不同的层面，特别是第二个方面，学习起来相对轻松；然而，往往越是简单的事物，越容易被人忽视。

一、图文序列

创新设计的图形与文字版式组合，构建出直观的几何序列或矩阵，以此显著提升设计版式的视觉冲击力。

诸如我们日常所见的几何线条排列、以及几何块面排列、还有点阵几何排列。

众多人言，此类知识我早已熟悉，然而，创意的源泉究竟在何处？在进行UI设计工作时，我们并不仅限于本领域的参考资料。

例如，我们不妨去欣赏平面设计、品牌形象、建筑风格、装置艺术作品、概念艺术创作、街头艺术表现以及建筑艺术风格。

来看个例子，下面这张平面海报的设计。

将图像与文字交织融合进行排版，此举显著提升了版面的艺术效果和布局美感，这种设计理念同样适用于用户界面设计之中。

此设计方法的特点包括：巧妙融合、几何排列、层叠结构以及反复运用。

下面，我们看几个案例。

频繁运用几何线条的排列组合，既有效地区分了信息的不同层级，又显著提升了版面的视觉效果。

重复几何序列矩阵，叠加，重复切割。

Nike Run Club

二、比大更大

大小对比，我们从学设计时，就已经知道了，但就是用不好。

大家通常会将大小对比视为一种放大或缩小两者间差异的做法，但这种看法仅对了一半。

为了深刻领会大小之间的对比，我们必须追求更大的尺寸，甚至还要更加夸张，从而创造出显著的差异。

Short Waves Festival

Tech Central

杂志的设计，相信大家都有所了解。这类周刊之所以版式和设计都颇具吸引力，关键在于其大胆的设计风格。

例如，偏好采用较大字号进行排版，这种方式能够增强信息的直观性和易于理解性，在视觉上营造出鲜明的对比效果，激发人们的思考。

下面，我们来看看在UI中的应用案例。

分离派

上图网页UI设计，有了大字号数字排版，这个页面才有了灵魂。

Tech Central

三、强化负空间

负空间同样能够营造出设计感，提升界面的版式质感。那么，我们该如何有效地利用负空间，以增强设计版式的美感呢？

首先需明确，负空间指的是空白部分，而拓展负空间的使用，实际上是在提升空白区域的占比，从而使页面显得更加生动，充满活力。

苹果官方网站巧妙地运用了丰富的负空间设计，营造出一种高端的视觉体验，其版面设计简约却又不失精致。

Enabling EV

下面看几个应用案例。

Upwork

在APP界面布局上，增加负空间的应用，以此打造出更多的设计空白，进而增强版式的层次感。

四、最后

版式构成了设计的基础要素，无论是平面设计、品牌包装还是海报运营等领域，都离不开优秀的版式设计。在用户界面（UI）设计领域，这一点同样适用。

在日常工作中，我们创作的UI界面要么显得平淡无奇，要么趋于雷同。究其原因，主要在于我们的思维受到局限，未能充分拓展。

我们可以从多个角度寻求灵感的来源，广泛涉猎不同领域，借鉴其他设计领域的经验，这正是本文的核心所在。

例如，借鉴自平面设计或品牌形象的版式元素，进而内化吸收，通过不断尝试与探索，这些元素便能在你的界面设计中得到创新应用，从而催生设计上的革新。

#专栏作家#

Tony，担任微信公众号“功夫体验设计”的专栏作家，同时也是人人都是产品经理专栏的撰稿人。作为百度视觉体验设计师，他始终致力于原创内容的创作，并乐于伸出援手指导新人。他在作品集辅导、笔试题目解答、UI视觉创意设计以及设计趋势与风格把握等方面具有丰富的经验和独到的见解。

继续浏览有关 UI设计版式创新 的文章