Skeuomorphism · 2007–2012 iOS 黄金时代

触手可及的
真实质感

以木纹、皮革与拉丝金属重构数字界面:8–12 段复杂渐变模拟真实光照,噪点颗粒还原材质肌理,多层写实阴影塑造景深,300–500ms 的拟真动效让每一次按压都仿佛触碰真实器物。

类别General 通用风格
年代2007–2012 · iOS 拟物时代
复杂度High 高
最适合奢华品牌 / 游戏 / 沉浸叙事 / 教育

风格特性

拟物化用真实世界的隐喻降低认知成本——旋钮可以转、皮革能缝线、金属会反光。

写实材质纹理

木纹、皮革与金属以噪点、颗粒与纹理叠加层层还原,让界面拥有可辨识的物理触感与温度。

多层写实阴影

内侧高光、环境光遮蔽与外投影三层以上叠加,明确光源方向,塑造可信的立体深度。

拟真触感动效

按压下陷、旋钮扭转与滑块阻尼,均以 300–500ms 的物理缓动呈现,反馈厚重而真实。

按钮与控件

黄铜、拉丝银与雕刻边框:悬停增亮上浮,按下则陷入面板,禁用态褪色蒙尘。

精选工艺 悬停 / 按压 / 禁用状态均有差异反馈

表单示例 · 预约工坊参观

输入框如凹陷进羊皮纸的刻槽,聚焦时以黄铜色焦点环示意当前位置。

配色板

取自真实材质:胡桃木、深皮革、黄铜与拉丝银,铺在温润的羊皮纸底色上。

胡桃木#8B5A2B
深皮革#5C3A21
黄铜#D9A32F
拉丝银#C0C0C0
羊皮纸#F0E6D2
炭木#2B1D12

字体级阶

显示级 · Playfair Display 800 · 40px

以手艺致敬真实

标题 · Playfair Display 700 · 28px

材质、光影与温度

正文 · Inter 400 · 16px

拟物化界面借助真实世界的质感与物理反馈,让用户凭直觉理解每一个控件的用途与状态。

标签 · Inter 600 · 13px · 字距 0.12em

Skeuomorphism · 拟物