视觉风格图鉴
认识100+种视觉风格

平面设计

拟物化设计

让数字对象借用现实物件的外观、声音或行为,帮助人把陌生操作连接到已有经验;问题不在像不像,而在隐喻是否仍然有效。

词源
skeuos(器物)+morphē(形态)
界面盛期
1980年代GUI至2010年代初
常见线索
材质、阴影、机械动作、环境声音

视觉线索

  • 真实材质
  • 光影
  • 立体按钮
  • 物体隐喻
开始观察↓
以真实果皮、叶脉、木纹和自然光影演绎的拟物化设计苹果
当代演绎 · 视觉教学示例

读图

真实感不是目的,熟悉的因果关系才是线索

果皮微孔、叶脉、木桌与定向投影让对象像能被触摸。放进界面时,这些线索只有在提示用途、状态或动作时才有价值;写实渲染本身不等于可用性。

  1. 01

    看材质是否可推断

    果皮反光和微小纹理让人预判表面光滑、略有阻力。

  2. 02

    看光影建立实体关系

    高光、遮挡与投影共同说明体积、前后和接触面。

  3. 03

    看熟悉物件触发记忆

    叶片、木纹和果蒂把图像放进日常经验,识别几乎无需文字。

  4. 04

    追问隐喻能否操作

    若它是按钮,按下、悬停和禁用状态也应像一个连贯物件,而非只有静态皮肤。

一句话理解

把旧物件的形态留在新媒介里,
用熟悉感解释陌生功能

拟物(skeuomorph)原指新材料或新技术保留旧物件中已不再必需的形式。在数字界面中,它常表现为文件夹、废纸篓、翻页、快门声、皮革日历和带高光的按钮。它既可以是视觉模仿,也可以是行为或声音隐喻;核心价值是降低学习成本,而不是把屏幕伪装成一张照片。

视觉语言

隐喻 DNA

01

材质

可感、可推断

纹理与光泽暗示触感和对象类别。
02

光影

体积化、一致

高光、凹槽和投影建立可按压、可抓取的关系。
03

对象

来自熟悉世界

文件、工具、容器和桌面让抽象数据可被理解。
04

行为

遵循隐喻

翻页、旋钮和滑块应提供与外观一致的反馈。
05

声音

补充因果

快门、撕纸或机械回弹可确认动作,但不应妨碍使用。

它从哪里来

在每次媒介转换中,旧形式都曾帮助新技术被理解

拟物不是智能手机时代才有。陶器模仿编织纹路、电灯模仿烛台,都是新技术借旧类型获得文化连续性。图形界面则把办公室和桌面变成操作数据的认知桥梁。

  1. 桌面隐喻进入个人电脑

    Xerox Star、Apple Lisa与Macintosh用文件、文件夹、废纸篓和窗口把命令转化为直接操作。

  2. 控件形成数字器物感

    按钮、滚动条、标签页和工具栏以阴影与边缘提示可点击、可拖动和层级。

  3. 触屏拟物达到高峰

    早期iPhone应用以皮革、纸张、木架和机械控件赋予新触屏熟悉感与个性。

  4. iOS 7公开转向

    物理质感被弱化,清晰、内容和层次成为主轴;真实感更多转向运动而非表面装饰。

艺术家与作品

通过四个界面节点认识它

01

Xerox Star团队

把桌面、文件夹和文档组织成一致的办公室隐喻。
Star 8010界面
02

Susan Kare

为Macintosh绘制友好图标,让磁盘、垃圾桶和工具在低分辨率中可辨。
Macintosh图标
03

Bas Ording

以具有惯性和回弹的滚动行为,让触屏对象获得物理因果感。
iPhone滚动界面
04

Apple iOS团队

在备忘录、日历与Game Center中把纸、皮革和毡布推向强烈的应用个性。
iOS 6内置应用

如何辨认

判断现实线索是否帮助理解数字行为

  • ✓界面是否借用了可明确命名的现实物件或材料?
  • ✓阴影、纹理和声音是否提示用途、状态或操作方式?
  • ✓视觉隐喻与实际交互是否一致,而非只剩装饰皮肤?
  • ✓隐喻是否仍被当前用户理解,并能适应尺寸、语言与无障碍需求?

风格关系

三种借用现实的程度

参考资料

资料来源与说明

苹果图演示的是写实材质和物理光影,而不是一个可交互界面。判断拟物设计必须继续观察控件状态、反馈、学习成本与无障碍表现。

  1. 交互设计百科:Affordances and skeuomorphism ↗
  2. 计算机历史博物馆:Bas Ording oral history ↗
  3. Apple Developer:iOS 7 UI Transition Guide ↗