본문 바로가기
iOS/Dreamin iOS Course

[앱기획] Skeuomorphism (스큐어 모피즘)

by HaningYa 2020. 8. 4.
728x90

 

왼쪽? 오른쪽?

형태는 기능을 따른다.

루이스 설리반, 건축가 1896


디지털 스큐어 모피즘

아날로그적인 향수를 불러일으켜 사용자에게 현실세계와 대응하는 일을 환기시키는 디자인

  • iOS7 이전의 디자인 컨셉
  • 그리스어원 스큐어:용기 - 모프: 형
  • 원래 필요에 의해 만들어진 뒤 장식으로 남아 있는 것
  • 기능과 무관하게 아날로그적인 향수를 자극하기 위한 장식요소

iOS 스큐어모피즘의 예시

 

X4. GUI 이해하기— 스큐어모피즘과 플랫디자인

이번에는 GUI의 그래픽적 방향에 대해 살펴보려고 합니다.

medium.com

 

디자인적인 요소들이 목표로 하는 행위에 대해 반드시 필요한 것인가?

를 생각해 보자

iBooks 의 경우 페이지를 넘길 때 책장이 넘어가는 듯한 애니메이션을 볼 수 있다.

뒤 비침까지 구현해놨다.

과연 이것이 책의 컨텐츠를 읽는 목표에 대해 도움이 되는 건지 방해가 되는 요소인지 생각해 보게 된다.

(최근엔 iBooks 도 Scrolling 을 지원한다.)


스큐어 모피즘의 대표사례 - PassBook (현 Wallet)

 

디지털 티켓 상단에 원형으로 잘려진 디자인 요소도 스큐어모피즘적인 요소로 볼 수 있다.

압권은 티켓을 버릴때 말그대로 세절기에 티켓이 갈린다.

전혀 필요없는 애니메이션이다.

 


기본적으로 UI 는 현실의 메타포로 출발한다.

아래의 플로피 디스크를 보면 저장버튼이라고 생각하게 되는 것 처럼.

2012년 쯤에 플랫 디자인과 스큐어 모피즘이 대립되고 

애플은 S/W디자이너를 Ive로 바꾸고 디자인을 확 바꾼다.

짤방도 많은 아이브 형님
iOS6 -> iOS7

 

iOS 6 vs iOS 7 design differences comparison: the end of skeuomorphism

Apple's former iOS chief Scott Forstall has been a big proponent of skeuomorphism, and has enjoyed the full support of Steve Jobs through the years, resulting in the all-too-familiar sights there, like tape reels, notebook springs, fake wood, virtual leath

www.phonearena.com


디자인 테마

공식문서에서 확인할 수 있다.

 

Themes - iOS - Human Interface Guidelines - Apple Developer

iOS Design Themes As an app designer, you have the opportunity to deliver an extraordinary product that rises to the top of the App Store charts. To do so, you'll need to meet high expectations for quality and functionality. Three primary themes differenti

developer.apple.com

 


728x90

댓글