{3줄 요약}
강조는 화면에서 가장 먼저 봐야 할 요소를 분명하게 드러내 주는 원리예요.
중심이 없으면 시선이 퍼지고 사용자는 어디에 집중해야 할지 헤매게 돼요.
강조 원칙을 알면 무엇을 돋보이게 하고 무엇을 뒤로 둘지 더 명확해져요.
시선은 먼저 눈에 띄는 것으로 가요
사람이 화면을 볼 때 모든 요소를 같은 비중으로 처리하지 않아요.
눈은 자동으로 "주변과 다른 것"을 먼저 찾아요.
크기가 다르거나, 색이 튀거나, 혼자 여백이 많거나.
이 차이가 시선을 끌어요.
강조(Emphasis)는 이 본능을 설계에 활용하는 원리예요.
사용자가 "이걸 먼저 봐주세요"라고 말하지 않아도, 구조가 그걸 자연스럽게 유도하도록 만드는 거예요.
강조를 만드는 방법들
크기로 강조 - 제목이 큰 이유가 있어요.
크면 먼저 보여요.
가장 직관적이고 강력한 강조 방법이에요.
색으로 강조 - 주변이 모두 회색인데 하나만 파란색이면 그게 눈에 들어와요.
토스 앱의 송금 버튼이 파란색인 것도 이 이유예요.
화면에서 가장 먼저 눈에 들어오는 요소예요.
여백으로 강조 - 주변에 공간이 많은 요소는 중요한 것처럼 보여요.
Apple 제품 페이지에서 제품 이미지 주변에 넓은 여백이 있는 이유예요.
여백이 그 이미지를 더 중요하게 만들어요.
위치로 강조 - 화면 상단, 중앙에 있는 요소는 자연스럽게 더 중요해 보여요.
사람의 시선은 위에서 아래로, 왼쪽에서 오른쪽으로 흐르니까요.
형태로 강조 - 둥근 요소들 사이에 각진 요소가 있으면 그게 눈에 들어와요.
주변과 다른 형태가 강조 역할을 해요.
배달의민족의 강조 설계
배달의민족 앱 홈 화면에서 주요 카테고리 아이콘들이 비슷한 크기로 배열돼요.
그런데 그 위에 프로모션 배너가 있을 때는 색이나 크기로 확실하게 차별화해요.
또 개별 음식점 카드를 보면 - 이름, 평점, 배달시간, 최소금액이 있는데, 음식점 이름이 가장 크고 굵어요.
사용자가 먼저 봐야 할 게 뭔지 구조가 말해주는 거예요.
이 설계가 없으면 사용자는 어느 식당을 클릭할지 결정하기 전에 모든 정보를 동등하게 처리해야 해요.
결정이 느려지고 피곤해져요.
모두 강조하면 아무것도 강조 안 돼요
가장 흔한 실수예요.
"이것도 중요하고, 저것도 중요하고, 이것도 빠질 수 없어요. " - 이렇게 되면 화면에 강조가 다섯 개가 생겨요.
강조의 효과는 "주변과 얼마나 다른가"에서 나와요.
주변도 모두 강조되어 있으면, 강조가 아니에요.
그냥 새로운 평균이 된 거예요.
화면을 설계할 때 이 질문을 해보세요.
"이 화면에서 사용자가 가장 먼저 봐야 할 것이 딱 하나라면, 그게 뭔가요?"
그게 강조 포인트예요. 나머지는 그걸 받쳐주는 역할이에요.
강조와 위계의 관계
강조는 Visual Hierarchy(시각적 위계)의 꼭대기에 있어요.
위계는 1순위 → 2순위 → 3순위 정보를 구조화하는 것이고, 강조는 그 중 1순위를 가장 눈에 띄게 만드는 거예요.
강조 없이는 위계도 없어요.
모든 정보가 같은 수준으로 보이면 사용자는 어디서부터 읽어야 할지 모르게 돼요.
시각적 위계 전체 구조는 Visual Hierarchy에서 더 자세히 다뤄요.
관련 아티클
- 시각 디자인의 7가지 원리 - 강조가 7가지 원리 중 어떤 역할인지 볼 수 있어요.
- 대비 (Contrast) - 강조를 만드는 핵심 도구인 대비를 다뤄요.
- Visual Hierarchy - 강조를 포함한 전체 정보 위계 구조예요.
참고 문헌
- William Lidwell, 《Universal Principles of Design》(2003/2010) - 강조와 시각적 우선순위의 인지 기반을 설명해요.