跳过导航
Skeuomorphism illustration done in Sketch
学习设计

拟物化设计完整指南

关于逼真设计艺术的所有你需要知道的一切

当 Apple 在 2013 年使用“扁平”设计重新设计 iOS 时,许多人认为拟物化已经消亡。其他人仍然是坚定的粉丝。如果你问我们 — 或者 GitHub 的产品设计师 Gavin Nelson — 早期的 2000 年代的拟物化设计可能只是“好事太多”的情况。

如今,拟物化设计正在主流设计中卷土重来 — 但这次,更加微妙。如果你想开始使用拟物化设计,我们已经为你准备好了!在这篇文章中,我们将了解什么是拟物化,以及它与扁平化设计和新拟物化的区别。我们还将分享一些示例和一个快速教程,以确保你准备好立即上手。

让我们开始吧!

拟物化和拟物化设计

什么是拟物化?

拟物化设计试图模仿现实生活中物体的尽可能多的品质。它超越了形状和颜色,而是专注于纹理、光影、尺寸,最重要的是:用途。

拟物化可以追溯到古希腊,当时 陶工会制作模仿金属的手柄。因此,我们今天使用的术语来自希腊语单词“skeuos”也就不足为奇了,意思是容器或容器,以及英语后缀 -morphism,意思是形状、形式或结构的状态

但是,当我们今天所知的 UI 设计时,拟物化随着第一款 iPhone 的问世而蓬勃发展。史蒂夫·乔布斯认为,为了增加 易用性UI 元素应尽可能地模仿现实生活中的物体。例如,看起来像记事本的 Notes 应用程序。随着人们越来越熟悉 iOS 界面,Apple 的团队意识到用户不再需要回调到现实生活 — 因此他们对整个 UI 进行了改造。

扁平化设计 vs 拟物化

当拟物化图标变得众所周知时会发生什么?许多人会说,用户不再需要复杂的设计来识别图标的功能。这正是 Apple 在推出 iOS 7 时所证明的。

Image of two iPhone mockups, one running iOS 6 and the other running iOS 7

iOS 6iOS 7 的并排比较显示了 Apple 的风格如何彻底改变为几乎没有阴影或纹理的扁平设计。

为了提高加载速度并整理数字接触点,设计师开始将拟物化设计剥离到其本质。这是扁平化设计的基础。体积、纹理和大量颜色使用是一些主要的事情。设计师开始为他们的工作采用无衬线字体,并开始使用单一鲜艳的颜色或有限的调色板。你可能想知道扁平化设计是否是拟物化的对立面 — 但事实真是如此吗?

反拟物化?

作为人类,我们倾向于将事物视为非黑即白。当出现一种新趋势时,很容易将其视为一个新时代的开始 — 以及旧潮流的结束。当我们进入 2010 年代时,肯定有理由远离拟物化。随着数字营销变成战场,性能和效率成为类似产品海洋中的关键差异化因素。

扁平化设计制作更快 — 加载也更快。一旦它被确立为一种趋势,它也成为用户现代性的标志。即使在今天,反拟物化仍然存在,部分原因是速度仍然是王道。部分原因是下一个设计趋势尚未接管。或者接管了吗?

拟物化 vs 新拟物化

事实证明,毕竟一个新来者。从拟物化的创造者那里:新拟物化。是的,这就是发音 拟物化 — 一个适合拟物化和(你猜对了)扁平化设计爱情结晶的名字。而且,如果你问我们,我们认为这是两全其美的。

确实,应用程序和网站仍然需要快速,尤其是如果他们想在搜索引擎和应用商店中排名靠前。但是过度使用极简主义设计也使某些界面有点……扁平。这就是为什么设计师一直在尝试使用新拟物化,为他们的设计添加深度和颜色。主要成分?对光影的运用。

A hydration app design made by Andrei Simion

这是 Andrei Simion 的一个很好的例子,他在整个设计中都应用了新拟物化。

拟物化示例

因此,现在你已经很好地理解了什么是拟物化以及它的来源,现在是时候看看它在野外了。以下是一些你可以使用拟物化设计做的很棒的例子

A music app design made by Charlotte Doughty

Charlotte Doughty 的音乐应用程序已经过时了。

A camera app icon design made by Tiago Alexandrino

Tiago Alexandrino 对相机图标的看法。

A winamp skin design made by Anja

Anja 的 Winamp 皮肤,带来千禧一代的怀旧感。

A synth plugin redesign by Isaac Sanchez

Isaac Sanchez 的合成器插件重新设计。

如何创建拟物化设计

我们自己的 Tiago Alexandrino 整理了下面的快速教程,以帮助你开始使用拟物化设计。有问题吗?他很乐意通过 TwitterLinkedIn 回答。

有一些拟物化设计要炫耀吗?我们目前正在运行 #Sketchmorphism 挑战赛!在我们的 Twitter 上阅读所有关于如何赢得一个(或两个)HomePod mini 的信息。

您可能还喜欢

免费试用 Sketch

无论您是 Sketch 的新手,还是回来看看有什么新功能,我们都会让您在几分钟内设置好并准备好完成您最好的工作。

免费开始
免费开始