做事容易，做大事难。网页设计容易，但是出类拔萃难。左上角放Logo，Logo下方放导航，导航下方放置图片滑动栏，滑动栏下方来个三栏或者四栏布局，好吧，大多数的网站都是这样，除了图像、配色、字体不一样，布局方面非常相似或者相近，表现不出创意。

是不是很久木有这样的惊讶了：”原来网站还可以这样做？”

如果你想来点新鲜的体验，围观一些与众不同的网站，那么请看这里，这里是本周的一些创意网站精选。一定不会让你失望：）请耐心欣赏完每个网站，并且在页面里多按动鼠标体验一下哟。

1. Know The Sign

2. Shibui

3. Agencexy

当硬件技术已经达到一个空前的高度之后，大公司们争先恐后的发全力试水虚拟现实产品，诸如Facebook、三星、索尼等等，似乎不做出些成就便不好意思自称巨头。

诚然，科技进步的越快，人们总想去创造一些更超前的东西，重要的用户界面UI设计开始受到了忽略，但毕竟它才是使用者与产品交互间的桥梁。但好在还有微软、谷歌，在过去的一年内仍然致力于用户界面的开发，于是我们看到了像Material Design这样出色的产品。

国外知名设计类网站fastcodesign盘点了2014年最佳的UI设计，小编选择了很有意思的6款产品，一睹为快。

黑科技 RoomAlive

动图中的效果着实感觉逆天，你可以把它当作“真人CS游戏机”！简单点说微软的RoomAlive是一款“投影仪+Kinect”的体感外设，扫描全房间的几何形态后，把电视屏幕上的图像投影到墙壁。虽然说电视机屏幕仍然是游戏的主要显示器，但是房屋四周墙壁上的“外围图像”可以即时环绕着玩家，Kinect作为深度感应摄像系统来追踪玩家行动，从而实现“真人对战”的功能，比如说“突然转身发现从身后悄悄逼近的敌人”。

微软的“读心笔”

当年乔帮主在设计iPad时曾说过，“如果要是让你看到一只手写笔，我们就会炸了它。”由此可见，乔帮主痛恶的触屏手写笔是多么鸡肋的存在，不过这么多年了过去了，我们却似乎从未等到手写笔绝迹的那一天，至少在苹果零售店中第三方公司的手写笔仍然保持稳定的销量，毕竟“笔”是几千年来人类生活工作不可分割的工具。但是手写笔的问题依旧没有解决，它们“生硬、笨拙、无法读懂用户”。

首先要明白个道理，简单粗暴的读取人心的方法，并不是真的去“看脸看心情”，而是看对方用手在做些什么。举个网友们感同身受的例子，打麻将时并不是看对手们的神色表情，而是看他手上的“小动作”，如何握牌、出牌，这样你也能猜出个一二了。

没错，这次又是微软研究院，他们似乎总喜欢让一些鸡肋产品锦上添花。你看到的这一枝手写笔，笔身有多点触握传感器，能侦测它被握住的方式。于是手写笔加平板电脑的组合，不仅能精确测量使用者的触碰方式，还能测出手写笔相对屏幕所在的位置。研究团队目前已经识别出大约30种不同的人类抓握方式，希望在日后的研究中，将使用者的肢体语言数据与生物力学结合，实现人与平板电脑更高效的交互。

Thumbles 操控触摸屏的像素

触摸屏和我们的平板电脑简直就是浑然一体，每一个按钮其实就是隐藏在屏幕后的一颗小小的像素。不过缺少了实体按钮，有些“动手分子”简直会觉得不痛快。Patten Studio工作室的研究员James Patten利用自主研发的Sensetable技术，设计了一款名为Thumbles的人机交互界面，虽然看上去很像鼠标，但是和鼠标不同的是，它能够直接控制屏幕中的元素，甚至让屏幕背后的像素点们重新排列组合。

虽然看上去酷，但实际也不知Thumbles有什么用。但是对于多年来厌倦了触摸屏的极客们来说，这个产品应该是一款酷炫的黑科技。

