通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

不单是视觉扁平,交互层级也更加扁平啦~


不单是视觉扁平,交互层级也更加扁平啦~

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

前不久,国外媒体曝光几张Win 10的全新设计语言的截图,把我给看嗨了(毕竟笔者是设计Windows 软件出身的老UI设计师啊)

于是我搜索了下这几张截图的相关信息,发现微软有一个开展了一年多的项 —— Project NEON,它的任务就是开发Windows新的设计语言(类似于设计实验室,大胆的做各种概念设计,大公司就是好,还有这种项目部门~~)

这次的新设计,相对于目前正在使用的Microsoft Design Language 来说,更加的大胆了,这些大胆既体现在交互层面也体现在视觉层面上。

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

(Groove 界面)

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

(Outlook 界面)

比较有趣的是曝光出的截图界面有两张都是来自微软自家音乐播放器界面Groove。笔者发现一个特点:很多设计师都喜欢拿音乐或者是视频播放界面来作为设计的突破口。可能因为这些界面在设计的时候确实容易出效果的原因吧,有各种漂亮的封面,操作按钮不需要特意解释都已经深入人心了,而且基本天天接触,想法自然比较多。

看完这几张截图不知你有什么想法,或者说发现了什么东西没有?

将来桌面客户端风向标的特点

笔者大致发现了以下几个特点,这或许是将来桌面客户端的一个风向标。

1. 弱化标题栏和菜单栏

传统的Windows 窗口由标题栏、菜单栏、工具栏、侧边栏、工作区域、状态栏组成。我们设计软件的时候基本也是遵循这几个模板进行交互布局。让我们简单回顾一下Windows的标准窗口~

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

(Windows xp窗口)

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

(Windows 7窗口)

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

(windows 10窗口)

通过上面几个大版本的窗口截图对比,不难发现Windows 一直在想办法让界面更轻(只是Win 7由于整个设计语言是玻璃质感,但整体还是要比XP 时期轻很多的)。Win 10 的标题栏和菜单栏更是结合了在一起~

2. 进一步简化层级,使操作进一步扁平化

无论是XP 还是Win 10,我们其实都可以看成是三个板块(下图),而新的设计语言将三个层级简化为两个层级,通过左右(有点类似于iPad 的App 交互)展现任务和对应任务的结果。

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

(iPad 概念设计)

3. 强化内容可读性

应该说以内容为导向进行设计一直以来是metro遵循的守则吧~大标题、醒目的颜色等。

4.目标导向设计,让界面更加干净和高效

只在触发到某个任务时才展现相关操作,这样就不用把所有的功能按钮都罗列出来,使界面更加Clean,操作更加的浑然天成.

5. 弱质感带来的高级感

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

说到这个“毛玻璃”质感~最开始应该确实是微软先弄出来的,当时候Vista的出现,还确实是让眼前一亮的~只是过去的设计太粗糙了,那么粗的描边、那么亮的内发光,那么黑的阴影… 并且那个毛玻璃效果不够“毛”,而且纯属装饰,没有什么实际用处。

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

(Win7界面)

然而比较搞笑的是,自家发明的毛玻璃效果被竞争对手苹果抄了去,而且青出于蓝,这让微软情何以堪啊。据说微软将这个毛玻璃效果正式命名为Acrylic(亚克力),在系统中会呈现出三种形态:Side-Nav(侧边栏) Acrylic、Background(背景) Acrylic、In-App(应用内) Acrylic。

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

(Metro的理念)

好吧,以上就是我看了这些图的基本感受,当然都属于个人想法,也可能这些理念现在已经有了,或者是不够明显罢了(主要是我用Mac用太久了,偶尔看回Windows 好有亲切感),有不对的地方望见谅。

据各种传言都表示 Project NEON 开发的这套设计语言将会出现在 2017 年秋季正式推送升级的 Windows 10 Redstone 3 上,也许广大 Windows 粉丝只要再耐心等待一段时间,就能看见更全面的 Project NEON 设计成果。

其实我看了这几张图觉得曝光的太少了,于是我又跑去各种搜索国外大神的概念设计。嘿嘿,还真被我搜到了不少,下面分享给大家,超赞的。

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

通过全新的WIN 10设计语言,我看到了将来桌面客户端风向标的5个特点

 

作者:俊宏,UI设计师,曾是迅雷设计经理,带领团队,负责迅雷桌面相关UI设计;目前在深圳百度,带团队,负责国际化两个产品的业务。信仰——专注和坚持。

来源:微信公众号【折腾先生】

本文由 @俊宏 授权发布于人人都是产品经理,未经作者许可,禁止转载。

原创文章,作者:Catherine,如若转载,请注明出处:https://www.iamue.com/24790/

(0)
CatherineCatherine
上一篇 2017-05-09 17:50
下一篇 2017-05-09 19:52

