디자인 분석
토스·배민·당근의 UI는 무엇이 다른가
세 서비스 모두 한국에서 가장 많이 쓰이지만, 화면을 만드는 원칙은 정반대에 가깝습니다. 무엇을 참고할지 고르기 전에 각자의 문법을 이해할 필요가 있습니다.
토스: 덜어내서 신뢰를 만든다
토스 스타일의 핵심은 절제입니다. 흰 배경, 검은 텍스트, 파란 버튼 하나. 한 화면에는 하나의 질문만 두고, 다음 단계로 넘어가는 큰 버튼을 화면 하단에 고정합니다. 금액처럼 중요한 숫자는 과감하게 키우고 나머지는 회색으로 눌러 시선을 한 곳에 모읍니다. 돈을 다루는 화면에서 장식은 불안을 만들기 때문에, 장식을 없애는 것 자체가 신뢰 장치로 작동합니다. 온보딩, 인증, 결제, 정산처럼 사용자가 실수하면 안 되는 흐름에 어울립니다.
배민: 성격을 드러내서 기억시킨다
배민은 정반대입니다. 민트색 면을 크게 쓰고, 손글씨 느낌의 굵은 타이포와 스티커 같은 카드로 화면에 성격을 부여합니다. 문구도 정보 전달을 넘어 말을 겁니다. 이런 스타일은 실수해도 큰일이 나지 않는 영역, 즉 음식 주문이나 로컬 추천처럼 가볍고 즐거운 맥락에서 강력합니다. 다만 같은 문법을 금융이나 의료에 가져가면 신뢰가 깎입니다. 톤은 기능이 아니라 맥락을 따릅니다.
당근: 따뜻하게, 그러나 단순하게
당근은 두 스타일의 중간에 있습니다. 주황색으로 온기를 주되 레이아웃은 단순한 리스트에 가깝습니다. 이웃 간 거래라는 특성상 화려함보다 "믿을 만해 보이는가"가 중요하기 때문에, 매너온도나 동네 인증 같은 신뢰 지표를 UI 전면에 배치합니다. 지역 커뮤니티, 중고거래, 소상공인 서비스처럼 낯선 사람 사이의 거래를 다룬다면 참고할 만한 문법입니다.
무엇을 골라야 하나
판단 기준은 "사용자가 실수하면 얼마나 큰일인가"입니다. 실수 비용이 크면 토스처럼 덜어내고, 작으면 배민처럼 성격을 드러내도 됩니다. 낯선 사람과의 거래가 끼어 있다면 당근처럼 신뢰 지표를 먼저 보여 주세요. 스타일은 취향이 아니라 맥락의 결과입니다.
쿠팡과 무신사: 밀도로 파는 커머스
커머스는 또 다른 문법을 씁니다. 쿠팡은 한 화면에 최대한 많은 상품을 보여 주고, 할인율과 배송 정보를 배지로 얹어 훑어보기 쉽게 만듭니다. 여기서 여백은 미덕이 아니라 손실입니다. 무신사는 같은 고밀도 전략을 쓰되 색을 걷어내고 흑백 그리드로 정리해, 상품 이미지 자체가 화면의 색이 되게 합니다. 커머스 화면을 만들 때의 기준은 "예쁘게"가 아니라 "빠르게 비교할 수 있게"입니다.
따라 하기 전에 반드시 확인할 것
패턴을 참고하는 것과 화면을 복제하는 것은 다릅니다. 색 조합, 여백 리듬, 컴포넌트 구성 같은 디자인 문법은 참고해도 되지만, 로고와 상표, 고유한 일러스트, 실제 서비스 화면을 그대로 가져다 쓰는 것은 상표권·저작권 문제가 됩니다. 이 사이트가 로고 이미지를 제공하지 않고 텍스트 기반의 추상 마크만 쓰는 이유도 그것입니다. 참고는 자유롭게 하되, 복제는 하지 마세요.