破形设计通常会利用新的图形、纹样、文字、颜色等等设计元素来进行解构重组升级,让原本呆板、固化的设计变得更加具有美感和差异度。
通过破形的设计,可以大大提升设计排版的设计感,通过对核心元素的强调、突出、衔接、切割等技法,让原本比较常规、固化、死板的画面变得具有活力和新鲜感。
翻了下国内外的设计网站之后,给大家梳理了以下 7 种常见的破形设计手法。
在一些游戏类的设计中,通常会结合角色 IP 来进行破形处理,比如说下面这些案例,就是利用角色和背景底色互动的特点,让选中的角色进行了凸起设计,来强调当前的角色。




比如下面的这些案例,就是利用 UI 结构切割进行破形,来突出核心的操作或者内容,让原本比较沉闷的方格子设计,变得更加具有设计感和几何结构感。


这种方式通常是在不破坏原有 UI 组合结构的情况下进行设计,通过背景与前景元素的错位来营造破形的空间感和层次感,这种类型与第一种方式一样,都是为了强调主体,主要差异点在于表现的手法,第一种类型更依赖于设计的整体性,这种则更强调主体的突出性。


这种方式也比较常见,通常在底部导航的设计或者整个界面具备核心重要的操作时,会通过骑缝的设计方式来对原本完整的界面结构进行破形设计处理,强调了主操作之余也增加了结构的装饰性设计。图片



在设计一些长网页的时候,通常会在上下屏衔接的时候,利用角色或者部分视觉元素来进行上下的破形衔接,可以通过一些简单的元素进行上下衔接或者空间扩展的视觉变化,来突破原本固定化的视觉画面感,让整体的画面更加具有张力,同时增加画面阅读的延伸感。



利用文字元素,通过侵入、遮挡、嵌入等方式进行破形设计,常见于一些标题的设计时可以利用文字的延展性来加强画面的视觉延伸,提升了文字和场景的层次感和空间感。




在同一组元素或者同一个模块的元素内,通过上下左右的视觉错位来打破原有的固定结构造型,让整体的设计变得更加具有排版的节奏感,提升画面的视觉张力和设计感。




如果你在设计排版的时候没有特别好的灵感,不敢尝试下破形的设计方法来提升下你的画面张力,通过破形的设计可以让原本呆板的设计变得更加具有生命力和设计感。
7种手法中,你认为哪种最易出效果?留言分享你的实战经验!
转载自:https://www.uisdc.com/breakmold-design