# Skeuomorphism — 디자인 스타일 가이드
## 기본 정보
- **ID**: skeuomorphism
- **카테고리**: design-style
- **연도**: 2000s
## 설명
실제 물리적 객체의 질감과 모양을 디지털 인터페이스에 그대로 모방합니다.
## 역사·배경
Steve Jobs가 디지털 초심자를 위해 물리적 은유를 강조한 결과물. iOS 7 (2013년)의 플랫 전환으로 공식적으로 퇴조.
## 핵심 원칙
- 현실 세계와의 유사성
- 직관적 인식
- 풍부한 디테일
## 주요 특징
- 실제 재질 모방 (나무, 가죽 등)
- 그라데이션과 텍스처
- 그림자와 하이라이트
- 3D 효과
- 사실적인 표현
## 사용 사례
- 고급 모바일 앱 (캘린더, 메모장 등)
- 게임 UI
- 오디오·악기 앱
- 복고 스타일 앱
## 추천 프로젝트 유형
- 게임 UI
- 악기·오디오 앱
- 고급 라이프스타일 앱
- 복고 감성 제품
## 장점
- 디지털에 익숙하지 않은 사용자도 직관적으로 이해
- 고급스럽고 감성적인 느낌
- 현실 맥락이 명확한 앱에서 몰입감 향상
## 단점·한계
- 디자인·개발 비용이 매우 높음
- 고해상도 디스플레이에 최적화 어려움
- 현대적 트렌드와 동떨어진 느낌
- 다국어·다문화 환경에서 물리적 은유가 맞지 않을 수 있음
## 실제 사용 제품·서비스
- 초기 iOS 앱 (iOS 6까지)
- GarageBand (초기 버전)
- Apple iCal 초기
## 접근성
텍스처와 그라데이션이 저시력 사용자에게 혼란을 줄 수 있음. 충분한 색상 대비 확보 필요.
## 관련 스타일
- [retro-vintage](https://ui.buildersgate.com/styles/retro-vintage)
- [claymorphism](https://ui.buildersgate.com/styles/claymorphism)
- [neumorphism](https://ui.buildersgate.com/styles/neumorphism)
## 디자인 토큰
### 색상
- primary: #4A90E2
- secondary: #7B68EE
- accent: #F5A623
- background: linear-gradient(180deg, #E8E8E8 0%, #BCBCBC 100%)
- surface: linear-gradient(180deg, #FFFFFF 0%, #E0E0E0 100%)
- text: #333333
- textSecondary: #666666
- border: #999999
### 헤더
- background: linear-gradient(180deg, #4A90E2 0%, #3A7BC8 100%)
- textColor: #FFFFFF
- accentColor: #F5A623
### 타이포그래피
- fontFamily: 'Lucida Grande', 'Noto Sans KR', sans-serif
- headingWeight: 700
- bodyWeight: 400
- letterSpacing: 0em
### 스페이싱
- unit: 8px
- scale: 1
### 그림자 (Shadows)
- sm: 0 1px 3px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.6)
- md: 0 3px 8px rgba(0,0,0,0.3), inset 0 1px 0 rgba(255,255,255,0.6)
- lg: 0 10px 25px rgba(0,0,0,0.4), inset 0 2px 0 rgba(255,255,255,0.7)
- xl: 0 20px 40px rgba(0,0,0,0.5), inset 0 3px 0 rgba(255,255,255,0.8)
### Border Radius
- none: 0
- sm: 8px
- md: 12px
- lg: 16px
- full: 9999px
### 테두리 (Borders)
- width: 1px
- style: solid
- color: #999999
### 이펙트
- blur: 0px
- opacity: 1
- transition: all 0.2s ease
### 애니메이션
- duration: 200ms
- easing: ease
### 컴포넌트 토큰
- 버튼: shape=rounded / hoverEffect=inset / textTransform=none
- 카드: style=elevated / hoverEffect=inset
- 인풋: style=filled / focusEffect=ring
- 배지: shape=rounded / style=solid
- 아이콘: package=lucide / strokeWidth=2 / defaultSize=24
### 레이아웃
- containerStyle: boxed
- sectionSpacing: normal
### 특수 효과
- glassmorphism: false
- gradientText: false
- animatedBackground: false
- scanlines: false
- noise: true
## API 엔드포인트
- 스타일 상세: https://ui.buildersgate.com/api/styles?id=skeuomorphism
- 디자인 토큰: https://ui.buildersgate.com/api/themes?id=skeuomorphism&merged=true
Skeuomorphism
실제 물리적 객체의 질감과 모양을 디지털 인터페이스에 그대로 모방합니다.
Steve Jobs가 디지털 초심자를 위해 물리적 은유를 강조한 결과물. iOS 7 (2013년)의 플랫 전환으로 공식적으로 퇴조.
주요 특징
- 실제 재질 모방 (나무, 가죽 등)
- 그라데이션과 텍스처
- 그림자와 하이라이트
- 3D 효과
- 사실적인 표현
장단점
장점
- +디지털에 익숙하지 않은 사용자도 직관적으로 이해
- +고급스럽고 감성적인 느낌
- +현실 맥락이 명확한 앱에서 몰입감 향상
단점 / 한계
- −디자인·개발 비용이 매우 높음
- −고해상도 디스플레이에 최적화 어려움
- −현대적 트렌드와 동떨어진 느낌
- −다국어·다문화 환경에서 물리적 은유가 맞지 않을 수 있음
적합한 사용처
사용 사례
- 고급 모바일 앱 (캘린더, 메모장 등)
- 게임 UI
- 오디오·악기 앱
- 복고 스타일 앱
이런 프로젝트에 추천
게임 UI악기·오디오 앱고급 라이프스타일 앱복고 감성 제품
접근성텍스처와 그라데이션이 저시력 사용자에게 혼란을 줄 수 있음. 충분한 색상 대비 확보 필요.
실제 사용 예시
초기 iOS 앱 (iOS 6까지)GarageBand (초기 버전)Apple iCal 초기
UI 컴포넌트 예제
이 디자인 스타일의 특징을 반영한 실제 UI 컴포넌트들입니다.
Realistic Buttons
실제 물리적 버튼을 모방한 디자인
Textured Cards
가죽, 나무 등 실제 재질을 모방한 카드
Leather Texture
실제 가죽의 질감과 색상을 디지털로 재현합니다.
Wood Grain
나무 결을 표현하여 따뜻하고 자연스러운 느낌을 줍니다.
Physical Toggle
실제 토글 스위치를 모방
Realistic Calculator
실제 계산기를 모방한 인터페이스
Notebook Paper
노트 용지를 모방한 디자인
Skeuomorphic design
mimics real-world objects
for intuitive recognition.