![the-best-usa-websites-1][2]

美国是世界上最大的移民国家,来自全世界各地,不同肤色、不同种族、不同宗教信仰、不同文化背景的人在这里共存,这也造就了美国纷繁多样的文化现象和高度的文化包容性,同样也使得美国在设计领域有着其他国家无法比拟的创新理念,碰撞和融合下的独特美感。

虽然美国的历史相对其他的国家要短不少,但是美国的发展历程更具故事性,也是各种艺术与文化运动的温床,欧洲的现代主义、现实主义、印象主义、抽闲表现主义都在美国有着比较长足的发展(有意思的地方在于,音乐和设计领域许多东西都是欧洲萌芽,美国发展)。

丰富的文化遗产和创造的基因,使得美国的设计师为世界带来了许多优秀的设计项目。而今天在这里要展示的,就是来自美国设计师的[优秀网页设计][3]作品。

#### [Spacejunk][4]

![][5]

Spacejunk 是一个高端的设计工作室,而他们的网站也正好呈现出它们的这一特征。设计师通过一系列简短而生动的视频展示出他们最有特色,最抓人眼球的地方。此外,精致的排版和精致的字体,流畅顺滑的图形也很能体现设计师的功底。

#### [Footjoy Lookbook][6]

![][7]

有的时候,简单有序的呈现就很有力度,很明显Footjoy Lookbook 的设计师对此深有体会。将生产过程和产品的搭配通过网络呈现出来,用每一个精致的细节来为产品加分,将设计与美转化为销量。

#### [Nightcrawler Film][8]

![][9]

这是黑暗系电影《夜行者》的官方网站,将网站中阴暗的剧情呈现在网站上,简约现代的风格处理,让用户可以更加专注于视频和互动本身。

#### [Nike][10]

![][11]

作为一个顶级品牌的官方网站,Nike在设计上有着他们独有的一套东西。和往常一样,Nike的网站会使用励志的运动视频短片来呈现他们的产品和理念,老到,简单,但是很有效。

#### [Blu Homes][12]

![][13]

Blu Homes 的首页在文案设计和视觉设计之间找到了平衡点,兼顾了视觉和阅读体验。此外,自然的动效和精心选取的图片为整个网站营造出温馨的氛围。

#### [Sound City Project][14]

![][15]

声音城市是一个极具开拓性的概念,借助声音来营造氛围,为用户带来微妙而难忘的用户体验。

#### [Dropbox][16]

![][17]

著名的网盘服务Dropbox,使用了柔和扁平的配色方案,矢量插画与华丽的排版结合在一起,为用户带来可靠的功能和绝佳的体验。

#### [Demi Creative][18]

![][19]

这个网站的首页是现代创业行业在线作品展示的绝佳案例。动态的背景,精悍的视频,大胆的口号和鲜明的对比,小巧的汉堡图标隐藏了额外的功能,醒目的CTA按钮,一同构成了这个首页。

#### [Tile App][20]

![][21]

Tile APP 首页使用了另外一种独特的设计手法:使用细节丰富相对复杂的背景大图来传递信息。作为一个NFC硬件,Tile拥有对应的APP,细节翔实的背景则清晰地还原了用户的使用场景。

#### [Union][22]

![][23]

Union 的官网的设计算是比较精妙的,虽然背景也采用了相对复杂的图片,但是图片、文字以及其他的装饰元素之间的搭配对比控制的很好,有视觉重心又不会觉得有视觉干扰。

#### [Story and Heart][24]

![][25]

打一开始,网站的设计者就力图将你的吸引力引导到这个项目上去,一系列令人兴奋的励志影片,营造出充满正能量和艺术的氛围。

#### [One Design Company][26]

![][27]

单色背景,扁平化设计,这非常符合时下流行的风尚,动效也是如此,但是One Design Company的特异之处在于网页所用动效极为顺滑流畅,给人感觉无与伦比。

#### [V76][28]

![][29]

得益于栅格系统,V76的网站布局和谐而完美,漂亮而略显复古的图片以优雅的形式展现在用户面前。

#### [Kaber Technology][30]

![][31]

通过一系列精心制作的视频、图片和高还原度的原型,整个网站给人以一种强烈的技术感。

#### [Lapka BAM][32]

![][33]

Lapka BAM 是一个堪称完美的单页网站,教科书级别的产品展示,细致入微的视觉设计,360度花式引导用户买产品……

#### [Montage][34]

![][35]

在这里,扁平和拟物完美地融合到了一起,干净的设计,纯净的背景,微妙的动画,精致的图标,逼真的纹理和质感,你不会在这个网站感受到违和感。

#### [Adventure][36]

![][37]

打开网站,设计师会带你开始一场华丽的冒险。壮观的水下场景被作为视频背景,直观而真实地展现在你的眼前,漂亮的手写字体,鲜艳的图形,流畅而精心制作的导航菜单,一切都是那么漂亮。

#### [Push][38]

![][39]

通过轮播的视频和图片,设计师将整个品牌的气质渲染了出来。

#### [Breezy Excursion][40]

