[@飞屋睿UIdesign][3] :春暖花开的季节里,也许很多人已经谋划了丰富多彩的出游计划。就在饱览春光之余,你是否也想过拿那些放在电脑里,一年也懒得再打开看过一次的风景图再重新利用起来作为设计的素材呢?下面这以[自然风景][4][大图][5]为背景的[网页设计][6],看看他们是怎样利用自然风光来演绎自己的品牌?什么样的组织机构会用上这类设计?

在我看来,风景图是最易觅得的图片。很多人觉得美则美矣但很难与品牌形象关联起来,就像糖水片一样,让人觉得温情脉脉但总是缺点Powerful的东西。如果你还像我曾经这样幼稚妄想的话,现在是时候改变一下了。当然,蓝天白云是真的被炒了很多次的家常便饭,除了肚饿时,要做得好吃到哭泣也相当不容易,但是,我们仍然要对生活怀有遇见意外惊喜的神秘期待。

#### **[Marktplatznatur][7]**

![][8]

春光明媚搭配人物场景,一个精油护肤品的品牌,让物质与精神生活联系了起来。

#### **[Uni-sapon][9]**

![][10]

同样是日用品的官网,采用了浓密树荫的意向,在背景图上叠以文字。主色与图片色撞色搭配,显得生机勃勃。

#### **[Hogeveluwe][11]**

![][12]

一个国外公园的官方网站,首页采用了公园里一群少年出游公园的场景。对于很多以风景名胜为主题的网站,可以考虑采用这类加以现实人物的生活照为[大图][5]的背景,这也许比单单使用风景图来得更有感染力。

#### **[Hotelesencia][13]**

![][14]

一个酒店的网站,首页使用的是手绘式的风景图片,这是个很特殊的例子。采用手绘风格的时候,让人感觉更温暖。

#### **[Baskgilimeno][15]**

![][16]

同样以景区作为主题的网站,以风景为背景搭配文字介绍,这已经是一经典配置。当然,对风景的角度选取要尽量标新立异,比如这个案例里选用高空鸟瞰的角度,和清澈海滩的海浪作为背景。

#### **[Oneabode][17]**

![][18]

一个专业提供花园景观设计的服务机构,运用了花草作为背景,背景图展现一种由远及近的动态效果,让人身临其境。文字等其他元素保持简洁清爽,突出信息和品牌特点。

#### **[Flyjetedge][19]**

![][20]

一个提供私家飞行定制服务的机构,选用的在飞机上鸟瞰到风光的视角作为网站的大图背景,为用户带来真实的感官体验。

#### **[Webarts][21]**

![][22]

为企业提供品牌创意设计的服务机构也可以选用这类更加新颖的视角作为网站的大图背景,让一群员工在森林里聚会,这本身传递出了一种讯号,这个讯号是想告诉用户他们的团队的工作状态。

#### **[Childrens2012][23]**

![][24]

美国一个州的政府机构,为儿童提供医疗保健的社会服务。网站的首页选用一个在青草地上仰卧的小女孩的侧脸,寓意丰富,场景感染力很强。

#### **[Mainequarterly][25]**

![][26]

以缅因州的人文和自然风情为主题的网站,吸引游客,更多是推广自己的品牌理念。采用[自然风景][4]主题,相应将色系调至暗淡,主要在于突出文字。

#### **[Anotherescape][27]**

![][28]

这是我比较喜欢的一个网站,网站本身也是一个阅读杂志,将生活用一种有趣的方式记录下来,分享给大家。选用的风景照,志在形成一种对“逃离”和“叛逆”的向往。

#### **[Mc3][29]**

![][30]

虽然是开发网站和APP的所谓“网络科技公司”,但他们也大胆地使用了和科技看上去毫无关联的群山和天空的图片作为网页的大图背景,而又加上线条作为背景,和一个动画的仿佛正在转动的仪表盘一样的LOGO设计,为网站增加了部分科技感。

#### **[Lula][31]**

![][32]

手工饰品设计的网站,和时尚似乎有着某种联系。将模特放置于明媚风光里,作为幻灯片展示,而不是直接使用产品。这样传递的信息似乎更多,也更加平易近人。