相关推荐

  • 2018用户体验趋势报告

    在2017年我们看到了很多用户体验的进步和优秀的产品。在与来自全世界的189489名设计师分享学习了1926篇优秀文章之后,我们(uxdesign.cc)分析得到了2018年的一些用户体验趋势。1 用户体验的死亡与重生作为用户体验设计师,我们一直都在争取尽早地参与战略决策,现在,设计师在项目中的地位越来越重要,那么我们要如何应对呢?你的app的用户引导页使用体验如何呢?下面是最佳的自查表;不确定哪种导航最适合你的网站?去看看网站设计样例...

    2018-02-03
  • 设计师的像素眼是怎样炼成的?

    传说的像素眼,也就是可以快速分辨出 1px 以上差异的双眼,往往由资深设计师所 get√,想要练就一双迷人的像素眼,除了常年累月的经验之外,还是有些技巧可以快速掌握的。今天分享7个像素眼的常用场合,按图索骥,用心观察,你也可以修炼成功!

    2017-06-02
  • 至纯至简|手机百度8.0设计总结

    8.0是手机百度发展过程中一个重要里程碑,它不仅延续了产品建立以来的要点,打破历史包袱,与时俱进地从体验和产品角度进行了创新,通过全新的整体交互框架与视觉风格,将搜索、语音搜索、FEED流信息获取、多垂类服务等进行了再设计。

    2017-05-12
  • 设计师设计出来的一个日本县长靠卖萌年赚12亿美元

    导读:一个县长靠卖萌年赚12亿美元,关键TA还是被设计师们设计出来的。。 ​ 说到这里后,小编又想起了未曾如约露面的那个春晚吉祥物康康(网友称猴赛雷)了。。。 ============================= IAMUE(https://ww…

    2016-02-18
  • “空状态的设计“值得更多关注

    空状态,或称零数据状态,很多时候不太招设计师的待见。我们基本都是在主要流程界面的设计工作完成之后才会回过头来考虑完善一下,因为从表现上来看,空状态给人的感觉就是临时性的,有些微不足道。 不要被空状态的…

    2015-08-17
  • 中国App设计真好!—— 一个美国人到中国当产品经理的心得

    导读:应用软件层出不穷,各个国家的人为自己生活的便利设计出各款的应用。然而,同样的应用,是否会因为中西方文化的差异,或者是生活方式的不同,导致相同应用的设计有所不同吗?是的,有的!Dan Grover 现在是腾…

    2015-02-10
  • 聊一聊不同应用场景下的验证码

    最近在做关于验证码的项目的时候,从交互的角度梳理了产品各个平台验证码的应用场景。在一个产品中,会有多个设计师分工协作,不同的设计师做设计迭代。由于验证码在整体设计中太容易被忽略,它在每个场景的显示逻辑可能不尽相同。下面,我们就来聊一聊不同应用场景下的验证码。

    2017-05-05
  • 设计规范 | 组件控件结构体系—加载类

    本文作者将加载划分为6种类型,分别适用于不同的场景,各有优缺点。设计师在设计时,可以根据用户的使用场景和环境设计适合的加载。

    2017-08-04
  • 【译文】“防止用户犯错:避免有意识的错误”

    西南航空的手机网站对已经过去的日期使用了灰色的背景,使你明白在预订一个航班时这些日期是不可选择的。不幸的是,对下个月的日期也使用了相同的设计,这意味着不可选。Polarr是IOS系统里很受欢迎的照片编辑工具。右侧的编辑控件(温度,色调等)需要你点击那个方块,然后向左或向右滑动而改变参数。然而,这些控件并没有展示出用户应该如何与其互动,所以新手用户很可能需要试错几次才能明白应该如何正确的使用这些功能。另外的一个交互困难就是:由于控件在屏幕的最右侧,你可以很轻松的向左滑动而减少参数数值,但水平空间有限,当你想向右滑动增加参数数值就会存在困难。IOS 8中,为帮助视力不好的用户阅读体验,提供放大显示图标和文字的功能。但是改变变焦需重新启动手机,这是一个重功能,需要花费一些时间,所以IOS系统会在你使用这个功能前,预览变焦完成后的样子。这个体贴的预览功能可以帮你评估出你是否真的需要操作变焦。Hipmunk提供快速浏览恢复选择机票过程的所需信息,甚至是被打断。在预订过程中的第二步,它清楚地显示了旅行的日期,在机场的问题,最便宜的出发程已被选中,以及用户被要求再选择一个回程航班。即使注意力分散了一段时间后,用户可以简单地恢复这个过程,而不会不小心偏离原本对航班的计划和要求或尝试重复已经完成的步骤。苹果新出的图片软件运用了一个很传统的对话框确认用户是否真的想删除最近爬山旅途中的照片,并且通过highlight 24张照片表示删除范围。更好的是,确认删除操作的按钮清楚地标示是删除,而不是一般的确认。Gmail 提供对破坏行为很有帮助的撤销功能,如误删了92封邮件。这个功能被证明是非常有用的,Gmail现在支持在发送email中允许点击发送键30秒内中撤销。Tweeter的字符限制条件很有名气,他们在用户超过那个字符限制前就会提示用户剩余的字符数。当一个tweet过长是,他会显示出超过的字符,高亮出那些超出的字符,并且使发送键不可使用,以让用户明白他们需要如何修复错误。

    2017-05-30
  • UED专访 | 李冀:建筑设计的唯一性与多样性

    📌 编辑 | XK P.S建筑行业之所以能百花竞放是因为有人独树一帜,自成一派有人匠心筑梦,执著务实在各展所长的事务所里李冀的原地工作室像潜生的植物一样有着自己的节奏与坚守静默地成长着……©UED我们常说懂一个作品应是知其然并知其所以然。本次我们专访内容围绕李冀及其原地建筑事务所作品展开,以长白山河谷别墅群等作品为切入点,尽可能多地去探究建筑建造过程的一些原由故事,倾听设计师还原当时的设计思路,了解作品从无到有精细入微的生长。也许你会因...

    2018-02-08