![][41]

这是一个独特的线上购物网站的设计方案。和其他堆砌产品的电商网站相比,它更富有活力,感觉更活泼,巧妙的视觉刺激能够更好的激发用户的购物欲望。

#### [The Capitol][42]

![][43]

设计师试图将文案和媒体都高亮突出出来,网站乍看起来简单,实则气势逼人。

## 结语

美国的设计师对于创意、技术、趋势的把控可谓细致入微。尽管风格多样并不固定,但是网站精致不输给其他国家的设计。

**原文地址:**[designmodo][50]
**优设译者:**[@陈子木][51]

[0]: http://www.uisdc.com/author/chenzimu7
[1]: http://www.uisdc.com/category/site-recommend
[2]: http://image.uisdc.com/wp-content/uploads/2015/06/the-best-usa-websites-1.jpg
[3]: http://www.uisdc.com/tag/%25e4%25bc%2598%25e7%25a7%2580%25e7%25bd%2591%25e9%25a1%25b5%25e8%25ae%25be%25e8%25ae%25a1
[4]: http://spacejunk.com/
[5]: http://image.uisdc.com/wp-content/uploads/2015/06/1-Spacejunk1.jpg
[6]: http://footjoy.com/Lookbook2015/
[7]: http://image.uisdc.com/wp-content/uploads/2015/06/2-Footjoy-Lookbook1.jpg
[8]: http://nightcrawlerfilm.com/
[9]: http://image.uisdc.com/wp-content/uploads/2015/06/3-Nightcrawler-Film1.jpg
[10]: https://www.nike.com/cdp/nikepro360fit/
[11]: http://image.uisdc.com/wp-content/uploads/2015/06/4-Nike1.jpg
[12]: http://www.bluhomes.com/
[13]: http://image.uisdc.com/wp-content/uploads/2015/06/5-Blu-Homes1.jpg
[14]: http://soundcityproject.com/
[15]: http://image.uisdc.com/wp-content/uploads/2015/06/6-Sound-City-Project1.jpg
[16]: https://www.dropbox.com/guide
[17]: http://image.uisdc.com/wp-content/uploads/2015/06/7-Dropbox1.jpg
[18]: http://demicreative.com/
[19]: http://image.uisdc.com/wp-content/uploads/2015/06/8-Demi-Creative1.jpg
[20]: https://www.thetileapp.com/
[21]: http://image.uisdc.com/wp-content/uploads/2015/06/9-The-Tile-App1.jpg
[22]: http://union.co/
[23]: http://image.uisdc.com/wp-content/uploads/2015/06/10-Union1.jpg
[24]: https://www.storyandheart.com/
[25]: http://image.uisdc.com/wp-content/uploads/2015/06/11-Story-and-Heart1.jpg
[26]: http://onedesigncompany.com/
[27]: http://image.uisdc.com/wp-content/uploads/2015/06/12-One-Design-Company1.jpg
[28]: http://www.v76.com/
[29]: http://image.uisdc.com/wp-content/uploads/2015/06/13-V761.jpg
[30]: http://kabertech.com/
[31]: http://image.uisdc.com/wp-content/uploads/2015/06/14-Kaber-Technology1.jpg
[32]: https://mylapka.com/bam/
[33]: http://image.uisdc.com/wp-content/uploads/2015/06/15-Lapka-BAM1.jpg
[34]: http://www.montagebook.com/
[35]: http://image.uisdc.com/wp-content/uploads/2015/06/16-Montage1.jpg
[36]: http://adventure.com/
[37]: http://image.uisdc.com/wp-content/uploads/2015/06/17-Adventure1.jpg
[38]: http://www.pushhere.com/
[39]: http://image.uisdc.com/wp-content/uploads/2015/06/18-Push1.jpg
[40]: http://breezyexcursion.com/
[41]: http://image.uisdc.com/wp-content/uploads/2015/06/19-Breezy-Excursion1.jpg
[42]: http://www.thecapitol.pn/
[43]: http://image.uisdc.com/wp-content/uploads/2015/06/20-The-Capitol1.jpg
[44]: http://www.uisdc.com/tag/%25e7%25bd%2591%25e9%25a1%25b5%25e8%25ae%25be%25e8%25ae%25a1
[45]: http://www.uisdc.com/the-best-england-website
[46]: http://www.uisdc.com/the-best-germany-websites
[47]: http://www.uisdc.com/best-spanish-websites-design
[48]: http://www.uisdc.com/the-best-france-websites
[49]: http://www.uisdc.com/the-best-japan-website
[50]: http://designmodo.com/usa-websites/
[51]: http://weibo.com/chenzimu7/
[52]: http://www.uisdc.com/
[53]: http://hao.uisdc.com/book/
[54]: http://e.weibo.com/uidesign/
[55]: http://hao.uisdc.com
[56]: http://www.uisdc.com/tag/%25e7%25bb%258f%25e9%25aa%258c%25e5%2588%2586%25e4%25ba%25ab
[57]: http://image.uisdc.com/wp-content/uploads/2014/05/sdcweixin.png