联系我们
15608181518    18683438262
欢迎进入德天信科技(服务区域:贵阳、成都、重庆)
网站/微信/小程序/APP
1500+客户一致的选择
炫酷生动的循环视频背景网页设计实战
日期:2018-04-10 17:39:00

循环(Loop)是现代浏览器中HTML5视频标签下的布尔属性,包括IE9在内的主流浏览器都支持这一属性。它能让一个或者一系列视频短片循环播放。开发者社区中,网页设计师非常青睐这一功能,并且截至目前影响了许多项目,让网站看起来更加绚丽和精彩。

 

从作品展示类的网站到移动端的专题页,循环视频背景的运用范畴非常广泛。网页开发者们将5~10的视频作为背景循环播放,而视频内容通常会展现出某个主题,或者有目的性地展现达成某个目标的过程,呈现企业或者团队的潜在实力。这种展现方式比起传统的网页设计手法,更能挑起用户的兴趣,引人注意,丰富的信息量和多变的内容会让整体的用户体验再上一级台阶。虽然这些视频拍摄起来非常的费神费力,也许你需要趴在地上拍摄一些场景,但是当网站出来之后,你会发现这些努力都是值得的。

 

如果你还是下不了决心,那么一起来看看下面这些优秀的网页设计作品吧。克服重重障碍制作出的循环动态背景是如何震撼人心的。

 

Haigh and Hastings

 

 

拥有介绍功能的循环视频和看起来优雅简约的导航结合到一起,其他产品则使用了高清图片作为背景,同样起到了卓有成效的导航作用。

 

Webgriffe

 

 

Webgriffe 使用循环视频来支撑他们的品牌形象,一系列精心拍摄的短视频被剪辑成短短的十几秒,不仅介绍了品牌的特色,还用到位的拍摄手法营造出令人难忘的场景,循环播放给用户强化品牌印象。视频当中还通过一组工作流程的展示来呈现了他们的专业性。

 

Spacejunk

 

 

从视频的第一秒开始,Spacejunk 就将这个品牌独特的印记印在用户心头,独一无二的视觉设计和精致入微的视频图像令人流连忘返。专业的设计和强大的执行性配合着循环播放,循环视频的作用机会被他们运用到了极致。

 

Eva

 

毫无疑问这个充满吸引力着陆页是通过循环视频来营造出充满吸引力的界面的。设计师明智地将界面划分为三个部分,在视觉上营造出趣味性和娱乐性,最后又落脚在工作流上。

 

Newrow

 

 

这里的循环视频被用作鼓励那些热爱生活的人,循环播放的视频内容被划分为两个部分,创造性地展示了两种生活方式的差异。

 

Gracepoint

 

 

Gsacepoint 是一个典型的单页网站,它主要的功能是引导用户关注Fox电视台的罪案剧。设计巧妙地通过三个子页面和风格阴郁的循环视频背景来营造出阴谋的氛围。

 

Pastamancini

 

 

多亏了这组壮观的风景视频和田园风光的特写,Pastamancini 网站充满了活力和自然的氛围,页面中其他的元素也很好地呼应了这部分内容。

 

Dalbello

 

 

充满了活力的雪山场景和运动的氛围被几个短视频完全展现了出来,为了烘托出视频内容,网页在配色和视觉元素的选取上也独具匠心,烘托出了雪山和运动的主题。