微软扁平化的设计趋势之下，尽数Win10的设计心得和粗糙细节

用微信扫码二维码

分享至好友和朋友圈

微软扁平化的设计趋势是正确的、“摩登”的，而且相比Win8，包括无边框设计（不吐槽1像素的边框）、任务栏和开始菜单等方面都有了相当漂亮的改进：

因此，Win10设计忍不了的问题 不是扁平化不好，而是做工简陋粗糙。先来看看微软扁平化的先驱Zune（是的，它早已领便当了）

文字粗细、大小搭配合理而有层次，留白舒适，动画丰富，渐变配色大胆惊艳。

Zune可以证明扁平化也可以做得非常好看甚至是惊艳。

但是你看现在Groove音乐的界面，无法想象当年能做出扁平化如此成熟的微软，现在的审美却沦落到如此地步（何况Groove音乐已经诞生好几年了）。

几年前我曾以为微软会更新Windows Media Player赋予Zune的扁平化设计（毕竟功能齐全且相近），然而现在WMP却即将退役。

下图是外网2017年1月泄露的 Groove音乐官方设计图，之前显眼的标题栏完全透明，框架一体性增强，字体粗细、大小、缩进合理精致，加上优雅的留白，高下立见。

除了音乐应用的设计，再来看看同是微软出品的 Xboxone UI：

精致的排版，详实的内容，搭配线框与铺满页面的背景图，大气而夺目。再对比目前Win10开始菜单与应用商店，差距真的太大了，而这实际上是与Win10同步成长起来的Xbox新系统。

接下来会从系统设置、右键菜单、内置应用、桌面图标、字体行距等方面讨论Win10的UI中存在的问题。

第一部分：系统设置UI

Win10的设置UWP整合过去分散在系统各处的菜单，并进一步简化、分类与合并，选项更加齐全，逻辑更加清晰，更方便用户上手。大一统的理念是进步性的。

但是（先不谈启动慢、易崩溃的问题）设置界面排版太过粗糙，居中对齐却使项目菜单长短不一，排版不注重留白，滚动条、大选框、大图标完全针对触摸屏设计，对绝大多数的鼠标用户而言并不友好，不仅浪费视觉空间，还显著增加鼠标操作移动距离。

而参考下图的Win8的控制中心，虽然图标还是拟物的，但在文字排版上更加整齐美观。

再看设置-个性化里的颜色UI：

文字缺少层次，调色板色彩繁多，而且并非按照通用色板顺序按深浅色系排列，显得杂乱甚至花眼，参考下图Win7颜色更改界面：

Win7所选择的几大色系代表色都很舒适优雅，其实个人还是建议，微软把调色板改为大色系下再选择具体色彩比较合理，而不是现在各种色彩相互混杂，如图：

事实上，Win10之前某一预览版就已经计划采用类似方案，不过后来貌似被砍了。

还有任务栏属性UI：

开关众多，而且都单独一行，浪费视觉空间，而且文字排列缺乏层次，会给人一种混乱之感。虽然过去的弹出菜单已经被淘汰，但也不妨看一下原来的排版：

开关与文字一一对应，层次清晰，也节约空间，对于鼠标用户而言，勾选框是一种更高效的选择。另外如果仔细看会发现整个设置中很多选项就是勾选框。

第二部分：系统的右键菜单

事实上，这三个图都是按原比例1:1并排的，你没有看错，同一个系统的右键菜单却千奇百怪，更不说其字号、间距、间隔线的粗犷排版，甚至还不如Win7统一、美观。

还有下图的任务栏网络、电源管理的弹出菜单，以及万恶的英文拼音并列索引：

不同菜单风格各异，菜单设置竟然是文字加下划线？为何不直接在弹出窗口边角加个设置图标？

尤其是电源管理菜单：电源模式用拉条调节？而亮度却是点击磁贴开关调节？无论是Windows传统，还是移动端的Android、iOS系统，不应该是亮度更需要用拉条调节、电源模式用选项吗？当然，网络管理要比Win8那种通知中心式的菜单和谐很多。

