# 拟物化（Skeuomorphism）

镜语 · 版式与界面 / 年代风格

- 别名：拟物、拟物设计、iOS 6 风格、写实界面
- 口语：「像老 iPhone 那种皮革和缝线」「按钮做得像真的开关」「界面有纸和木头的质感」
- 一句话：用皮革、亚麻、纸张、缝线和实体开关模仿真实物件的界面
- 是什么：拟物化界面让数字元素模仿对应的实物外观：通讯录像皮面本子，笔记像黄色便笺纸，开关像真的拨杆。2007–2013 年的 iPhone 与 Mac 应用是代表，用熟悉的材料提示怎样操作
- 缺了就不像：模仿具体材料（皮革、纸、金属）；凹刻文字投影；有体积的实体控件
- 加了更像：缝线；亚麻或木纹底纹；光泽工具栏；纸张卷边阴影
- 适合用在：需要「手感」和信任感的工具：计算器、录音、相机、合成器类应用；复古向的个人主页或产品彩蛋，致敬早期 iPhone 应用；视频里需要一眼认出功能的道具界面，比如笔记本、唱片机、皮质日记
- 看哪里：看背景的亚麻细纹、卡片四周的虚线缝线，以及文字下方 1px 的白色投影：字像压进皮革里。「关注」是一枚会滑动的实体开关，有凹槽、内阴影和高光，拨动时有阻尼感
- 注意：纹理和阴影过重会抢走内容，满屏木纹、皮革很快显得笨重；不要只加阴影就叫拟物：关键是模仿具体物件的材料和结构
- 描述示例：做一个拟物化（Skeuomorphism，iOS 6 时代）风格的联系人卡片：深棕色皮革背景带细腻颗粒和四周虚线缝线，内页是米白纸张质感，四角有轻微阴影卷边；顶部是带竖向高光渐变的蓝灰工具栏，按钮有内凹边框与高光；标题使用凹刻效果（深色字加 1px 白色下投影）；「关注」做成可以拨动的实体开关，有凹槽内阴影和金属滑块；整体温暖、厚实、有真实材料感
- 易混：
  - [扁平化](https://idea.ameng.dev/terms/flat-design.md)：扁平化去掉了全部材料与阴影，只留颜色和形状
  - [新拟态](https://idea.ameng.dev/terms/neumorphism.md)：新拟态只用同色双阴影做凸凹，不模仿任何具体材料
- 相关：[Web 2.0 高光](https://idea.ameng.dev/terms/web-2-0-gloss.md)、[斜面](https://idea.ameng.dev/terms/bevel.md)、[投影](https://idea.ameng.dev/terms/drop-shadow.md)

## 来源与延伸阅读

- [NN/g · Skeuomorphism](https://www.nngroup.com/articles/skeuomorphism/)
- [Web Design Museum · Instagram for iPhone 2010](https://www.webdesignmuseum.org/iphone/instagram-for-iphone-in-2010)

网页版（含演示）：https://idea.ameng.dev/terms/skeuomorphism