[본캠프2일차] 애플의 Human Interface Guidelines, 구글의 Material Design

1. 디자인 가이드라인

[브랜드의 디자인 원칙 + 컴포넌트별 규칙을 정의한 것]

=>  쉽게 말해  '사전 or 설명서' 지침서를 말함.

 

디자인 가이드라인 = 디자인 시스템 = 스타일 가이드 [모두 같은 말]

>반복되는 디자인 요소의 원칙을 정해둔 것

 

• 디자인 가이드라인의 좋은점

#기업

-브랜드 "아이덴티티"를 강력히 유지 가능

-디자이너 간의 결과물의 수준을 "샹향 평준화" 함

 

#디자이너

-미리정의된 컴포넌트를 "재사용"->불필요한 업무 감소

 

#사용자

-원칙에 따라 디자인된 화면을 통해 "일관된 사용자 경험' 을 얻음. <예칙가능, 불편감 감소>

 

• 애플+구글 가이드라인은 =>UIUX의 근간이 됨.

애플 iOS + 구글 Android =>전세계 운영체제 시장의 99%

 

#애플

1) HIC, 히그(Human Interface Guideline)

- HIC는 애플 생태계 내에서 플렛폼 간(맥, 아이폰, 아이패드....etc)의 흐름을 끊김없이 이어질 수 있도록 함.

>이를 통해 "이어지는 경험"을 제공할수 있도록 지원하기위해 HIC를 만듬.

 

2) 앱의 인터페이스->더욱 '일관'되고 '직관적' 으로 만듬->사용자 경험 향상

 

3)여기서 중요한점.

앱스토어에 등록되는 모든 애플리케이션은 '심사'를 받음>이때, HIC를 지키지 않으면 앱등록이 "거부" 될 수 있음.

 

#Modal 컴포넌트

- 사용자에게 '임시' 로 컨텐츠를 보여줌.

 

#구글

1) Material Design

#Accessibility(어셉스빌리티)

-접근성->장애 or 불편함 을 가진 사람 모두가 제품을 잘 사용할 수 있도록 '사용성' 을 높이는 원칙.

  ex) 색약이 있는 사용자도 있을 수 있기 때문에> 색상의 대비는 3:1 이상일 것.

 

#반응형 레이아웃-> 다양한 디바이스에 대응

 

/*구글은->첫번째로 "접근성"을 두고 머터리얼 디자인의 "기본 가치"라고 소개함.

 

#Elevation=엘리베이션<멀티 리얼 디자인>

- Elevation은 '플랫 디자인의 장점' 을 살리면서도 "빛에 따른 종이의 '그림자' 효과" 를 사용->"입체감"을 살리기 위한 목적

높이에 따라 컬러와 그림자로 달라지는 스타일 구현

 

2. UIUX 역사와 트렌드

1. 리얼메타포
2. 스큐어모피즘
3. 플렛디자인
4. 뉴모피즘 양식

1) IBM  HCI(Human Computer Interation) 디자인 팀

> 실제 물건을 '모방' 하여 디자인

but, 실제 사용자들은 사용성이 좋지 않다, 외면 받음.

 

2) 스큐어 모피즘(리얼메타포를 전승•발전)

>디자인에 많은 시간이 필요하다는 '맹점'

- 실제 물건의 특징을 최대한 반영.

- 디지털 화면 에서도 어려움 없이 사용할 수 있도록 "의도" 한것.

ex) iOS의 나무질감을 살린 책꽂이, 카메라 조리개, 게이지/버튼의 조작부가 실제와 비슷하게 동작하는 녹음기.

 

3) 플랫디자인

>애플이 iOS7에서 처음 선보인 GUI양식

 

4)뉴모피즘

>단순한 디자인 + "그림자" 를 통해 '대상을 구분'-> "볼륨감을 부여" 하는 것이 특증

플랫디자인은 시각적인 구분 불명확함+스큐어 모피즘은 실물의 입체감을 구현함(플랫디자인의 시각적효과를 통해 보완)