用王家卫的风格，来做 UI 设计，行得通吗？

针对这个问题，我们先做了一个定向的设计师小调研。超过一半的受访者表示： 不乐观。

在认知当中，王家卫式的风格是浓郁饱满、含糊暧昧的，加之其惯用的蒙太奇剪辑手法，使其电影“风格大于叙事，氛围大于逻辑”，与近年流行的功能极简主义 UI 设计原则大相径庭。

王家卫的风格，在平面设计中，灵。在 UI 设计中，怕是搞不掂。

于是，我们开始看电视研究学习，并找到了我们在 UI 设计中最能化用的两个设计元素：配色和字体。

“红绿”是王家卫的舒适区，“晦暗”是王家卫的风格，“对比”是王家卫的手段。

王家卫电影中的色彩饱满、浓烈，而且经常采用偏色滤镜，这种对色彩的独特处理方式也可以为 UI 设计提供灵感。

我们从《繁花》将近60 张海报/剧照中，筛选出了28 张图片并提取了配色，又从其中寻找出最常用的配色规律，组合出了将近 10 套设计方案，最后挑选出了4 组界面设计案例。

上述的配色方案&设计稿源文件都整理好啦， 点下方链接获取：

https://js.design/f/2KEZUG?p=X8epHgnP6J&mode=design

【图片取色】插件

推荐理由：

选取上传自己喜欢的电影/海报。该插件即可智能识别图片颜色并生成调色板，方便确定配色方案，一键取色。

点击下方链接获取插件：

https://js.design/community?category=detail&type=plugin&id=61c3194d07fb4ab0df657549

【光谱配色】 插件

推荐理由：

“五彩斑斓的黑”到底怎么调？通过这个插件，选取基色，即可自动创建色调、阴影、饱和度及纯度的色彩变体，同时插件还将自动推荐 6 种配色方案。

点击下方链接获取插件：

https://js.design/community?category=detail&type=plugin&id=62a331d07e0b8f1a8dc1793d

字体对王家卫来说至关重要。

毕业于平面设计系的王家卫深谙设计中文字的直观力量，这表现在他喜欢在电影中用纯文字画面、用“印刷字”，以及用“很大的字”。

从 1988 年的《旺角卡门》，到 2000 年的《花样年华》，再到 2023 年的《繁花》，无论外面世界的设计风格如何变化，王家卫的作品中都在竭力用“印刷体”还原时代的特征。

这些特殊、醒目的字体是构建王家卫艺术世界的一部分，更构建了我们对于王家卫作品的群体记忆。

此外，与“繁花”二字同样借鉴了鲁迅萌芽字体的「逐浪萌芽字」也已经上传到即时设计官方内置字体， 搜索「逐浪萌芽字」即可一键 get 同款！

【字加】 插件

推荐理由：

内置万款精品字体，更有字体查找、一键换字、字体管理、商用授权等实用服务，充分满足设计师字体实用需求。

点击下方链接获取插件：

https://js.design/community?category=detail&type=plugin&id=63903114a049837bc11faa5b

【字由】 插件

推荐理由：

内置 3000+精选字体，千款免费字体

点击下方链接获取插件：

https://js.design/community?category=detail&type=plugin&id=61f3a4c225d16c33b63ba7a5

整体而言，王家卫对于“浓油赤酱”却颓废的配色的青睐，“风格大于逻辑”的叙事方式，其浓烈、小众的个人风格意味着其美学并不适用于以快速、简洁、直观为设计原则的大众互联网产品。 因此：

①我们可以在特定的产品中大面积地化用王家卫美学。

这样的设计美学却很适用于时尚、影视、音乐、杂志等文化社区类产品，轻松营造出暧昧的艺术氛围。 在这类产品的设计中可以大胆使用其“糜红”、“颓青”的配色风格。

②也可以在常规 UI 设计中小面积地使用一些“王家卫技巧”。

无论是 UI 设计还是服装设计、平面设计、建筑设计，美的基本原则总是相同，在构建王家卫美学中的一些技巧也都可以为我们的 UI 设计所用。

在互联网产品更加细分、更加需要创新的趋势下，如何用设计的力量，寻找实用之上的美学表达，从而为产品构建特殊的品牌记忆，也值得我们思索。

Powered by Froala Editor