UX원칙 - Uxer를 위한 101가지 원칙 정리 [1~10]

01 시작

 ui디자이너로 일하면서 설계를 할때 이게 편하지 않을까? 다른 레퍼런스에서도 이렇게 했으니까...라는 추측으로 할 때가 많았다.

 설계 이유에 대해 설명할 때 사례를 중심으로 설명을 하다보니 조건이 다른 경우에는 또 다른 레퍼런스를 찾아야하는 경우가 많았고, 정확히 일치하는 사례를 찾는 것은 불가능에 가까웠다.

 근본적인 문제점에 대해 생각해보니 다른 사례를 따라만했지 왜 이렇게 배치되었고 이런 요소들이 필요한지에 대한 공부가 부족했다는 결론이 나왔다.

 어떤 응용문제도 풀 수 있는 수학 공식처럼 유저 인터페이스 또한 어느정도 원칙을 가지고 설계를 한다면 유저들에게도 쉽게 인식되는 인터페이스를 구축 할 수 있고 설계에 대해 설명하고 설득할 때 도움이 될 것이라고 생각해서 원칙에 대해 잘 정리된 서적을 찾아서 공부하기 시작했다. 

 

02 정리

누구나 UX전문가가 될 수 있다

객관성과 공감을 학습하라.

타고난 사람만이 전문가가 되는 것은 아니다. 후천적으로 충분히 전문가가 될 수 있다.

 

두 가지 이상의 서체를 사용하지 마라

하나는 제목, 하나는 본문 용도

브랜드 서체의 경우 대부분 가독성보다 임팩트를 염두하고 제작

항상 심미성보다 가독성을 우선시 해야하는 것을 잊지 말아야겠다.

 

사용자의 컴퓨터에 설치된 폰트를 사용하라

기본 폰트 사용은 로딩시간을 단축

 

글자 크기를 사용해서 정보 체계를 표현하라

글자 크기 = 중요도 / 3개는 넘지 않는 크기를 사용

중요도에 따라서 크기를 정해서 일관성있게 설정하는 것이 중요할 것 같다.

 

본문에는 합리적인 기본 크기를 사용하라

본문은 16px, 줄간격 1.5, 자간은 ‘자동’ 혹은 ‘기본’

모바일 게임의 경우 적어도 18px 이상을 써야 잘 보인다.

 

줄임표를 사용해서 다음 단계가 있다는 것을 알려라

액션을 확정하려면 추가 단계를 거쳐야 한다는 것을 알림

 

버튼을 버튼처럼 보이게 만들어라

버튼이 아닌 요소를 버튼처럼 보이게 만들면 안됨

*어포던스(affordance): 특정 행동을 하게끔 유도하는 성질

 

버튼을 적절한 크기로 만들고, 기능에 따라 그룹핑하라

쉽게 닿을 수 있도록 버튼을 크고 가까이 배치

너무 근접하면 ‘잘못된 클릭’을 유발

*안티패턴(anti-pattern): 실제 많이 사용되지만 비효율적이라 사용을 지양해야 하는 것

 

텍스트만이 아니라 버튼 전체가 클릭 가능하게 만들어라

버튼이 클릭 되었다는 시각적 피드백을 사용자에게 제공

ex) 마우스를 올리면 포인터가 손가락으로 바꾸기

 

새로운 컨트롤을 제멋대로 만들지 마라

자신만의 ui를 만들어 내지마라 원하는 동작을 실현해주는 ui 컴포넌트는 이미 거의 다 존재한다.

 

03 마무리

목차만 읽어봐도 도움이 될 정도로 좋은 내용이 많은 책이다.

퇴근 후 시간이 날때마다 읽고 느낀점을 조금씩 정리할 예정이다.