UXUI 디자인 입문 - 5주차

디자인 원칙

정의

인지심리학의 관점에서 디자인할 때 지켜야 할 규칙을 정해놓은 것

사람들이 편안하게 느끼고 자연스럽게 행동하도록 유도할 수 있고, 사용성이 높은 제품을 만들 수 있도록 도와줘요.

 

종류

1. 게슈탈트 심리학

• 게슈탈트 심리학은 사람이 이미지를 인식할 때 주변에 있는 요소 간의 관계와 맥락에 영향을 받는다는 이론
• 유사성의 원리, 근접성의 원리, 폐쇄성의 원리, 연속성의 원리, 공통성의 원리 등

2. UX 비주얼 디자인 원칙

• UX에 영향을 끼치는 시각 디자인의 원칙을 정리한 것
• 스케일, 시각적 위계, 균형, 대비 등

3. UX/UI 심리학 법칙

• 심리학 법칙은 사람이 어떻게 행동하고, 왜 그런 행동을 하는지를 설명한 법칙
• 제이콥의 법칙, 피츠의 법칙, 힉의 법칙, 밀러의 법칙 등

4. 기업의 디자인 원칙

• 기업의 철학을 담고, 심미성과 사용성이 높은 제품을 만들 수 있도록 제시하는 가이드
• 구글, 페이스북, 에어비앤비, 스포티파이 등 규모가 큰 기업에서는 디자인 원칙을 정한 후 이러한 원칙 아래에서 제품을 만들고 있어요.

---

게슈탈트 심리학

정의

사람이 이미지를 인식할 때 주변에 있는 요소 간의 관계와 맥락에 영향을 받는다는 이론

 

종류

1. 유사성의 원리 The law of similarity : 크기나 형태, 방향, 색 등의 특성이 비슷한 것끼리 묶어서 지각하려는 경향

2. 근접성의 원리 The law of proximity : 가까운 것끼리 묶어서 지각하려는 경향

3. 폐쇄성의 원리 The law of closure : 공백이 있더라도 틈이나 간격을 메워서 닫힌 형태로 인식하려는 경향

4. 연속성의 원리 The law of continuance : 연속적으로 직선이나 곡선을 이루는 요소를 잘 인지하는 경향

5. 공통성의 원리 The law of common fate : 같은 방향으로 움직이는 것들끼리 더 관련성이 높다고 인식하는 경향

 

---

UX 비주얼 디자인 원칙

정의

UX에 영향을 끼치는 시각 디자인의 원칙

• 시각적으로 매력적인 이유를 근거를 들어 설명할 수 있도록 도와줍니다.
• UX 비주얼 디자인 원칙을 잘 활용하면 심미적으로 아름다울 뿐만 아니라 사용성도 높여줍니다.
• 원칙에 따라 잘 설계된 디자인은 사용자가 제품에 몰입하는 것을 도와주고 쓰기에도 편리합니다.

종류

1. 스케일 Scale : 상대적인 크기를 사용하여 구성의 중요도와 순위를 표시

2. 시각적 위계 Visual hierarchy : 중요한 순서에 따라 시선의 흐름이 이동하도록 디자인

3. 균형 Balance : 디자인 요소 간에 적당한 배열이나 비율을 주는 것

4. 대비 Contrast : 눈에 띄게 구별되도록 강조하기 위해 두 요소 간의 차이를 두는 것

 

---

UX/UI 심리학 법칙

정의

심리학 법칙은 사람이 어떻게 행동하고, 왜 그런 행동을 하는지를 설명

• 정량적, 정성적 데이터가 없는 초기 제품에 대한 의사결정의 근거가 되어줍니다.
• 명확한 이론적 근거를 바탕으로 주장할 수 있고, 팀원들을 설득할 무기로 활용할 수 있어요.
• 스스로 좋은 디자인을 할 수 있도록 도와주는 체크리스트가 되어줍니다.
• 사용자의 경험을 근원적으로 이해할 수 있도록 도와줍니다.

종류

1. 제이콥의 법칙 : 사용자는 새로운 제품을 사용할 때도 자신이 이미 알고 있는 익숙한 제품과 같은 방식으로 작동하길 원한다.

2. 피츠의 법칙 : 터치 대상에 도달하는 시간은 거리와 크기와 함수 관계에 있다.

3. 힉의 법칙 : 의사결정에 걸리는 시간은 선택지의 개수와 복잡성에 비례해 늘어난다.

4. 밀러의 법칙 : 보통 사람은 작업 기억에 7(±2)개의 항목밖에 저장하지 못한다.

5. 포스텔의 법칙 : 자기 자신에게는 엄격하고, 남의 것을 받아들일 때는 너그럽게 해야 한다.

6. 피크엔드 법칙 : 인간의 경험은 전체 평균이나 합계가 아니라, 절정의 순간과 마지막 순간에 느낀 감정을 바탕으로 경험을 판단하는 경향이 있다.

7. 심미적 사용성 효과 : 보기 좋은 디자인을 사용성이 더 뛰어난 디자인으로 인식한다.

8. 폰 레스토프 효과 : 비슷한 사물이 여러 개 있으면 그중에서 가장 차이가 나는 한 가지만 기억할 가능성이 크다.

9. 테슬러의 법칙 : 모든 시스템에는 더 줄일 수 없는 일정 수준의 복잡성이 존재한다.

10. 도허티 임계 : 컴퓨터와 사용자가 서로를 기다리지 않아도 되는 속도(0.4초 이하)로 인터랙션하면 생산성이 급격히 높아진다.

 

---

기업의 디자인 원칙

정의

기업의 철학을 담고, 심미성과 사용성이 높은 제품을 만들 수 있도록 제시하는 가이드

• 기업과 제품의 비전을 공유합니다.
• 공통된 느낌을 주는 일관된 원칙을 제시합니다.
• 심미적인 UI와 인터렉션을 구현하는 동시에 사용성을 지키는 방법을 안내합니다.
• 의사결정 기준이 되고 시간을 절약합니다.

---

 과제 - 디자인 원칙의 실제 사례 분석