Skeuomorphism
スキューモーフィズム / 2000s–2010s / Style / UI Expression
Borrows cues from real materials and tools to make unknown interactions understandable. It names the principle, so Aqua and Brushed Metal are what the principle looked like when one company shipped it.
At a glance
Visual cues
- Leather, metal, paper
- Dimensional shadows
- Real-world metaphors
- Fine textures
Best used for
- Explaining new interactions through familiar tools
- Crafted, tactile experiences
Use this style
Take the compact brief into a project or hand the structured version to an AI tool.
Detailed guidance and sourcesProduction rules, reference works, comparisons, research and citation formats
Dictionary entry
- Type
- A humanist face suited to the purpose
- Composition
- Adopt the structure of the real tool
- Material
- Precision texture only where it serves function
- Caution
- Ornament must not bury the interaction. Expect generations who don't share the metaphor.
- Further study
- early Apple iOS design / Scott Forstall era
Related entries
- Flat Design / Vector Minimalism (フラットデザイン / ベクターミニマリズム)Same UI Expression lineage.Compare Skeuomorphism and Flat Design / Vector Minimalism
- Blueprint (ブループリント)Shared effects: Trust.Compare Skeuomorphism and Blueprint
More from UI Expression
Continue through styles in the same UI Expression family, prioritised by shared effects.
- Responsive Web Design (レスポンシブ・ウェブデザイン)Shared effects: Trust / Intimacy.
- Card UI (カードUI)Shared effects: Intimacy / Trust.
- Conversational UI (会話型UI)Shared effects: Intimacy / Trust.
Browse all UI Expression entries
Cite this entry
The dictionary is meant to be linked to. Take whichever form fits where you are writing.
- Link
- https://indexstyle.org/styles/skeuomorphism
- Markdown
- [Skeuomorphism — IndexStyle](https://indexstyle.org/styles/skeuomorphism)
- HTML
- <a href="https://indexstyle.org/styles/skeuomorphism">Skeuomorphism — IndexStyle</a>