Microsoft Fluent Design System
就在刚刚举办的 Microsoft Build 2017 中,微软对外公布了它们最新的设计语言——“Fluent Design System”。
就在刚刚举办的 Microsoft Build 2017 中,微软对外公布了它们最新的设计语言——“Fluent Design System”,这一消息给广大设计师又带来了一针强心剂,作为软件大鳄的微软也开始要在设计语言的道路上扮演一个指路人的角色了吗?
在视频中,他们分别提出了 Light、Depth、Motion、Material、Scale 几个理念,让我们通过官网的解释以及结合视频看看这几个理念分别表示什么。
另外,由于 Fluent Design 的官网是不兼容 Chrome 的(简直不可思议),所以需要通过 Safari 或者 Edge 浏览器查看。
1、Light
官方将 Light 解释为“光”并且引入到了设计语言中,认为光是一种能够给用户提供邀请的交互方式,通过照亮其他元素吸引用户,同时因为它本身涵盖的“温暖”特质同样能够与“邀请”相辅相成。
Material Design 通过光引入了 Shadow,而 Fluent Design 引入了 Light,不得不说它们都希望把自己的设计语言立意在大自然的基础上,从而更贴近人们的生活,在交互中尽可能调用用户的“自主心智”理解设计。
2、Depth
对 Depth 的理解与官方解释基本一致,Fluent Design 同样打破平面理念引入了三维空间的概念,将 Z 轴也考虑到了设计和交互中(类似 Material Design 的 Elevation),从而增加设计载体的空间,让更多设计的交互体现方式与生活相辅相成,同样也是为了在 VR/AR 中能够采用这套设计规范。
3、Motion
动效以及运动模式已经成为了一个优秀产品必不可少的一环,同样也类似 Material Design Motion 一样,Fluent Design 应该也会在这块提出更多的合理指导意见,从而让自身平台产品在运动模式这块有更多参考。
4、Material
从官方解释来看,Material 这个特性是为了强调设计语言中关于材料的概念,在符合条件的产品中采用自然界中与其相契合的材料表现(例如毛玻璃材料、纸张材料等),从而给用户合理的心理感知和体验,这也是将设计与生活以及自然界结合的一种理念。
5、Scale
视频在这里引入了几个不同规模的交互场景(小屏幕触控、VR 大场景交互),意义应该是要表明该设计语言能够 cover 住所有规模的场景设计需求(果然野心够大),看了下官方对这个理念的解释,基本契合。
最后我们再看看视频结尾的一些基于该设计语言制作的演示内容:
演示中甚至涵盖了 VR 和 AR,看来微软这次确实在下一盘大棋,虽然有些都是概念设计,但是设计界就是需要有这样的突破性思维和想法,才有可能创造出更富有前瞻性的设计语言。
Microsoft Fluent Design System的更多相关文章
- [UWP]如何使用Fluent Design System (下)
4. 兼容旧版本 FDS最常见的问题之一是如何与Fall Creators Update之前的版本兼容,其实做起来也挺简单的,ColorfulBox就实现了Creators Update与Fall C ...
- 微软最新设计Fluent Design System初体验
微软最新设计Fluent Design System初体验 本文图片不全!建议移步知乎专栏查看!!! https://zhuanlan.zhihu.com/p/30582886 原创 2017-11- ...
- 流畅设计 Fluent Design System 中的光照效果 RevealBrush,WPF 也能模拟实现啦!
UWP 才能使用的流畅设计效果好惊艳,写新的 UWP 程序可以做出更漂亮的 UI 啦!然而古老的 WPF 项目也想解解馋怎么办? 于是我动手实现了一个! 迫不及待看效果 ▲ 是不是很像 UWP 中 ...
- [UWP]如何使用Fluent Design System (上)
1. 前言 微软在Build 2017中公布了新的设计语言Fluent Design System(以下简称FDS),不过官网只是堆砌了各种华丽的词语以及一堆动画.至于在UWP中要做成怎么样,怎么做, ...
- DevExpress WinForms使用教程:WinForms Fluent Design和Acrylic Effects
在先前的版本发布中,宣布支持Fluent Design Form和Acrylic effects——旨在复制Microsoft下一代UI metaphor的新功能.本文主要介绍如何实现此功能,并明确说 ...
- [UWP]推荐一款很Fluent Design的bilibili UWP客户端 : 哔哩
UWP已经有好几个Bilibili的客户端,最近有多了一个: 哔哩 - Microsoft Store 作者云之幻是一位很擅长设计的UWP开发者,我也从他那里学到了很多设计方面的技巧.它还是一位Bil ...
- 设计系统(Design System),设计和开发之间的“DevOps”
最近,我们网站的上新增了几个新功能,比如通过导航栏的QR Code可以下载App:通过Carousel的方式,显示多条信息. 以往这样的功能可能需要2-3个Sprints完成,但是现在这些功能都是在一 ...
- design language
design language https://en.wikipedia.org/wiki/Design_language 设计语言(设计词汇)是一种超架构的方案和风格, 它用于指导产品组件或者架构配 ...
- [UWP]浅谈按钮设计
一时兴起想谈谈UWP按钮的设计. 按钮是UI中最重要的元素之一,可能也是用得最多的交互元素.好的按钮设计可以有效提高用户体验,构造让人眼前一亮的UI.而且按钮通常不会影响布局,小小的按钮无论怎么改也不 ...
随机推荐
- ubuntu 18.04 修改 固定ip
Linux(ubuntu)下固定IP的方法 写在前面,问:为什么要固定ip.答:要知道固定IP的好处多多,随意搬动,固定共享地址,不怕断网等等 首先,我们要选取一个局域网内的IP,方法如下: 1. ...
- web 服务器安全防范
apache 关闭目录 配置文件:安装目录/Apache/conf/httpd.conf <Directory /> #默认就会把/ 的目录暴漏出来:关闭方法: Options -Inde ...
- 最近做了一个短网址服务 di81.com
最近做了一个短网址服务: di81.com 项目中有一处需求,需要把长网址缩为短网址,把结果通过短信.微信等渠道推送给客户.刚开始直接使用网上现成的开放服务,然后在某个周末突然手痒想自己动手实现一 ...
- Party All the Time(三分)
In the Dark forest, there is a Fairy kingdom where all the spirits will go together and Celebrate th ...
- 116th LeetCode Weekly Contest N-Repeated Element in Size 2N Array
In a array A of size 2N, there are N+1 unique elements, and exactly one of these elements is repeate ...
- 理解Call、Apply、bind
Apply.call 共同点: 为了改变函数执行时的上下文(简单说就是为了改变当前函数体内的This的指向) 不同点: 传入的参数不一样,func.apply(this,[arg1,arg2]).fu ...
- Web API 解决跨域问题
一.跨域问题的由来 同源策略:出于安全考虑,浏览器会限制脚本中发起的跨站请求,浏览器要求JavaScript或Cookie只能访问同域下的内容. 正是由于这个原因,我们不同项目之间的调用就会被浏览器阻 ...
- PIE SDK PCA融合
1.算法功能简介 PCA 融合分三步实现,首先将多光谱数据进行主成分变换,然后用高分辨单波段替换第一主成分波段,最后进行主成份逆变换得到融合图像. PIE支持算法功能的执行,下面对PCA融合算法功能进 ...
- 常用维护SQL-数据清理
truncate某个库的表数据 show full processlist; select concat('truncate table ',table_schema,'.',table_name,' ...
- Docker学习笔记--Docker 启动nginx实例挂载目录权限不够(转)
今天在启动一个docker 运行nginx实例,在挂载目录时,出现访问静态目录时,权限不够 执行的命令是: docker run --name my-nginx -d -p 80:80 --resta ...