第三部分：系统内置应用：Edge浏览器

过大的字号与间距，缺乏逻辑的排版，没有图标占位空间，搜索框文字上下不居中，核心图标过大且不对齐，UI线条部分丢失，如果是第一个预览版我能理解，但马上都出RS4了。Edge浏览器新出的搁置标签和手机端互联功能很不错，但这粗犷的UI和动不动就卡住假死并不好用。

Win7就有的便笺，一直挺喜欢这个能开机自启的应用，后来Win10把它UWP化，但现在的便笺（左图）不仅启动慢了，最关键的是顶栏配色过于浓艳饱和，与主体色也并不是一个色系，差异太大而不协调。相比之下曾经出现过的一个版本（右图）配色更加素雅和谐舒适，又不失区分度。

第四部分：系统图标

Win8有一个很大的问题：大面积的扁平化改造却仍沿用Win7的拟物化设计，导致系统图标与整体风格不协调。Win10在2014年的早期预览版就开始解决这个问题：

这套图标就很不错，Office2013的图标风格，简约、扁平、高端沉稳的偏灰色调。

但是，软粉肯定记得2015年微软在Windows10预览版10056中更新了一大批新图标，结果招来大量吐槽：

这浓艳的配色与粗糙的形状……这下知道便笺UWP配色为什么是这样了吧。

好在微软收到众多用户反馈后，从预览版10125开始加入基于Win7图标重新绘制的新图标，也就是今天诸位正在使用的正式图标，相比Win7更加扁平化，配色清新舒适。

下图是Office 2016 Word和OneNote的图标：

是现有的图标更适合、还是Office风格图标更适合Win10呢？

第五部分：默认字体行距

先不论目前微软雅黑在高分屏的清晰度问题，自从win8.1以来Windows系统就一直遗留着一个问题：默认字体行距过大以及由此导致的一系列UI错乱。

最明显问题参见Office的选项菜单：

文件资源管理器中英文版对比：

经过查找可以确定这就是系统默认字体微软雅黑的问题，RS4预览版中出现了新的系统字体，并逐步解决原来字体在高分屏、行距等方面的问题。但目前还不清楚新字体什么时候能面向全体用户。

PC与移动终端的互联是未来发展趋势与新功能开发的重要思路，但真心觉得微软别再强行为了触摸和移动化，而把原来桌面端体验还不错的系统UI和应用也改得面目全非了，毕竟Win10的主流用户还是PC端鼠标用户。

我自然知晓微软One Windows的愿景，但是鼠标用户与触摸用户并不能直接共享一样的UI，假如以后PC版Office只有大间距版本或者简陋的UWP版本，我相信广大学生教师与办公人员都是难以接受的，而这不是先进与落后的问题，而是合理和适当的问题。传统模式与平板模式需要更精细的区分与切换机制，这需要微软在UI上做更多的工作。

微软在2017年5月推出了Fluent Design System全新设计语言，终于开始将工作重点放在UI上，不过这注定是一个长期而艰难的过程。Win10毕竟是每天都在使用的系统，更加期盼微软未来的改进。

预览版RS4的UI改进以及官方设计图：

Win10 RS4预览版中设置终于重新排版，同样是大方块，但图标文字缩小，文字列于图标右侧并左对齐，注重留白，更加规整、精致。另外侧边栏还加入亚克力透明效果。

Win10 RS4预览版17063终于更新了Edge浏览器的UI，标题栏更加透明扁平，图标也缩小对齐了，更加精致。

也是在Win10 RS4预览版17063中，开始菜单中英文分组导航终于合并。

邮件应用设计图演进：

特别声明：以上内容(如有图片或视频亦包括在内)为自媒体平台“网易号”用户上传并发布，本平台仅提供信息存储服务。

Notice: The content above (including the pictures and videos if any) is uploaded and posted by a user of NetEase Hao, which is a social media platform and only provides information storage services.