RELATEED CONSULTING
相关咨询
选择下列产品马上在线沟通
服务时间:9:00-18:00
你可能遇到了下面的问题
关闭右侧工具栏
如何设计一个好的Windows 8应用
  • 作者:admin
  • 发表时间:2012-11-20 16:02:00
  • 来源:未知

虽然 Windows 8 刚上市只有半个月多一点,但 Windows 8 之父,同时也是 Windows 和 Windows Live 部门的总裁、微软下一代 CEO 热门人选的史蒂芬?辛诺夫斯基却已经离开了微软, Windows 8 的设计语言名称也从最初的 Metro 先是变为 Modern 接着变为 Windows 8 Style,最后变为目前微软中国官方所称的 Microsoft Design(本文依旧延用旧名称 Metro 表示 Microsoft Design Language/Style),但 Windows 8 依旧在按照之前微软的规划一步步往前走着,Windows 应用商店的数量从最初的几百个应用迅速增长到了目前的接近 1.5 万,虽然到今天增长已经趋缓但依然强劲,预计十一月底能达到 2 万个。

如何设计一个好的 Windows 8 应用

虽然数量一直在持续增长着,但优秀出众的应用到现在依旧是屈指可数,随便问一个 Windows 8 用户几乎回答不出有哪几个做得特别好。当然这也与 Windows 8 本身设计语言的特色有关,看起来的简约实际是需要设计师去用心精雕细琢的,不然做出来永远是简陋,还是之前 Windows 8 传统桌面的 Metro 化中所认为的那样“Metro 风格不是让程序员都跑来顶替设计师的”,相反它更加考验设计师。

虽然是被称为“Windows 8 应用”,但它与 iOS 应用、Andriod 应用以及相近的 Windows Phone 应用还是有着很大的不同,在界面设计上它更加偏向于网页、平媒等所在的平面设计领域,在交互设计上也是更加偏向比较大的屏幕操作交互。在设计过程中需要认清这一点。

如何设计一个好的 Windows 8 应用?

我们都知道一个应用只有适配该应用所在平台本身的风格才能被称为好的应用,因为只有这样用户在使用的时候才能保持好的用户体验。那么面对一个全新的开始界面,全新的用户体验界面与全新的应用布局,应该如何才能设计出一个好的 Windows 8 应用呢?

1. 好的动态开始画面

开始画面是用户认识一个应用的开始,如果有一个好的开始画面可以给用户留下一个很好的印象,同时也是一个好的 Windows 8 应用必须有的。

开始画面细分可以分为启动画面和登陆、加载画面。对于启动画面,微软官方的规定比较死,所以你看到几乎都是清一色的单色前景 LOGO,这样的话除非你的 LOGO 很吸引人否则只能说是中规中矩,毕竟你不能靠一个旋转菊花让用户对你印象深刻吧。所以最好可以将限定的启动画面时间缩短,多在后面的登陆界面与加载界面下功夫,在这方面 QQ, Cookbook, 网易云阅读等做的比较好。

如何设计一个好的 Windows 8 应用

其中 QQ for Windows 8 的登陆界面与其最新的 2013 桌面版类似,背景是干净的天空,有一朵云动态的飘来飘去。而 Cookbook 和网易云阅读是动态加载跳转,三者其实都是是以动态效果见长,而动画效果在 Windows 8 中最为常见,它是营造 Metro 动感的主要手段。因此如果要设计一个好的 Windows 8 应用,打造一个让人感觉流畅、大气舒缓的动态启动画面是可以加分的。

2. 好的背景/图片/图像

在一个应用中背景图片可能就是伴随用户使用该应用的整个过程(贴靠除外),它的重要性要超过开始画面。在平面设计中,和谐、有效的图底关系可以让整个构图活跃起来,从而增强视觉冲击力和感染力。在设计 Windows 8 应用中亦是如此,选择一个合适的整体背景图像不仅可以吸引用户的注意,促使他们留下来去探究其他部分,还可以为页面布局服务。而选择一个不搭调的背景图像的话,不仅使界面变得刺眼,对用户获取信息造成干扰,还有可能使用户烦躁。如下面这个美国白宫应用。

如何设计一个好的 Windows 8 应用

只有一个星的评分是有原因的

如何设计一个好的 Windows 8 应用

再来看一个比较好的背景 Love Windows

另外在背景图像的选择上可以去参考一下平面设计,如用渐变背景增加应用清爽感;用插画、涂鸦等增加现代感和活泼度;用圆形多的图像来增强波普风,使其风格更加切近 Windows 8 的整体风格。对于大多数背景为灰色的应用来说,背景中加入一些不规则的图案可以一定程度上消除略显土气的负面效果。

3. 好的设计界面

界面包括主界面(中心页)、内容界面(部分页)与详细信息页等各级页面。那么什么是好的设计界面呢?

1. 严谨的排版布局

在平面设计中,有一个隐形的构图指导,它就是网格系统。网格可以帮助用户从视觉上来组块信息集,而设计师则使用网格来组织信息的内容,以保证其清晰度。在一定程度上可以说网格布局影响着一个作品的最终外观、心理感受和可用性。

而在 Windows 8 中,Metro 应用的一大特点就是内容形式化,因此对于占据着 Windows 应用商店绝对主流地位的是各种信息内容类的应用来说,如果一个应用有着严谨的网格布局,那么就可以说这个应用不会太差,即使它是由一个个方块堆砌起来的。因为在 Windows 8 应用设计中网格依旧会是结构的基础,它引导着元素的布局,将文本、图形和图表组织成设计的骨架。它可以保证一个应用内的信息有着基本的清晰度,不会凌乱 。

如何设计一个好的 Windows 8 应用

比较奇怪的排版:旧版与新版的千千静听

如何设计一个好的 Windows 8 应用

官方中规中矩的排版:说不上有多好,但怎么说也不算差

最初级的网格布局就是像微软官方建议的那样,整整齐齐的正方形块或矩形框等。再高级点,可以利用网格创造热点区域,利用比例差异来增添动感,建立层级关系等,见下一条。

2. 优秀的排版布局

就像上一条所说的,由于从 Windows Phone 到 Windows 8 微软的“示范作用”,造成了很多中规中矩的“方块应用”,甚至快成了一种模版。到现在相信很多人对 Metro 主界面的印象还是一个个方块或矩形框堆砌吧。

如何设计一个好的 Windows 8 应用

在 Metro 规范下的设计在很多人看起来像是戴着链拷跳舞,因此很多设计被 Metro 的方块给框住了。Windows 8 系统也越来越像一个“豆腐块”系统,雷同的应用内方块堆砌也经常让人联想起报纸上的招聘版面。

如何设计一个好的 Windows 8 应用

这样,要想设计一个优秀的排版布局,就需要从网格设计上下功夫了,在这方面做得比较好的还是在上面提到的背景做得比较好的 Love Windows。为了对比效果,我们来看看同样是在微软 Windows 应用商店里的推荐热门应用中,也是同等类别的应用 Win8 使用宝典来看一下。