[UX, UI 디자인 입문 1주차]학습일지

 

1-2 ~ 1-6 학습내용

ㆍ UX와 UI란 뭘까?

 

우선 UI는 목적을 달성하기 위한 행동을 할 때 무언가와 상호작용을 하는 것을 도와주는 수단

UX는 무언가 상호작용을 하면서 경험하는 모든 것

 

ㆍ예시

 

- NB가 시리얼을 먹기 위해 그릇과 숟가락을 준비했습니다 → UI

 

- NB가 슈퍼에서 사 온 여러 가지 시리얼 중에서 어떤 것을 먼저 먹을지 고민을 합니다. 새로 나왔다고 하는 딸기향맛 시리얼과 시리얼 회사의 오랜 역사를 지내온 오리지널 시리얼 2가지를 먹으려 합니다. 신제품이 맛이 궁금하니 그릇에 덜어 향을 먼저 맡고 먹어봅니다. 오리지널도 맛있지만 TVCF를 많이 밀어주는 신제품답게 맛있습니다!  → UX

 

ㆍUI 디자이너

- 화면의 전체적인 구조와 시각적인 요소들을 디자인하는 사람

- 시각적인 요소를 활용하여 화면 간의 관계와 인터페이스의 구성을 디자인하는 것에 집중

- 주 업무는 레이아웃, 색상, 크기와 정렬, 컴포넌트라고 부르는 버튼, 아이콘, 이미지 등을 디자인하는 것

- 회사에서 따라서 GUI 디자이너라고 부르기도 합니다.

 

ㆍUX 디자이너

- 사용자가 어떤 제품이나 서비스를 이용하면서 느끼는 총체적인 경험을 디자인하는 사람

- 사용자를 분석한 데이터를 토대로 편리한 경험을 이끌어내기 위한 일에 집중

- 주 업무는 유저 리서치와 테스트, 정보 구조 설계, 페르소나와 유저 시나리오 작성

- 업무내용으로는 조사와 분석의 비중이 큽니다.

 

ㆍ 프로덕트 디자이너

- UI와 UX를 포함하여 제품 전반의 경험을 디자인하는 사람

- 요새는 다수의 기업, 특히 스타트업에서 UX/UI 디자이너를 아울러 프로덕트 디자이너로 부릅니다.

- 제품의 특정 부분이 아니라 사용자가 경험하는 제품의 시작과 끝 모두를 담당하며, 반복적인 개선을 통해 제품을 고도화하는 일에 집중

- 주 업무는 문제 정의, 가설 설정, 설루션 도출, 테스트 등

 

 

ㆍ디자인 가이드라인

- 디자인 가이드라인은 일반적으로 브랜드의 디자인 원칙과 컴포넌트별 규칙을 정의한 것

- 일관된 디자인을 하기 위한 지침서

- 컬러, 버튼, 폰트, 컴포넌트 디자인의 스타일부터 브랜드 철학이나 디자인 원칙까지 다양한 것들이 포함

- 기업에 따라 디자인 가이드라인을 디자인 시스템이나 스타일 가이드로 나눠 부르기도 합니다. 용어는 다르지만, 반복되는 디자인 요소들의 원칙을 정해둔 것이라는 점에서 기본적인 개념은 같습니다.

- 규모가 있는 기업은 대부분 디자인 가이드라인을 만들고 오픈소스로 웹사이트에 공개해 두고 있습니다 그중 대표적으로  애플의 Human Interface Guidelines, 구글의 Material Design이 있습니다.

 

ㆍ 왜 디자인 가이드라인을 읽어야 할까?

- iOS 아이폰 애플과 AOS 안드로이드 운영체제는 전 세계 운영체제 시장의 99%를 차지하고 있습니다.

- 대부분의 앱은 이 두 운영체제 위에서 동작하기 때문에 운영체제의 규칙이 디자인에도 영향을 줍니다.

- 일반적으로는 한 화면을 디자인해 iOS와 안드로이드 모두 동일하게 적용합니다. 

 

ㆍ 두 디자인 가이드라인을 읽으며 얻을 수 있는 것

- 사용자 경험을 위해 인터페이스를 설계하는 기본 원칙을 배울 수 있습니다.

- 애플과 구글의 서로 다른 UX/UI 지침을 비교할 수 있습니다.

- 애플과 구글에서 제공하는 리소스를 다운로드하여 살펴보고 디자인에 활용할 수 있습니다.

 

==============================================================================

#리얼 메타포

- 스큐어모피즘 양식의 전신인 리얼메타포 양식은 90년대에 등장
- 대표적으로 IBM의 Real Thing 프로젝트
- IBM HCI 디자인팀은 초보자들도 컴퓨터를 쉽게 이용할 수 있도록 실제 물건을 모방해 디자인했으나, 기조 GUI
(그래픽 유저 인터페이스) 양식이 사용자 친화적이지 않고 사용성이 좋지 않다고 생각했기 때문입니다.
- 디자인은 혁신적이었으나 실제로는 사용성이 좋지 않아 사용자들에게 외면받음

#스큐어모피즘

- 2007년 아이폰과 함께 등장한 양식
- 실제 물건의 특징을 최대한 반영하여 사용자들이 기존의 실제 물건을 사용하던 그대로 디지털 화면서에도 어려움 없이 사용할 수 있도록 의도하였다.
- iOS의 나무 질감을 살린 책꽂이, 게이지와 버튼의 조작부가 실제와 비슷하게 동작하는 녹음기, 카메라 조리개를 그대로 옮겨온 카메라 효과가 대표적이다.

#플랫디자인

- 애플이 iOS7에서 처음 선보인 GUI양식
- 스큐어모피즘은 실물과 유사한 모습으로 사용성을 높인다는 장점이 있지만 실물과 가깝게 표현하기 위해 디자인에 많은 시간이 필요하다는 맹점이 있었습니다.
- 더불어 사람들도 다년간 스마트폰을 사용해 오면서 인터페이스를 조작하는 능력이 늘었기에 이전처럼 자세하게 디자인하지 않아도 어느 정도 UI를 이해할 수 있게 되었습니다.
- 또한, 점점 기술의 발전으로 스크린 크기가 다양해지면서 반응형으로 효율적인 디자인을 할 필요성이 커졌습니다.

#뉴모피즘

- 스큐어모피즘+플랫디자인의 장점만 결합한 디자인 트렌드로 떠오르고 있습니다.
-플랫 디자인의 단점인 시각적인 구분의 불명확함을 실물의 입체감을 구현하는 스큐어모피즘의 시각적인 효과를 통해 보완하였습니다.
-단순한 디자인을 가져가되 그 안에서 그림자를 사용해서 대상을 구분하고 볼륨감이 부여하는 것이 특징