IT技术博客大学习 共学习 共进步
全部 移动开发 后端 数据库 AI 算法 安全 DevOps 前端 设计 开发者

什么是Metro风格的应用?

胡太狼,你在哪儿? 2012-04-07 21:47:51 累计浏览 2,690 次
本机暂存

    Metro风格的应用是针对用户的需求、运行的硬件、触控式交互和Windows用户界面量身订做的全屏式应用。Windows帮助你与用户进行交互,帮助你的用户与应用进行交互。

以用户为本的应用

    使用Metro类的应用,用户将获得体验:

    沉浸感(Imersive)——你的Metro应用会充满整个屏幕,让用户沉浸在你所构建的体验中。用户会完全沉浸在他们所喜爱的内容中。我们让操作系统不走寻常路,以全屏的空间来承载内容。你的应用是Windows体验的中心。充分利用空间,且不能让它变得凌乱。让用户集中精力于他们想做的事情。

    迷人且充满活力(Engaging and alive)——你的Metro式应用利用用户感兴趣的信息来吸引他们。动态瓦片(live tiles)能够即时提醒用户并将其带入应用中。

    Start界面主要展示各个应用的特点,应用瓦片(tiles)保持实时更新,鼓励用户点击进入。当设计你的“瓦片”时,你需要:

  • 突出品牌。你的应用瓦片是通过可视化效果定义应用品牌以吸引用户的机会,它应该吸引人且非常直接明了。
  • 将用户最感兴趣的信息和活动展示出来。你很渴望用户回到tile并查看更新。你渴望通过更新来吸引用户进来。展示的信息和活动越贴心,用户越可能融入到应用中。
  •     关于设计和创建App Tile的更多信息,可见Guidelines and checklist for tilesGuidelines and checklist for notifications

        联系(Connected)——你的用户能将内容分享给他的社交圈,同时发送内容给所链接的设备。更多内容浏览Searching,sharing, and connecting(Javascript)

        交互式且触摸优先(Interactive and touch-first)——设计你的应用优先考虑触摸和物理操作,同时Windows也提供键鼠和图片放缩支持。更多内容,可浏览Designing for touchResponding to user interaction

        多视图和多种外形尺寸(Great in multiple views & on multiple form factors) ——应用使用控件来支持“流式布局”,所以内容能够自动适配。平台提供了自动缩放已解决多分辨率和多尺寸的适配问题。浏览更多信息,参见Designing for different form factors

        Confidence-inspiring ——用户能够安全地下载、安装、使用、更新和卸载应用,无须其他更改或操作。

        用户多任务设计——

    原图已失效

        当用户沉浸在全屏的情境中时,Windows依然能够完成多任务:

  •  Snapped view  用户喜欢一次能够处理多项事务。他们希望在聊天、上网、看电影、发传真是也能使用你的应用,让应用的snap view更可用,注意在切换时要保持情境的一致性。
  •  Filled view  用户可能snap另一个应用,而你的应用保持在fill的空间内。占据减少的水平方向屏幕控件来容纳视图。
  • 以人为本的开发体验

        开发这也能获益:

        开发语言的选择(Your choice of programming languages )——你能选择你最擅长的语言来开发应用,例如Javascript、HTML 5和CSS3,C++/C#/VB(XAML)。

        新的部署方法(New deployment method)——打包Metro风格的应用;Windows Store;

        新的UI和以触摸为中心的输入(New UI and touch-centered input)——你能利用控件来创建应用,支持UI元素的直接操作,且把用户的目标放在首位。

        本地化(Localization)——你可以快速开发并满足多地区和多语言版本的部署要求。而且,Windows开发者预览版提供API来保证你的应用能够根据用户的语言和设置进行快速响应——例如日期、时间、数字和本地化格式——轻松搞定。更多信息,查看Globalizing your app

        开发工具(Developer tools)——Windows开发者预览版提供免费的Microsoft Expression Blend and Microsoft Visual Studio 11 Express工具。你轻松使用开发环境和模板帮助你设计、开发、打包、测试和部署应用。

        原文链接:http://msdn.microsoft.com/en-us/library/windows/apps/hh464920.aspx

        注:本篇文章开始,将不定期的翻译并更新一些《Metro Style APP Guidelines》文章。有兴趣的也可以关注我的微博——太狼兄

    同分类推荐文章

    1. 如何写好设计文档? (2026-06-23 08:00:00)
    2. Designing With Uncertainty: How AI Supercharges Probabilistic Thinking (2026-06-16 23:00:00)
    3. The Benefits Of Cognitive Inclusion In UX Research (2026-06-10 18:00:00)

    查看更多 设计 文章 →

    建议继续学习

    1. 50个活力和动感的网页设计-颜色的灵感 (累计阅读 34,442)
    2. 30套最好的网站开发与设计中使用的小型图标 (累计阅读 12,529)
    3. sns视觉设计分享 (累计阅读 9,523)
    4. 网站导航设计的6大分类 (累计阅读 9,298)
    5. 概念视觉设计 (累计阅读 5,826)
    6. 2011年手机产品设计趋势(1):精致实用的界面 (累计阅读 5,526)
    7. Android设计中的.9.png (累计阅读 5,040)
    8. 如何创建一个简洁、光滑的web2.0网站页脚 (累计阅读 4,978)
    9. 手机UI设计基础-尺寸&单位 (累计阅读 4,867)
    10. 独创比百度、Google分页还强的分页类 (累计阅读 4,836)