#### **[Milescalder][33]**

![][34]

乐队的网站选用一张安静的风景图作为首页,在此展示音乐的精神。

#### **[Agrivault][35]**

![][36]

一个以售卖企业内部系统软件的公司,他们选用一片乡间小路作为背景大图,搭配了相称的文字。

#### **[Frank bow][37]**

![][38]

摄影师运用风景图作为网站的大图背景真的再贴切不过,而对风景图也大有玄机。这里选用了山间云雾,经过调色,美得窒息。

[0]: http://www.uisdc.com/author/cyrotel
[1]: http://www.uisdc.com/category/site-recommend
[2]: http://image.uisdc.com/wp-content/uploads/2015/08/scenery-background-website-design-1.jpg
[3]: http://weibo.com/u/5015930794
[4]: http://www.uisdc.com/tag/%25e8%2587%25aa%25e7%2584%25b6%25e9%25a3%258e%25e6%2599%25af
[5]: http://www.uisdc.com/tag/%25e5%25a4%25a7%25e5%259b%25be
[6]: http://www.uisdc.com/tag/%25e7%25bd%2591%25e9%25a1%25b5%25e8%25ae%25be%25e8%25ae%25a1
[7]: https://marktplatznatur.com/
[8]: http://image.uisdc.com/wp-content/uploads/2015/08/ifeiwulog150318-01.png
[9]: http://www.uni-sapon.com/
[10]: http://image.uisdc.com/wp-content/uploads/2015/08/ifeiwulog150318-02.jpg
[11]: https://www.hogeveluwe.nl/en
[12]: http://image.uisdc.com/wp-content/uploads/2015/08/ifeiwulog150318-03.png
[13]: http://hotelesencia.com/
[14]: http://image.uisdc.com/wp-content/uploads/2015/08/ifeiwulog150318-04.png
[15]: http://www.baskgilimeno.com/
[16]: http://image.uisdc.com/wp-content/uploads/2015/08/ifeiwulog150318-05.png
[17]: http://www.oneabode.com/
[18]: http://image.uisdc.com/wp-content/uploads/2015/08/ifeiwulog150318-06.png
[19]: http://www.flyjetedge.com/
[20]: http://image.uisdc.com/wp-content/uploads/2015/08/ifeiwulog150318-07.png
[21]: http://webarts.agency/#1
[22]: http://image.uisdc.com/wp-content/uploads/2015/08/ifeiwulog150318-08.png
[23]: http://childrens2012.org/
[24]: http://image.uisdc.com/wp-content/uploads/2015/08/ifeiwulog150318-09.png
[25]: http://mainequarterly.com/
[26]: http://image.uisdc.com/wp-content/uploads/2015/08/ifeiwulog150318-10.png
[27]: http://anotherescape.com/
[28]: http://image.uisdc.com/wp-content/uploads/2015/08/ifeiwulog150318-11.png
[29]: http://mc3.com.au/
[30]: http://image.uisdc.com/wp-content/uploads/2015/08/ifeiwulog150318-12.png
[31]: http://luladesigns.com/
[32]: http://image.uisdc.com/wp-content/uploads/2015/08/ifeiwulog150318-13.png
[33]: http://milescalder.com/
[34]: http://image.uisdc.com/wp-content/uploads/2015/08/ifeiwulog150318-14.png
[35]: http://www.agrivault.com/
[36]: http://image.uisdc.com/wp-content/uploads/2015/08/ifeiwulog150318-15.png
[37]: http://bow2.themesawesome.com/
[38]: http://image.uisdc.com/wp-content/uploads/2015/08/ifeiwulog150318-16.png
[39]: http://www.uisdc.com/ai-lowpoly-background
[40]: http://www.uisdc.com/designer-hd-image-favorites
[41]: http://www.uisdc.com/use-picture-create-swatches
[42]: http://www.uisdc.com/
[43]: http://hao.uisdc.com/book/
[44]: http://e.weibo.com/uidesign/
[45]: http://hao.uisdc.com