谈谈微软的Metro Design设计风格
infoworks轨道设计
infoworks轨道设计
Infoworks轨道设计是一款用于轨道工程设计的软件。
该软件
具有强大的功能和易用的界面，可以帮助工程师进行轨道工程的规划、设计和分析。
Infoworks轨道设计软件可以用于设计地铁、火车、有轨电车
等轨道交通系统的轨道线路。
它提供了一系列工具和功能，包括轨道线路的纵断面设计、平面图设计、坡度计算、曲线设计、道岔配置等等。
使用Infoworks轨道设计软件，工程师可以快速生成轨道线路
的设计图纸，并进行各种分析和优化。
例如，工程师可以通过软件计算最优的轨道曲线半径、最大坡度、最适合的道岔位置等，以确保轨道线路的安全性和稳定性。
此外，Infoworks轨道设计软件还可以实现与其他工程软件的
数据交互，如CAD软件、地理信息系统等，方便工程师在设
计过程中进行数据的导入和导出。
总之，Infoworks轨道设计是一款功能强大的轨道工程设计软件，可以帮助工程师进行轨道线路的规划、设计和分析，提高工程设计的效率和质量。
Metro风格设计
Metro风格设计——Tile(磁贴)已铺天盖地而来，不论你是否喜欢，它将遍地开花。
1、Metro风格概述Metro的英文原意是地铁。
人群在地铁通道中川流不息，通过鲜明的颜色和简洁的表达快速而准确地获取信息。
微软对Metro的定义是“光滑，快，现代”。
1.1、Metro的渊源微软使用Metro作为其新一代界面和交互风格的代名词，其原因主要可以追溯为三点：首先是对于地铁指示牌的借鉴和启示，Metro注重了充分、醒目且简洁的信息表现形势；其次是对包豪斯风格的发展，Metro使用规整的、去装饰的、强调功能与内容的整体界面与几何构图；最后是最对瑞士平面设计风格(国际主义)的继承，Metro设计倾向于理性、整洁、秩序化、单一形状、简约与平面化。
1.1.1、地铁与城市地铁是城市最繁忙的地方之一，人群快速穿行于地铁通道中，地铁通道的指示牌鲜明的颜色和简洁的表达向人们快速地传递信息。
没有过多的点缀于装饰分散人们的注意力。
在应用于信息行业以后，Metro被从事信息行业的人们赋予了一层深意：单纯与流动的信息。
Metro风格之所以被称作Metro，其灵感来自城市地铁的三个方面：其一是地铁信息牌上最常用的单纯颜色和文字；其二是地铁通过内的条带状信息路标；其三是地铁上宽大的车窗。
1.1.2、包豪斯建筑20世纪20年代，德国在建筑领域发起了一项影响深远的运动，并逐渐波及到艺术、字体、产品设计等诸多领域，称作包豪斯运动。
包豪斯风格的建筑拥有开放的空间和对美丽材料的纯粹展现。
在其设计语言中常常运用静态而流动感的平行线。
包豪斯建筑强调结构，以突出其存在和真实的物理感；无装饰，只有美丽而干净的空间。
然而包豪斯理念也有自己的弱点。
因为去除了装饰，使得人性化空间很小，人们会感到这种风格的建筑和家具缺乏个性和生命力，缺乏感情联系。
被批判为“钢铁和玻璃”组成的森林。
微软为避开包豪斯的这个劣势，把Metro UI略显呆板的卡片式的磁铁(tile)注入了更加灵活的元素——及时更新信息，这将便于新闻、社交、天气等资讯的显示与更新，于是翻转、浮现、隐退、重置之后，每一个“方格”都改变了初始的模样。
第09课 PPT：界面设计-交互设计概论(第2版)-李四达-清华大学出版社
9.6 平移或滚动设计
平移式布局是移动界面中比较常见的布局方式。大平移式布局主要是通过手指横向 滑动屏幕来查看隐藏信息的一种交互方式。这种设计语言来源于经典的瑞士图形设 计的设计原则，并成为微软Metro Design（城市地铁标识风格）设计语言。 平移式布局不仅能够展示横轴的隐藏信息，而且通过左右滑动可以横向显示更多的 信息，从而有效地释放了手机屏幕的容量，也使得用户的操作变得更加简便。
9.3 扁平化设计
在这个科技快速发展的时代，设计风格无疑会成为大众所关注的焦点。同样，艺术 风格的流行还与媒介密切相关。扁平化设计已成为今日UI设计的主流。扁平化设计 所有的元素的边界都干净利落，没有任何羽化，渐变，或者阴影。仅用简单的形体 和明亮的色块来表达，显的干净利落。尤其在手机界面上，更少的按钮和选项使得 界面干净整齐，使用起来格外简洁。可以更加简单直接的将信息和事物的工作方式 展示出来，减少认知障碍的产生
N APP要素 o 1 设计风格 2 LOGO 3 页面速度 感 4 页面布局 官 5 页面色彩 体 6 动画效果 验 7 页面导航 8 页面大小 9 图片展示 11 广告位置 13 栏目命名 浏 14 栏目层级 览 15 内容分类 体 16 更新频率 验 17 信息版式 18 新文标记
9.5 侧栏与标签设计
侧滑式布局也称作侧滑菜单，是一种在移动页面设计中频繁使用的用于信息展示的 布局方式。如果说，宫格式布局是从网页时代就开始出现，并通过网页设计影响到 手机移动界面设计的话，那么，侧滑式布局可以说是根据手机屏幕特点设计的布局 方式。
侧滑式布局的最大优势是能够减少界面跳转和信息延展性强。其次，该布局方式也 可以更好地平衡当前页面的信息广度和深度之间的关系。折叠式菜单也叫风琴布局， 常见于两级结构的内容。传统的网页树状目录就是这种导航的经典。用户通过点击 分类可展开并显示二级内容。
metro风格
metro风格简介metro风格是一种现代化的设计风格，又称为扁平化设计或简洁设计。
它最初由微软公司在Windows 8操作系统中引入，后来被广泛应用于移动应用、网页设计和用户界面设计中。
metro风格以鲜艳的颜色、简单的图标和清晰的排版著称，以提供简洁、直观、易用的用户体验为目标。
特点metro风格的特点包括：扁平化设计metro风格强调简洁明快的设计风格，抛弃了过去阴影、渐变和纹理效果的设计。
元素以简单的几何形状、清晰的边界和饱和度高的鲜艳颜色来呈现。
这种设计风格使界面看起来干净、整洁，并且能够更好地适应不同的设备屏幕。
鲜艳的颜色metro风格采用明亮、鲜艳的颜色来区分不同的信息和功能。
每个按钮、标签和图标都有自己的颜色，使用户可以快速识别和定位信息。
这些鲜艳的颜色给人带来积极、愉快的感觉，提升了用户体验。
简洁的图标metro风格中的图标都采用简单的几何形状和清晰的线条来呈现，它们通常是单色或双色的，没有细节和阴影效果。
这样的设计风格使得图标在不同的尺寸和分辨率下都能保持清晰和易识别。
清晰的排版metro风格注重排版的规范性和清晰性。
它使用大字号和行距、对齐的文本和简单的排列方式，使信息更易于阅读和理解。
这种清晰的排版风格与扁平化设计相辅相成，共同构建了metro风格的独特魅力。
应用领域metro风格的应用场景非常多样，包括：移动应用在移动应用领域，metro风格被广泛应用于iOS和Android 系统的应用中。
通过使用鲜艳的颜色、简洁的图标和清晰的排版，metro风格可以提升移动应用的用户体验，使用户能够快速定位和操作功能。
网页设计metro风格在网页设计中也非常受欢迎。
它的简洁明快的设计风格使得网页更易于浏览和导航，而且能够适应不同的设备屏幕。
metro风格还提供了大量的样式和组件，使设计师能够更快速地搭建网页。
用户界面设计由于metro风格的简洁和直观性，它也被广泛应用于各种软件和系统的用户界面设计中。
浅谈扁平化风格在平面设计中的应用
艺术探讨浅谈扁平化风格在平面设计中的应用董潇可（广东科技学院， 广东，东莞 523000）摘 要：扁平化风格在近年来的平面设计中大行其道，占据了主流设计市场的一席之地，受到了众多设计师的青睐，纷纷效仿和借鉴扁平化（flat）设计进行艺术创作，扁平化风格的发展与流行是现代设计的趋势与选择，本文简要追溯与分析扁平化风格的发展与流行趋势，对扁平化风格在平面设计中的应用与发展进行总结与展望。
关键词：扁平化，平面设计，应用根据近些年的流行趋势分析概括，扁平化风格正在成为平面设计领域的新风尚新趋势，扁平化正在以它的简洁性、纯粹性、实用性和良好的视觉应用体验占据设计趋势浪潮的前端，也被越来越多的被大众所认可。
一、什么是扁平化风格扁平化设计的英文中常用翻译为Flat Design。
是一个全新的专业名词，扁平化设计产生的核心是对信息的提炼使设计更注重功能本身，实现功能最大化。
在表现形式上更注重简单元素平面化，将想要传达的信息更加简单明了，使用户最大限度地接受有用的核心内容，使界面设计更加高效合理。
这一核心使设计师更倾向将扁平化设计运用在UI设计和人机交互设计中。
这种追求简约的设计风格更依赖那些被精心筛选的本质性元素，而非表面上的装饰，一切设计都为功能服务，可以真正做到形式追随功能。
扁平化是摒弃掉一些多余的装饰环节，用最本质最核心的元素进行设计，色彩搭配干净清新简洁，概念的核心意义是去除冗余、厚重和繁杂的装饰效果。
而具体表现在去掉了多余的透视、纹理、渐变以及能做出3D效果的元素，最大化地实现简约化、符号化。
二、扁平化风格形成的过程1.产生于微软的界面设计中扁平化设计风格真正应用于界面设计是由微软公司2006年推出的名为Zune的音乐播放器。
微软推出的Zune音乐播放器，为与苹果的iPod播放器竞争，从此开始名为Metro的设计。
其特点主要突出显示大文本并匹配背景图像。
这个版本的操作系统使用许多简单的形状，清晰的印刷格式，明亮的对比色，复杂的细节和纹理已被删除。
拟真设计与扁平化设计
其实如果从拟真设计里面提取一些关键成分的话，那么最重要的可能就是拟真设计更像是一个富有情感的人，会让用户感觉到亲切，iBooks琳琅满目的书架和细腻的翻页效果让用户忘记了自己是在对一块屏幕指指点点，无论是视觉上还是操作上，都像是一本真正的书籍。
这种让用户舒适的亲切感大大降低了用户对陌生软件的学习成本，因为一切都和现实中的那么接近。
ibooks图形界面 但是正是因为这样，拟真设计的盛行也塑造除了用户的一个坏毛病，那就是“以貌取人”。
相信绝大多数用户在浏览App store的时候都是在看哪些图标设计的即漂亮又精致，漂亮的图标还有按钮总会吸引人去点一点，即便后来发现实际应用的功能并不好，甚至有些应用仅仅是把背景进行了仿真的处理，而使用方法还是同样的啰嗦和繁复。
也正是在人们开始对拟真设计迷恋的热度开始下降的时候，一种新的图形界面设计思路出现在人们的眼前，这就是以微软的Metro UI为代表的扁平化设计。
windows RT图形界面同拟真设计一样，其实扁平化设计早已出现在大家的身边，最早可以追溯到源于Swiss设计，虽然Swiss设计一贯的强调版设的工整和画面的精简，但是在仅仅依靠印刷品传播的年代，是无法达到微软的影响力的。
瑞士版式设计 扁平化设计追求纯粹的视觉体验，通过简单的形状和色彩来替代纹理和光影的效果，这也使得钟情于简约设计理念的设计者心中引起了不少共鸣，Antoine de Saint-Exupery指出：要实现完美境界，不在于能否包罗万象无所不有，而在于每一个有限的组成部分，都是不可取代的精华。
而这样的设计思路实际上是基于用户认知的一种升华。
说来有趣，当年微软的图形界面正是“借鉴”了苹果的图形界面才问世并发扬光大，那么扁平化设计所表现出的简约实际上是对信息的高度整合，在用户理解上的难度其实是要更高一些，要知道还是有很多用户没有见过xbox的手柄，甚至不知道xbox是什么。
不过扁平化设计的兴起的确影响了很多的设计者，渐渐让设计者意识到PS中渲染出的各种质感和光感虽然自我感觉不错，但却不能完美的应用在每一个地方。
UI设计项目教程 学习单元5 计算机软件界面设计
UI设计项目教程
必备知识
设计软件流程 在设计软件时，应先写出软件主要流程框架。流程框架指导软件功能的编写和实施。
UI设计项目教程
必备知识
本任务在设计之前应该制定一套标准，标准包括软件涉及的每个窗口和标签的大小、标签、颜色、字体等方面 。
色彩体系：高亮色、文字色、分割线色、背景色、辅助色，以及按钮不同状态的颜色等规范。
UI设计项目教程
学习单元5——计算机软件界面设计.
单元概述
学习目标
. 项目1
ONE
音乐播放器界面设计
项目描述
UI设计项目教程
任务1：图标绘制
最终效果
UI设计项目教程
任务1：图标绘制
UI设计项目教程
必备知识
界面设计风格
界面设计的风格多样，我们主要讨论以下两种风格，扁平化设计风格和拟物化设计风格。 扁平化设计 代表作：iOS7.0及以上，Metro UI，Windows 8。界面：纯色的简单组合（iOS系）、极简的抽象矩形单色色块（微 图5-9 拟物化设计和 扁平化设计 软系）、大字体、光滑、现代感十足，有种蒙德里安的感觉。 B端交互：因为扁平化设计的核心是对功能本身的使用（对内容本身的消费），所以去掉了冗余的界面和交互，而是使用更直接的设计来完成任务 。 优点：界面和交互简约，信息更直观，信息量更大。 缺点：需要一定的学习成本，且传达的感情不丰富，甚至过于冰冷。 拟物化设计 代表作品：iOS7.0以下，Android以及iOS7.0以下的大部分APP。 界面：模拟真实物体的材质、质感、细节、光亮等。 B端交互：人机交互也拟物化，模拟现实中的交互方式。 优点：学习成本低，一学就会，而且传达了丰富的人性化的感情。
UI设计项目教程
必备Байду номын сангаас识
城市设计(02城市设计的控制要素)
建筑群体只有组成一个有机整体时 才能对城市环境的建设作出贡献。因此， “我们必须强调，城市设计最基本的特 征是将不同的物体联合，使之成为一个 新的设计，设计者不仅要考虑物体本身 的设计，而且要考虑一个物体与其它物 体之间的关系”。----整体大于局部。
２、建筑体量
高低、大小、形状。
３、建筑形式
风格、色彩、材料、质感。
pedestrianspacesassociatedwithmetroexitsareconcentratedindependentandlimitedinextent与地铁出口相关的人行道空间在一定程度上是集中的相对独立的有限的巴黎leshalles地区三个地铁出口人流流量分析leshallesparis巴黎leshalles地区三个地铁出口人流流量分析dbitspitonniersdanslesecteurpitonnisdeshallestheimpactofsuperimposedmovementsystemshighdensityoncertainlinks相互叠加的运动体系的结果是在某些连接处形成高密度人流巴黎三个地铁出口人流流量分析德国慕尼黑的广场多种使用活动的交织?活动这一要素不仅包括提供空间的步行方式而且要考虑产生这些活动的功能要素functionalelement包括商店各种公共建筑娱乐休闲设施公园运动场地等
城市河道-连接性开放空间
3）. 绿楔(Green Wedge)：这是一种 真 正 的 城 市 开 发 中 的 “ 呼 吸 空 间”(Breathing)。它提供自然景观要素与 人造环境之间的一种均衡，也是高强度开 发设计的一种变化和对比。 4）. 焦点( Focus Joint ) ： 一组帮 助人们组织方向和距离感的场所或标志。 在城市中它可以是广场、纪念碑或重要建 筑物前的开敞空间。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
Metro UI，也叫Modern UI（这个名字现在更常用）、Windows8 Style UI，是微软基于设计语言设计的一种界面风格，此设计已被用于移动操作系统Windows Phone、Windows 8、Xbox 360等多款微软产品，也是目前各种设计风格里面最大行其道的，所以先讲讲Metro UI Design。
Metro设计理念
图例为WP7和WP8的Segoe字体
Metro作为一种文字导向（typography-based）的设计，设计一般采用微软WP为此设计的标准字体："Segoe WP"，它也比起其他UI设计风格更加注重字体，并且在持续不停进化中，原因是Metro的设计原则之一是"content before chrome"，翻译过来大致是“内容大于装饰”，所以这种设计风格更加注重应用内容本身（一般以文字和线描图展现），而不是在于传统设计上的“Graphic”（图形），这也是当初它搭配在Lumia上一出世就把大家惊艳到的主要因素。
这种基于瑞士平面设计的设计原则，有利于设计出以文字为主的导航界面。
机场和地铁的指示牌给了微软设计团队灵感，其风格大量采用大字体，能吸引观众之注意力。
微软认为Metro设计主题应该是：“光滑、快、现代”
（Simple.Clean.Modern），于是现在你看到的Metro的图标设计也不同于Android 和iOS，即便它还是有不少的传统意义上的图标。
2006年，Zegoe UI风格
2006年，当微软媒体播放器内置系统Zune开始使用类似Metro的设计风格的时候，微软的设计师就计划重新设计现有用户界面、更清爽的排版和较少的重点以便于用户使用，当时还被称为* Zegoe UI。
后来移植到手机，出现了“Live tiles”（活动磁贴）*，并成为了Metro UI的一个重要组成部分。
微软这种设计摒弃了复杂图形而直接展示内容本身，提升了常用任务使用体验和速度，这种界面使用更多大面积块，标题和内容非常直观的显示出来，而且常常伴随着屏幕滚动。
动画在Metro UI里面占有巨大的作用，这样能给用户一种这些界面是“活的”，是可以“深入对话”的。
Metro发展史
颇具有年代感的产品
早在20世纪末，微软公司旗下产品Encarta 95（微软旗下一个类似维基百科的应用）和MSN 2.0就已经隐约有这种“Metro”的影子了。
到了Windows Media Centre和Zune（一个便携播放器的播放系统），这种设计已经大幅度进化了，接下来应用在更加广为人知的Windows Phone 7上。
由于移动互联时代移动设备的重要性逐渐取代当年传统的本地PC端单机，于是当WP上一些应用要和本地的诸如Xbox系列都开始挂钩的时候，导致了一些传统应用和系统也开始了重新设计，微软对外暂定把这个名字命名Metro（也没有打算永久用下去的名字）。
于是今天看到的就是，微软在它的一系列产品上都大幅度使用了这个风格。
关于这种设计风格为何改名（设计史上很少这种先例），倒是有一段故事：
2012年末，以“Metro”为名的公司麦德龙（Metro AG）声称微软的接口Metro UI的"Metro"一字已经侵权将要提告，一封要求停止使用"Metro"字眼直至代替
字眼或案件结案的备忘录亦被发送到软件开发者和微软员工；后虽没有提告，但微软为了不再与该公司名称冲突，决定取消"Metro"名称，改用"Windows 8 Style UI"或者"Modern UI"取代了Metro UI，但实质上还是一样的。
然后，在2012年9月，"微软设计语言（Microsoft design language）"开始被用到微软开发者网络的文件内以及Build年度会议。
所以，当大家广泛知道Metro Design的时候，它已经正式改名了。
Metro评价
手机系统WP7曾经被Industrial Designers Society of America (IDSA)评价为“黄金交互”，其UE顾问说到它深入内容本身并展现出来，界面优雅独一无二。
而操作系统Windows 8出来以后反而有人认为是个失败：开始菜单和其他界面完全两种风格，很割裂，有种两重人格的感觉。
我相信有不少人也有这种想法，不过考虑到微软阵营的平板远远没有手机那么普及，而PC尚未做到大规模可触屏的时候，OS要如何平衡设计和功能，的确也是微软要解决的一个难题。
Metro现状
图例：新版本Outlook
现在，微软已经集成此设计风格到旗下产品中，比如Windows Live Messenger和Live Mesh。
而Windows 8和Office2013全面使用Windows UI设计。
而目前，微软官方网站及微软旗下OneDrive、 亦部分使用此设
计，该设计风格还能风靡世界多久，还得看微软未来会对目前的Metro风格做出多大改变，而它的上升空间依然还是很大的，个人还是很看好它的前景。