분류
디자인 · 2쪽
화면을 보는 눈과 만드는 손을 모았다. 위계·여백·타이포그래피·색에서 피드백·접근성까지, 읽고 그 자리에서 만져 보는 UI/UX 교과서다.
26편 · 글 0 · 강 26 · 마지막 글 2026.08.07
디자인 글
26편 중 13–24
야콥의 법칙 — 사용자는 남의 사이트에서 산다
사용자는 하루의 대부분을 다른 서비스 에서 보낸다. 그래서 그들이 아는 방식이 곧 그들이 기대하는 방식이다. 로고는 왼쪽 위(누르면 홈), 장바구니는 오른쪽 위, 밑줄 글자는 링크. 이 관습을 지키면 배우지 않고 쓰고, 어기면 하나하나 가르쳐야 한다.
모바일 — 엄지의 세계
트래픽의 절반 이상이 폰이다. 폰의 조종간은 마우스가 아니라 엄지 하나 이고, 엄지가 편하게 닿는 곳은 화면 아래쪽 절반 이다. 위쪽 구석은 그립을 고쳐 쥐어야 닿는 오지다.
접근성 — 모두를 위한 설계가 제일 좋은 설계다
접근성은 소수를 위한 부가 기능이 아니다. 자막은 청각장애인을 위해 태어나 지하철의 모두가 쓰고, 경사로는 휠체어를 위해 태어나 유모차와 캐리어가 쓴다. 장애는 상태가 아니라 상황 이기도 하다. 한 손에 아기를 안은 사람, 햇빛 아래의 화면, 시끄러…
마이크로카피 — 버튼은 동사다
화면의 짧은 글들, 그러니까 버튼, 라벨, 에러, 빈 화면 안내가 마이크로카피다. 작지만 전환과 이탈을 가르는 건 대체로 이 작은 글들이다.
상태 설계 — 화면은 다섯 벌이다
디자인 시안은 보통 데이터가 알맞게 찬 '이상적인 상태' 한 벌만 그린다. 실제 화면은 최소 다섯 벌이다. 이상적 · 빈 · 로딩 · 에러 · 부분(데이터가 이상하게 많거나 적음). 다섯 벌을 설계하지 않으면 나머지 넷은 사고 현장에서 즉흥으로 태어…
전환 — 팔리게 하되 속이지 마라
파는 화면(랜딩·판매 페이지)의 문법은 따로 있다. 원칙은 하나다. 행동은 하나만 요구하고, 그 행동의 마찰을 전부 치운다.
디자인 시스템 — 한 번 정하고 재사용한다
화면마다 색과 간격을 새로 고민하면 느리고, 결과도 제각각이다. 잘하는 팀은 토큰 (색·글꼴·간격의 이름 붙은 값)과 컴포넌트 (버튼·카드·입력칸)를 한 번 정하고 조립만 한다. 이 블로그도 그렇다. 어두운 바탕, 민트 강조, Pretendard,…
측정 — 감을 데이터로 바꾼다
"더 좋아진 것 같다"는 감상이다. UX는 측정할 수 있다. 과업 성공률 (끝낸 사람 비율), 소요 시간 , 이탈 지점 (깔때기 어디서 새나), 재방문 . 파는 화면이면 전환율 (방문→구매)이 왕이다.
프로세스 — 다섯 명이면 85%가 보인다
완성하고 보여 주면 늦다. 순서는 문제 정의 → 종이 스케치 → 프로토타입 → 사용자 테스트 → 만들기 다. 비싼 단계(코드)를 마지막으로 미루고, 싼 단계(종이)에서 실수를 다 써 버리는 것이다.
모션 — 움직임에도 문법이 있다
화면의 움직임이 하는 일은 셋이다. ① 인과 (이 패널이 어디서 나와서 어디로 갔나), ② 피드백 (입력을 들었다는 대답), ③ 성격 (브랜드의 몸짓). 넷째 역할인 '장식'은 없다. 셋 중 아무것도 안 하는 움직임은 소음이고, 소음은 뺄수록 좋다.
폼 — 묻는 만큼 잃는다
가입·문의·결제·검색, 서비스의 결승선은 대부분 폼이다. 그리고 입력칸 하나하나가 마찰이다. 칸이 줄면 완료율이 오른다는 건 가장 재현이 잘 되는 UX 실험 중 하나다. 그러니 첫 질문은 배치가 아니라 "이걸 꼭 지금 물어야 하나" 다.
조건에 맞는 글이 없다. 브루니가 숨었나 보다.