网页设计|15个实例分析形状在网页设计中的运用

发布时间:2017-03-31编辑发布:迪麦互动

不知道大家注意到了没有,大多数的网站或多或少都由不同大小的矩形组成。从浏览器窗口的矩形开始,这不仅是可行的,它还很有意义。然而,并不意味着就没别的形状,如:圆形、三角形、或者其它形状来表达,这里列出了15个例子,看看设计师是如何在网页设计结构中运用形状来定义的。

路线图的着陆页面充斥着各种造型的输入是矩形,为椭圆形的按钮而标识也是这样。另外,有随机的间隔和几何形状关于动画背景。这现象并不一致,趣味横生。

本年度报告不仅利用这些数字作为形状本身的数字作为关键部分的形状的附加视觉手法进行装饰,纹理和颜色。

有这么多单独形状在此着陆页面。从手机到圆形浮动标志与化身。当然,最引人注目的是三个近圆形和近方形形状的电话,不断变换它们的形状,来放大和缩小。

状态设计重度依赖于--卡片圆角,就像我说的是形状和重叠状态,利用圆形和矩形的形状来设计。


在未来的设计是网站的视觉震撼。使用形状设计作为故事的一部分滚动。各种颜色和形状与信息阅读联接起来是如此的平滑,很难想象所传递的信息,该报告看起来不同。


UI设计在移动APP上是圆角,该方形具有圆角也正是这个网页设计的重要品牌视觉设计。利用圆角图案为背景动画散射。


设计时间表大致是奇数并且改变了传统的矩形盒形状的图像和文本。

beamery肯定喜欢,虽然圆形填充或基序的概述。该标题是一个可爱的设计,利用轨道进一步扩展的隐喻。

Wyre视觉很好的运用了它的品牌标志,它是整个网站的一部分。有时它只是重复的背景,起到了装饰作用。然而,所有的按钮都是这种形状,这是我第一次看到这种类型的按钮的形状。

显然,这些都是一个形状-正方形,多重性的元素重复运用在着陆页面,让UI设计变得与众不同。


不透明性在一些微小的变化的重复形状的背景部分中最有趣和引人注目。


dilamani网站使用自己的徽标的图案的顶部和底部处的产品页面。这是个很不错的方式,使用独特的形状。


再简单的对角线创建两个背景颜色,它都可以光彩照人。不需要想太多。


我们这里有许多小点。他们都在移动,他们都是制造一个更大的形状。


lantir由不规则形状的点和线组合设计,右边圆形覆盖。又是一个美妙的背景。

在WEB设计中使用各种形状作为设计元素,从整体上完美页面设计。希望例子可以给你的设计带来创意灵感。

本文由广州网页设计、广州UI设计迪麦互动整理编辑

分享至: