#351
視覚デザイン
#351スキューモーフィズム
スキューモーフィズム
別名・表記:Skeuomorphism
UIXHERO Definition
「現実世界の物質的な特徴」をデジタルインターフェースに模倣するデザイン手法。メタファーを通じて直感的な理解を助けるが、過度な装飾はノイズにもなる。
概要
ギリシャ語の「道具(Skeuos)」と「形(Morphe)」を組み合わせた言葉。現実世界の物質的な質感、形状、挙動を、デジタルインターフェース上で模倣するデザインスタイル。 Appleの初期のiOS(革のテクスチャの手帳、リアルな電卓)が代表例。ユーザーが現実世界の経験(メンタルモデル)をそのまま適用できるため、デジタル機器に不慣れな人でも直感的に操作できる。
UXでの活用
- スイッチのON/OFF: デジタルのトグルスイッチでも、物理的なスイッチのようにスライドしたり、色が鮮やかに変わったりすることで、現在の状態と操作方法を直感的に伝える。
- ゴミ箱: ファイルを削除する場所に「ゴミ箱」のアイコンを使い、ドラッグ&ドロップで「捨てる」というメタファーを使うことで、説明書なしで機能を理解させる。
- カメラアプリのシャッター音: デジタルカメラにはフィルムを巻き上げる音もシャッター幕の音も不要だが、あえて「カシャッ」という音(聴覚的スキューモーフィズム)を鳴らすことで、「撮影できた」という確かなフィードバックを与える。
💡 使いどころ
高齢者向けアプリや、全く新しい概念のツール。現実の物理法則(影、質感、音)を模倣して、使い方のヒントを与える(アフォーダンス)。
⚠️ 注意点・誤用
過度なスキューモーフィズムは、画面の領域を無駄にし、ロード時間を増やす。現在は「フラットデザイン」や「ニューモーフィズム」が主流だが、直感性が必要な部分には依然として有効。
具体例
- 本棚のように見える電子書籍リーダー
- アナログ時計のデザインをした目覚ましアプリ
出典・参考文献:
- Don Norman: The Design of Everyday Things
- Apple Human Interface Guidelines
- Alan Cooper: About Face
- Luke Wroblewski: Mobile First