GravitySketch 虚拟的3D画板

在空气中画出一张3D图像，简直是不可思议的事情。不过GravitySketch的出现或许可以让设计师们随时随地“凭空工作”。

GravitySketch看上去就像是数位绘图板，但是借助AR技术，使用者配单上3D眼镜之后，就可以在这个完全平面的板上绘制出3D图像。也就是说，用户在绘制的过程中，是可以按照实际的三维方位，随心翻转绘图板，来构图画作的后部、底部和上部的区域。简单的说来，你可以把它当作一款“手绘成型”的3D打印机，但区别是图像是“虚拟凭空”存在的。

著名的室内设计大师Charles Eames曾说过，“细节并不只关乎它们本身，它们还构成了设计。”的确，每一个网页都是由无数的细节构成，而其中的内容也是同样由这些细节连接组织到一起。不论是提供信息服务的网站，还是APP的官方宣传页，任何一个优秀的网站都能够经受得起挑剔眼光的洗礼，从图片到布局，从字体到架构。

网页设计的细节至关重要，因为正是它们给用户留下好印象，这些细节支撑起网站的良好体验，提高易用性。正如同Eames所说，它们成就了设计，不注意细节会让设计感流失。

接下来，我们一同看看这11款设计惊艳的网站。它们的好设计源于细节，有的界面雅致，有的交互出彩。深入揣摩这些案例，也许你的下一个网页设计作品会非常强大。

THE SPEED OF BASECAMP’S PASSWORD VERIFICATION

Basecamp 是一个基于网页的项目管理工具。正如同它的介绍，速度和效率是至关重要的。

这是网站的验证界面，设计师巧妙的事先隐藏了确认的按钮，只有当你输入了正确的验证码之后，OK按钮才会出现。这种措施不仅提高了网站的性能，还通过让按钮从无到有，将“验证码正确”的概念具现化，触动用户，增加成就感。

COLOPHON PRACTICED BY NEOTERIC DESIGN

在欧洲，在书中使用Colophons（题跋）可以追溯到15世纪的时候（中国就早很多了），不过这个网站是为了将其运用到网站上去。这次，Neoteric Design分享了他们网站的制作笔记——各个部分的功能，从字体软件到编程语言和内容管理系统。如果访客想知道一个网站是如何构建起来的，那么这个带题跋的笔记可以帮助用户方便快捷得了解这个网站的构建过程，满足好奇心。

VERSATILE TYPOGRAPHIC GRID BY BERGER & FÖHR

2014年5月去世的先锋设计师Massimo Vignelli曾说过，排版的栅格是“书的内衣”。其实由此推导，栅格系统又何尝不是“网页的内衣”呢？也正式它的存在，让网站整饬而干净。

在Berger & Föhr 为 Boulder当代艺术博物馆的网站进行重新设计的时候，栅格系统的“内衣”作用是如此的鲜明。当你浏览网页的时候，图片、文字段落、导航的边缘都隐约看到栅格的痕迹，你会在这里体会到对齐的力量。更重要的是，即使网站随着屏幕响应的时候，栅格所施加的影响依然存在。

不论网页的内容的属性是啥，使用栅格来严格组织内容是首要的工作。

PRIDE IN PLACE CELEBRATED BY MAKER’S ROW

越来越多的欧美网站开始在团队页面中标注设计师的家乡，声明这个站点的“故乡”。在足球领域，球队的球员介绍页面上，大家都喜欢“自豪地介绍球员来自……”，也正是这种“基于位置”的信息强化了整个队伍的归属感和凝聚力。同理，设计师们的“故乡”信息也有着同样的作用。

DIRECT ACCESS BY TWLOHA TO SOCIAL MEDIA

社交服务是如此之多，动不动俩服务还会在图标上撞个衫啥的，直接导致用户在分享的时候点错地方，而在欧美国家，这种情况更加严重。好在有TWLOHA，用带字体样式的文字LOGO替换图标，识别度提高了，美观度也有所保证。