{3줄 요약}

좋은 UI는 거의 생각하지 않아도 쓸 수 있고, 나쁜 UI는 작은 행동 하나에도 고민을 요구합니다.
차이는 화려함이나 기술이 아니라 사용자를 얼마나 이해하고 설계했는지에서 납니다.
좋고 나쁨은 주관만이 아니라 목적 달성의 속도와 정확성으로도 가늠할 수 있습니다.

설명 없이 이해돼요

처음 보는 앱을 열었는데 5분이 지나도 원하는 기능을 못 찾으면, 그게 나쁜 UI예요.

좋은 UI는 화면을 열자마자 무엇을 해야 하는지 보여요.
버튼이 어디 있는지, 다음 단계가 뭔지, 지금 어디에 있는지를 말하지 않아도 구조가 알려줘요.

이걸 만드는 원리가 어포던스(Affordance)예요.
물건이나 요소가 어떻게 쓰는지를 스스로 알려주는 것.
버튼처럼 생긴 건 눌러야 한다는 걸 알고, 텍스트 입력창은 타이핑해야 한다는 걸 알아요.

행동 흐름이 자연스러워요

좋은 UI는 사용자의 다음 행동을 예측하고 그 경로를 자연스럽게 만들어요.

카카오뱅크에서 이체를 하면 - 받는 사람 선택, 금액 입력, 확인 → 완료.
각 단계에서 다음에 뭘 해야 하는지 명확해요.
뒤로 가고 싶으면 언제든 갈 수 있어요.
잘못 누르면 취소할 수 있어요.

나쁜 UI는 이 흐름이 끊겨요.
다음 단계가 어디 있는지 모르거나, 실수로 누른 것을 되돌릴 수 없거나, 완료됐는지 알 수 없어요.

일관성이 있어요

같은 기능이 화면마다 다르게 생기면 사용자는 계속 새로 배워야 해요.

좋은 UI는 같은 종류의 버튼은 같은 스타일이에요.
같은 색상은 같은 의미예요. 같은 위치에 같은 기능이 있어요.

이 일관성이 사용자가 화면을 이동할 때 학습된 것을 재사용하게 해줘요.
새 화면이어도 이미 아는 패턴이 있으니까요.

동일 기능, 다른 설계

나쁜 오류 메시지 예시: "에러가 발생했습니다. 코드: ERR_INPUT_VALIDATION_FAILED"

좋은 오류 메시지 예시: "이메일 형식이 올바르지 않아요. 예: example@email. com"

같은 오류 상황이에요.
차이는 사용자 언어를 쓰냐, 시스템 언어를 쓰냐예요.
좋은 메시지는 문제가 뭔지, 어떻게 고치면 되는지를 말해요.

나쁜 버튼 레이블: "확인" / "취소"

좋은 버튼 레이블: "삭제할게요" / "그냥 둘게요"

"확인"을 누르면 뭐가 확인되는 건지 눌러봐야 알아요.
좋은 버튼은 누르면 어떻게 되는지 말해줘요.

UI 품질을 판단하는 빠른 방법

화면을 처음 보는 사람 한 명을 앉혀 놓고 "이 화면에서 [특정 작업]을 해보세요"라고 말해요.

  • 1분 안에 해냈으면 좋은 UI
  • 3분 이상 걸리거나 물어봤으면 개선이 필요해요
  • 포기하거나 틀린 버튼을 눌렀으면 문제가 있어요

이게 사용성 테스트의 가장 기본적인 형태예요.
비싼 도구 없이도 할 수 있어요.

나쁜 UI가 만들어지는 이유

나쁜 UI는 대부분 의도적으로 나쁘게 만든 게 아니에요.

만드는 사람이 너무 잘 알아서예요.
어디에 뭐가 있는지, 어떻게 작동하는지 다 알고 있어서 "이 정도면 알겠지"라고 생각해요.

처음 보는 사람은 그 배경지식이 없어요.
그 간격을 좁히는 게 좋은 UI 설계의 핵심이에요.

실패한 디자인 패턴과 비교하면 실패한 디자인의 패턴에서 더 많은 사례를 볼 수 있어요.

관련 아티클

참고 문헌