当我们在使用 App 或系统时，经常会看到各种各样的分割线设计。然而，对于设计新手来说，在处理分割线的样式时常常会感到困惑 - 是用线还是留白？还是投影？本文将对设计中的分割类型进行系统性研究,并分享如何更好地运用设计分割,希望对大家有所启示。

一、分割线的作用

分割顾名思义就是在设计时将页面划分的手法,其目的是让设计更有条理,使不同内容在页面中呈现的方式更容易让用户理解。这是一种帮助内容组织的重要方式。

分割可以采用多种形式,如色彩、线条、间距、投影、图标、图文等。接下来我们将系统地研究分割在设计中的应用,以及何时使用何种分割方式最合理。

二、用线进行分隔

水平分割线是最常见的页面分割手法,除了分割内容,还能起到分组的作用。比如在 Airbnb 和 Dropbox 的设计中,分割线被用来分割内容,让页面阅读更加有节奏。

需要注意的是,分割线的颜色不宜过深,否则会给人一种山寨感。常见的做法是使用 #CCCCCC、#EEEEEE 或黑色 10% 透明度的分割线。

三、用色块分割

除了线条,色块分割也是常见的方式,通常使用 20px 高度左右的灰色块来分割上下两组内容。这种方式可以让页面模块更加清晰,如华尔街新闻 App 和谷歌浏览器的设计。

但这种方式也存在缺点,就是会给人一种较为陈旧的感觉,不太符合当下轻量化、留白设计的趋势。

四、用图标进行分割

在列表类信息流中,可以在内容前添加适当的图标来锚定整个页面,让设计看起来更有空间感和秩序感。谷歌系列产品中广泛采用这种方式。

五、用留白进行分隔

与传统的线条、色块、图标分割相比,利用留白进行分割能够消除页面上的视觉噪音,让内容本身更加突出。这种方式在当下设计趋势中越来越流行,如MUST社交电影软件和Artsy艺术电商网站的设计。

六、用色彩进行分割

色彩也可以作为分割手法,恰当运用可以吸引用户关注,同时也能很好地区分内容和模块,如Headspace和Stadium live产品。但需要注意色彩不能过于花哨,最终还是要让用户关注内容本身。

七、用投影做分割

投影是一种很好的增强页面层次感和细节的手法,Google、苹果新闻和Instacart都广泛采用这种方式进行内容分割。

八、行业趋势

综上所述,总结来说,曲线、留白和投影是当前移动端设计的一个大的趋势方向,值得我们多加关注。

九、最后

设计没有标准答案,更多需要我们根据具体场景进行定义和尝试。希望通过本文的分享,能够帮助大家打开系统思考,在实际运用时做出更好的选择。

*本文作者：Sky,微信公众号：我们的设计日记（ID：helloskys），人人都是产品经理专栏作者*