让扁平的网页更出彩-师哥做设计第9期

leagueoflegends

helmade

剑侠世界

尼桑汽车

秒传互动

 

穿越火线（片段）

 

电商活动广告

  

各公司LOGO+活动

 

GIF加载图+动态二维码

QQ浏览器

安踏活动页

 

3D可以实现的功能

网站404动画

360浏览器

百度浏览器

国外酷站

国外酷站

复杂图形：在AI中绘制的复杂图像可以直接应用到网页中

绘制产品轮廓

绘制轮廓：工业产品非常适合用这种方式表现，比单纯的放置一张静态图出彩的太多

文字特效：其实原理都是一样的，但是为文字添加这种效果的话，还是非常酷炫的

阴影：当用户光标选择元素时，为该元素添加阴影效果，为用户提供更明确的指示，而且添加阴影后增加了层次感，让扁平化页面不再干瘪。

阴影+位移：让元素上下或左右偏移，这种效果比单纯的添加阴影效果更明显，在网站中这种效果出现的非常多。

改变初始宽高：改变选中元素的宽高，可以让选择的元素立即脱颖而出

增大宽高

减小宽高

改变宽度

选中的元素本身不改变，改变子元素的宽高

maziri

站酷十周年活动

上面两个网页都是根据鼠标位移改变元素的位置

kikk

bersiserlini

tioluchin

根据滚动条的滚动而改变元素的位置

在国内的网站中应用的也比较多，在扁平化设计中，视觉差特效不会让扁平化页面太枯燥

有的视觉差可能是根据用户鼠标指针做变化，有的可以根据滚轮的位置来改变相应的元素，当然设计师做做设计的时候就应该考虑哪些元素要动，因此可以把这些元素单独拆分出来处理

bulan

魅族手机

很多时候想要好好的认真做一个网站，结果设计表现后，达到的效果却出奇的和之前做过的作品类似，没有创新和新意，久而久之将会把自己封闭在一个狭隘的怪圈中，每次作品都是重复同样的做法，做不出好的作品

其实这都是你对设计的认知不够，这要求我们去多看多总结，能多去认知新领域、新技术，这样才能使得你的作品更多样，思想不被禁锢，脑洞可以开的更大。