Win8 Metro UI初体验

先简单的介绍下什么是Metro UI?

Metro UI不是一套皮肤,而是一种设计规范,MS把它叫做“Metro设计语言”,起初是源于瑞士一种平面设计原则,界面以大号文字为主要元素来吸引用户的注意力。

Metro UI设计具备以下五点原则:

1. 干净、轻量、开放、快速

2. 要内容,而不是质感(对比WIN7有质的变化)

3. 整合软硬件

4. 世界级的动画

5. 生动,有灵魂

 

进入主题,先报下测试环境:虚拟机VMware Fusion ,分配1G内存,70G硬盘,

ISO地址http://dl.pconline.com.cn/download/85295.html

密钥:TK8TP-9JN6P-7X7WW-RFFTV-B7QPF装机部分省略300字……和win7差不多的过程,直接进入界面

每个应用区域默认为不同的颜色区域,默认显示应用ICON,有内容时内容轮播;

让我惊喜的是,WIN8居然支持mac的鼠标操作,并且滑动流畅,用户体验立马又提升了一个档次!^o^不过有点儿不足的是,滑动页面的时候,页面成无序滚动,就好比手机翻应用桌面,翻到1/3的时候停住了,还得用鼠标指针拉下面的滚动条给放正了,不过这个也有可能是不兼容的问题,不知道在平板上什么体验。

默认的几个应用先show一下:

windows live邮件界面,和live mail的客户端界面很像吧!

页面内ICON主要以圆形为主

 

相册里面很赞,有iphoto的感觉。

有些应用暂时还没有办法显示,地图 视频 音乐等到无法打开,天气稍微还能看到点儿,字大就是好,至少我觉得在信息获取上畅快多了。

应用商店的界面,我很好奇他的区块布局是如何定义和控制的,如何保证页面的视觉协调,难倒这一块是手工推的么。

SkyDrive MS的网络硬盘

这个是上面说到的音乐应用,当应用无法打开或者空的时候,它会提示一句“这里比较冷清”,不知道英文是怎么描述的,中文读起来感觉阴森森的,特别在这个灰暗的界面里面!#

到新闻页面了,个人觉得文字图片的尺寸和布局恰到好处,移动UI的各种优点,想看什么信息,余光一转,立马看到。下面的页面更能体现这一点

浏览器应用,默认的bing首页,加载挺快

我们传统的Win桌面,在win8里面只是一个应用。

应用搜索页面,原生ICON真是精致!

UI设计师们,看完了WIN8的界面设计,是否想起来那领导们的那句话——“加一点质感”?下次再说就抽他丫的,哈哈,开个玩笑!

我们现在看IOS Adriod4.0 WIN8 Chrome OS的界面,不管是电脑上还是移动客户端上,风格都是以简约为主,包括近两年流行的网格型和碎片型页面布局,将来随着WIN8的普及、移动主流,用户的视觉需求也越来越高,对我们80后UI设计师的能力要求也越来越高。当我们刚熟悉gird系统的时候,人家页面已经没有宽度这一说了,当我们纠结模块布局的时候,人家已经有了响应式页面设计,哎,看来暂时还不能养老啊,继续苦逼吧!

金牌狙击手

52html5是一个web前端|html5资源平台,为广大html5开发者及爱好者提供html5相关的教程、资讯、html5游戏、html5教程等,并涉及css3、javascript前端知识。