越简单的设计越让人印象深刻

而白色又一直都是设计中的经典用色

在今夏想清爽舒适，又要美得发光

一身“All-White”的穿搭

保证你也可以像大表姐和何仙姑一样

穿出高级时尚感

然而，这不是一篇时尚穿搭指南，

作为一个专业的UI设计技术号，

想和大家聊聊最近在网上流传的

谷歌全新的 Material Design，

选择了“All-White”这个爆款的设计风格，

虽然并非官方发布，

但也把Google推上了UI设计的风口浪尖，

成为时尚的弄潮儿。

在 Youtube 上疯传的视频中 谷歌的Material Design 的风格得到了进一步的进化和重新的设计，非常有趣。而更有意思的地方在于，视频在不久之后又被下架了，令人琢磨不透又无比的好奇。

据说视频本身并非偷跑的内容，但是也非官方的发布，那么这个“All-White”的设计风格到底是设计师的二次创作，还是马上要应用的宣传，时间会告诉我们一切。

视频中展示的界面设计的细节，可以看出借助留白和排版技巧，搭配更加清爽的白色背景和线性图标，创造出更加现代、简约的 UI设计。

+++   字体变化   +++

+++   动效变化   +++

+++   Button变化   +++

+++   图标变化   +++

+++   整体效果   +++

+++   UI设计变化   +++

先看看之前的 Material Design 的设计风格吧，典型的卡片式设计，大色块和带有非常显著的阴影。在整个布局当中，带有色彩的 UI 控件是非常典型的 CTA 元素，在层级上也是最为靠前的。

相比之下，在这个重设计方案中，阴影虽然得到保留，但是总体上适当地淡化了，显得更加微妙，而抓人眼球的圆形按钮也更多地被白色的按钮+彩色图标的方案所替代。

另一方面，被选中的条目也采用了非常浅的色彩来进行标识，这也将这一版「微妙」的色彩使用体现得淋漓尽致。

UI 布局的层次感不再使用色块和卡片来进行显著的区分，而是更多借助留白和远近距离控制，来赋予整个 UI 以层次感。诸如被选中的元素，也叠加上了和当前界面配色一致的浅色，这种设计让整个 UI设计更加具备一致性和统一性。

下面是 Google 旗下 APP 当前的 UI设计，可以说是非常标准的 Material Design 了。

相比之下，重新设计的 APP 的 UI界面非常符合大家所描述的“All-White”的特征，大面积的色块都已经被移除，大面积的白色背景营造出足够现代简约的感觉。

+++   设计中的留白   +++

说到“All-White”，又不得不提到设计中的留白。

留白还有助于引导视线，为设计建立层次，区分什么是重点和关键点。视线会立即移动到被留白包围的元素上。留白为其中的元素增添了冲击力。

留白是创造平衡、协调的工具，也是组织网站内容的基础。没有留白，如何为元素分组？如何找到导航？你又怎么知道滚动有更多内容，或是应该从左上往右下浏览？所有这些视觉线索，都来自于设计中留白的合理运用。

虽然有效使用留白是任何设计的重要部分，还是有些地方值得注意。

重点使用留白的地方：

logo周围

每个导航按钮或图标周围，并围绕这些元素的“容器”

在两列文字间，在主体部分与边栏之间

当你使用视觉差效果时，在每页“滚屏”之间

在所有不同的元素之间，比如照片和文字之间，或是主体内容与页尾之间

“白”，是无，它可以更多更广阔的呈现“有”。如果可以灵活的运用“白”，除了可以使版面整洁，还可以为作品锦上添花，画龙点睛。