方框方形元素,经常运用于网页中的各大板块,它们能够有效的将网页中的元素变得条理清晰等,那么我们来看看下面一些案例是如何巧妙的运用方框。学会了怎么灵活运用方框,也可以体现不一样的美。
【 tulaoshi.com - 网页设计 】
方框方形元素,经常运用于网页中的各大板块,它们能够有效的将网页中的元素变得条理清晰等,那么我们来看看下面一些案例是如何巧妙的运用方框。
下面一个旅行网页。整个网站用了大面积的方形元素,利用这些方形的大小和改变长宽比例来错列排版,使得整个网页信息分类明确,节奏感十足。
一些商城网站也融入了方形的元素,有效的管理和整合了各类商品信息,同时也利于网站适配不同端口设备展示。
网页中常见的按钮,其实近几年开始流行的幽灵按钮(透明按钮)就是大量借鉴了方框元素,当然实心按钮也采用了方形元素。下面我们来看下运用了这些元素的案列。
下面整个网页色调明亮清新,除了渐变的背景就是内容。高饱和度的蓝色背景里有点状的世界地图作为纹理点缀,使之不显得单调。大小错落的内容靠左对齐,下面设计师在按钮上利用了框型的元素设计了幽灵按钮,使得整个文字内容搭配更加通透。
现在越来越多的方框/方形元素出现在网站图片中,下面案例是一个标准的图文结合的设计案例,设计师为了让图片和文案左右两边的视觉平衡,于是加入了方框/方形的元素与图片进行结合。瞬间整个画面变的富有设计感起来了。
复杂的文案排版起来单调,过于平淡,无层次感?哪么我们来看看方框/方形是如何解决这些问题的。
下面案例中,设计师在这段文案进行设计排版的时候,如果素材有限不能放图片,如何才能让它们变得富有设计感,左右平衡呢?于是设计师将左边的文字与方框元素结合起来,轻松的解决了这个问题。
下面案例中,banner中的文案只有一句话,搭配其他产品。设计师利用方框元素,将分散的文字变成了整体,所以使瓶子靠在文字上,给人更安全稳定的感觉。
方框方形的元素如果放在VI 中结合,是不是很有趣~
以下是1+手机的Logo ,通过结合了方框的一部分,两边的线条将用户的视觉引导至+的图形上去,即使在不了解这个品牌的用户 也能够快速的阅读了解这是1+(个人见解)。搭配整个画面,大量的留白,左上-右下的视觉定律,让画面变得简约而不简单。
这类元素往往结合文案一起展示,主要通过方框的线条将用户的视觉中心指引到作者想要表达的内容。更多网页设计信息请看:网页设计方形元素有什么作用?色彩对比有血有肉
来源:http://www.tulaoshi.com/n/20170223/2614338.html
看过《网页设计中方框元素的应用 摆脱呆板方形也能美》的人还看了以下文章 更多>>