从人人网客户端看Win8 Metro设计精髓

之前也发了一系列关于Win8的博客,今天给大家分享的不是Win8本身,而是Win8 Metro的应用。Win8 的极简主义设计理念被很多人批评做出来的东西太粗糙,不好看,甚至记得一度非常火的一个帖子,详细对比Win8和iOS在各个界面的美观度。经过这篇博客给大家分享的内容,我想会改变很多人的看法。

坦白讲,作为一个学习了四年专业交互和界面设计本科课程的我,看到人人网Win8的Metro设计,也被深深地惊艳到了。惊艳到的不仅仅是一个一个界面,同样还有其优秀的交互设计。鉴于在博客中无法让大家感受到交互设计的部分。我就给大家列出主要界面的UI设计,配上描述的交互方式,供大家尝鲜。

郑重申明:本文仅供参考,转载请注明出处,其中涉及部分个人隐私,请勿用于其他目的。

1. 新鲜事

最左边是新鲜事,极简主义发挥到极致,背景渐变色块,优雅的微软Segoe字体,有图片的区域较大,直接显示图片,文字区域较小,配以不同颜色的色块,搭配非常简洁和干净。从未发现微软Segoe字体这么漂亮过。注意背景色块的渐变区域,如果是纯蓝色,会显得很呆板,加上一点点的渐变,和右边30%的分隔,将整个画面激活。

2. 我的照片

我的照片和最近来访在新鲜事右边,直接滑动即可看到这部分内容。每个图片会动态变化。请注意看我的照片区域的分栏设计,设计得非常精巧,中间加以宽度适中的分隔,是否想起了Van der Rohe 的名言"less is more" 。最右边的竖条照片刚好显示一张全身照,不知是巧合还是有图片识别算法进行优化排列的。

3. 最近来访

继续向右推动,就会出现这幅界面,这里面的联系人会像来回翻动,可惜无法动态展示。

4. 个人主页

依然只有色块区域,文字和图片,组成了个人主页区域。上端三个字的字体和颜色搭配得非常漂亮。依次点击可以跳到对应的界面。这边我想很多网友会拿和iOs相对比,iOs的设计理念,一般会放个Button在这里,各有各的好处,但是我想说人人网这里的设计真的很惊艳。

5.

点击我可以看到详细信息。在这个页面可以仔细看出背景设计的巧妙之处,仔细欣赏这个背景一会吧,真的很棒。我想这就是教科书上面说的"简约不简单"吧。

6. 浏览图片

浏览图片的界面,在前端的这个图片可以随意拖动,当拖到边框外的时候,就回到后端的页面。交互很好。这张图片来自马蜂窝的,应该不存在个人隐私的问题,大家尽可多多欣赏。哈哈。

7. 个人新鲜事

再给大家详细欣赏一下个人新鲜事页面。

8. 快速回复

快速回复非常方便。

9. 我的日志

我的日子页面,大家是否看到了本人去年9月16日发的日志?哈哈,这也算这页UI的亮点吧。

10. 我的好友页面

11. 快速分享@页面

12. 总结

已经无法用言语表达我对这个设计的喜爱了。如果你还在怀疑Windows8设计师Sam在 如何重塑信仰 中对于Win8的期待和描述,我想,这篇博客是最好的答案。

Per informazioni complete sulle ottimizzazioni del compilatore, consultare l'Avviso sull'ottimizzazione