大部分图标还具有镜像样式,以供使用双向文本的语言使用。
这里提供一些 Unicode ID。
红心大战
星形评级
复选框组件
单选按钮
杂项
滚动条
渐进式公开箭头
后退按钮
后退按钮的字形提供了 3 种不同大小,以便外环的权重等于 16pt、20pt 和 42pt。这些字形设计用于支持分层。
HTML 的后退箭头
记得添加其他代码,创建环绕这些字形的圆环。
用于控制的图标的字形
这些字形设计为以 14pt 大小显示。记得使用其他代码,创建环绕这些字形的圆环。
六、动画如果你有心做动画,喜欢折腾捣鼓,那就试试吧。PowerPoint 中部分动画的“平滑结束”比较用得上,但至今配合动画延迟也没有尝试出完全相同的程度。Modern UI 中很多动画的“位移-时间”图像是曲线。
1、底部 Action Bar:https://content5.ssl.catalog.video.msn.com/e2/ds/42bad77c-661f-457f-ad89-9fdf0742d807.mp4
这个使用进入动画“飞入” – 从底部 – 持续时间和平滑结束时间自行设定。
2、隐藏面板 Charm:https://content5.ssl.catalog.video.msn.com/e2/ds/629ed613-3265-42f6-878c-c057313643d3.mp4 设定方式与上一条同理。但视频中还是早期样式,Windows 8.1 中面板与其上的文字有动画延迟,显得更有活力。视频中文字内容和面板还是一个整体。要做新样式,将文字内容与底部面板分离,设置动画延迟。
3、弹出动画:https://content3.ssl.catalog.video.msn.com/e2/ds/2a38b01a-a40b-491e-8802-5a9572a123a2.mp4 包括一个平移,它是在弹出元素淡入时从初始位置到最终位置的垂直移动。平移距离和方向由应用指定。在大多数情况下,平移应为 50 像素,以向上方向移动。不过,如果弹出元素显示在触发弹出的 UI 元素下方,则平移应是向下移动 50 像素。例如,此下载平移将适用于从导航栏或从应用标题触发的浮出控件。这是为了向用户提供弹出元素与其触发元素之间的可视链接。
更多动画自行操作、观察。
我是从介绍其设计准则这个角度来回答如何制作这种风格的 PPT 的,试图把重点的一部分呈现出来,整理下大家纷乱的感知,我认为这样做更实际。
这是我看到的一个提炼:
Metro UI设计具备以下五点原则:
1. 干净、轻量、开放、快速
2. 要内容,而不是质感
3. 整合软硬件
4. 世界级的动画
5. 生动,有灵魂
# 注释 #
在【一、字体】中提及的 SS01 样式,出现了一些复杂的情况,感谢 @prox 用心的查证,手动点赞!因 @prox 网络问题无法发表,在这里贴出他的修正内容:
Segoe UI 的两种造型?
@佳伟发现列出的 Segoe UI 字体,字形竟然是不一致的。
作为 Segoe UI 的粉丝,我不辞劳苦(?)地找到了一台 Windows 7 电脑,使用 QQ 远程协助截下了如下珍贵图像。po主真的很拼……
这是 Windows 7 下的 Segoe 字体集。
在图中,发现了两个名为“Segoe UI 常规”的文件。它们分别是这样的:
显然这两种字形是不一致的。第二种,通常我们认为是微软雅黑的西文样式。注意两个字体文件版本号,可见下图版本号更低。
我想这大概就是佳伟截图中出现两种不同样式的 Segoe 的原因了:微软中途发布了新版本的 Segoe 字体。
我找到了这样一个链接:Segoe UI Light
?其中有这样一行:
可见表格当中并未列出这个 5.11 版本。推测,这可能只是一个临时的、中间的、不正式的版本。
Segoe 字体本身是不包括中文的。微软当前对它的用法是,与微软雅黑中文搭配成新版 YaHei Light,或与方正中等线搭配成 Windows Phone 自带 DengXian 字体。所以呢,也许是 5.11 版本打包的时候出错了,直接将一整套微软雅黑扔了进去……(注意5.11与其他任何版本的中 文字体都不一样,其他的选择了默认宋体作为中文字体缺失时的替换展示字体,而 5.11 版本带有雅黑)
Bing 的搜索结果也倾向我的推测。
因此,Segoe 就是这样的:
并非为了兼容 Windows 7 而把自己改成 YaHei UI Regular 的样子。
再次感谢!
设计师为此付出了艰辛劳动,程度之大是我们无法想象到的。
它倾注了设计师多年的用心探索、大量的资料、不断推翻改进的设计。不然,何以成为微软整个公司转型而确定的设计风格呢。
那些令人尊敬的人们,现在或许正为未来五年或十年的设计风格而探索着。
设计规则是人定的,为了更好地展现。那么规则也是可变的。期待 Modern UI 的不断精进!
(按当时 Windows 8 的开发情况,最终的配色方案和 UI 是在零售版中露面的。而有人声称 Windows 10 每个外放的预览版本都会暂时封锁一部分功能,这也是展示的 9841 和下载下来的 9841 有多处不同的原因了。那么没有理由不相信 Windows 10 最终会拥有一套漂亮的界面!鉴于保密工作越发严谨,大家还是等正式发布的那天吧!→ 如果过早曝光,没了惊喜,那多没意思嘛^_^)
全篇完结。