Notice
Recent Posts
Recent Comments
Link
«   2026/04   »
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30
Tags
more
Archives
Today
Total
관리 메뉴

개미는 뚠뚠

아티클 스터디 : 예쁜게 좋은 사용자: 심미성과 사용성 사이의 밀당 본문

-250819/Study

아티클 스터디 : 예쁜게 좋은 사용자: 심미성과 사용성 사이의 밀당

헤짱이 2025. 5. 29. 18:02

원문: https://brunch.co.kr/@greening/30

 

07화 예쁜게 좋은 사용자: 심미성과 사용성 사이의 밀당

[UX] 예쁜데 어려운 GUI vs 쉬운데 못생긴 GUI | '사람들은 예쁜 제품을 더 쉽게 용서한다.' – 도널드 노먼 (Aesthetic-Usability Effect) 심미성은 제품의 첫인상을 결정짓는 강력한 요소입니다. 다만, 단순

brunch.co.kr


사람들은 예쁜 제품을 더 쉽게 용서한다.
- 도널드 노먼 (Aesthetic-Usability Effect)

심미성은 제품의 첫인상을 결정짓는 강력한 요소다. 심미성과 사용성 사이에서 균형을 잘 맞춘 사례를 분석하고 아름다우면서도 유용한 UI를 설계하는 방법을 탐구해본다.

 

1. 예쁘면 잘 작동할 것처럼 보인다.
하지만 기능과 미의 밸런스를 맞춰야 한다.

* 심미적 사용성 효과: 사용자는 미적으로 우수한 제품을 더 직관적이고 신뢰할 수 있다고 인식한다. 아름다운 제품은 약간의 사용성 저하가 있더라도 크게 문제 삼지 않는 경향이 있다.

 

심미성 과잉 사례 - 카카오 페이지

아름다운 디자인은 사소한 사용성 문제를 해결하지만 치명적인 문제는 해결할 수 없다. 디자인의 본질적인 역할인 '더 나은 경험을 제공하고, 사용자의 문제를 해결한다'를 수행하지 못하기 때문이다. 

필요 이상의 인터랙션과 복잡한 UI, 직관적이지 않은 플로우가 오히려 사용자를 피로하게 만들어 핵심 태스크인 [작품 보기] 경험을 해쳤다. 웹툰 서비스가 본질적으로 보장해야 하는 경험인 [쉬운 탐색], [몰입이 편한 읽기]를 제공하지 못했다. 이와 같은 경우 제작 과정에서 진행하는 사용자 테스트를 방해하기도 했다. 기능성 판단이 아니라 심미적 감상을 남기게 만들어, UX가 좋아보인다고 판단해 버리는 오류가 발생할 수 있다.

 

기능성 과잉 사례

비슷한 기능을 제공하는 수많은 앱이 있을 때, 기능은 편리해 보이지만 인터페이스가 복잡하고 투박한 앱, 적당한 기능을 갖추면서도 보기 좋은 앱이 있다면 중 후자를 선택하게 된다. 복잡해보이는 UI는 '사용하기 어렵고 배워야 할 기능이 많을 것 같다'는 인상을 주게 된다.

 

 

2. 균형을 맞추는 5가지 디자인 원칙

1) 사용자 흐름을 방해하지 않도록 UX 원칙을 준수하자

2) 인터랙션은 직관적이고 가볍게 설계하자

3) 애니메이션과 비주얼 임팩트는 의미가 있는 곳에만 활용하자

4) 첫인상을 결정하는 온보딩, 스플래쉬에서는 심미성을 적극 활용하자

5) 익숙한 패턴을 유지하면서도 차별화된 경험을 제공하는 것이 효과적이다

 

 

3. 밸런스가 좋은 사례들

아고다 vs 에어비앤비

다양한 색상을 활용한 텍스트 위주로 정보를 전달하는 아고다와 달리, 에어비앤비는 토스트 팝업과 아이콘 모션을 활용한 인터랙션을 사용해 사용자의 시선을 집중시킨다. 잔잔한 색감, 큼직한 UI로 안정감을 제공하며, 부드럽게 전환되는 애니메이션이 전체 플로우를 따라갈 수 있게 돕는다. 간결한 정보는 피로도를 낮추고 중요 결정에 집중할 수 있도록 한다. 에어비앤비는 이렇게 좋은 숙소를 빠르게 찾아야 하며, 실수 없이 결제를 진행해야 한다는 부담을 느끼는 사용자에게 심리적인 안정감을 제공한다.

 

독서노트 vs 카카오페이지

다크 모드와 그래픽이 강조되는 레이아웃이 일반적인 독서 앱과는 시각적으로 차별화된다. 필요한 기능만 간결하게 유지하고, 핵심 기능에만 비주얼 임팩트를 적용했다. 심미성을 강조했으나 조작 방법이 직관적이고 플로우가 단순해 사용이 어렵지 않고 피로도가 낮다. 주요 기능을 메인 화면 전반에 배치하는 등 과감한 UI를 설계했지만 기능의 중요도에 따라 레이아웃을 전략적으로 분배한 시도로 보여진다.

  • 핵심 기능인 [읽을 책 선택]과 [타이머 시작]은 사용자 접근이 쉽다.
  • 책을 선택하는 단계에서는 플로우의 뎁스를 최소화했다.
  • 타이머 종료 후에는 차례대로 한 항목씩 기록할 수 있어 감상 기록 흐름을 단순화했다.

 

 

3. 균형 있는 GUI 디자인 팁

1) 잘 만든 디자인 시스템을 적극 활용하자

2) 동일 도메인의 유사 앱을 참고해 기본적인 UX 원칙을 파악하자 

3) 실험적인 인터페이스를 리서치해 미감 높은 GUI 디자인 레퍼런스로 삼자

4) 밸런스가 잘 잡힌 앱을 다운로드해서 좋은 UXUI를 직접 경험하자


💡 인사이트

  • 평소 Plus X의 디자인을 아주 좋아해서 카카오 페이지 포트폴리오를 보고도 좋은 디자인이라고 생각했는데, 실제로 사용하는 친구들이 너무 불편하다고 불만을 내비쳐서 놀랐었던 기억이 난다. 특정한 브랜드, 회사를 좋다고 생각하면 당연스럽게 다음 작품, 서비스도 좋을 거라고 생각하게 되는 경향성도 있는 것 같다. 사용성이 좋은지 아닌지 판단할 때, 방해가 되는 요소들을 하나씩 걷어내면 더 정확한 판단을 할 수 있게 될 것 같다. 메모해뒀다가 내가 편견에 사로잡혀있지 않은지 다시 한번 돌아보자.

  • 잘 만든 디자인 시스템을 적극 활용하라는 말이 인상 깊었다. 사용자에게는 무조건 새롭고 신선한 것이 좋은 게 아니기 때문에, 이미 학습된 사례를 새로운 구조에 적용하는 방법도 좋다고 생각한다. 특히 구글, 애플의 디자인은 충분히 아름답고, 학습된 디자인이라서 기준점으로 두고 디자인해도 좋을 것 같다.

  • 전에 어떤 튜터님께서 앱을 다운받아서 사용 일지를 적은 것이 취업에 큰 도움이 된다고 하셨는데, 그런 작업을 반복적으로 하면 확실히 디자인과 구조를 보는 안목이 확 올라갈 것 같다. 나도 틈틈이 시간을 내서 기록하는 습관을 가져보면 좋겠다.