brunch

You can make anything
by writing

C.S.Lewis

by 디자인너마저 Jan 24. 2024

8년차 프로덕트 디자이너가
놓치면 안되는 것들

시간은 더 이상 우리의 편이 아니기에

오랜만에 직업과 관련된 글을 조심스럽게 한 번 써보려고 합니다. 청춘의 세월을 보내고 커머스 프로덕트 디자이너로 일하다 보니, 과연 나는 잘 숙성된 디자이너인지, 혹은 연차만 쌓이고 오래된 맛탱이 없는 썩기 직전의 디자이너인지... 고민이 깊어지곤 합니다. 그동안 매일 씨름하는 일에 대한 제 생각을 글로 쓰기가 싫었는데, 얼추 8년을 채운 이 시점에서 오랜만에 도전해 봅니다. 앞으로 읽으실 내용은 지극히 저의 개인적인 생각이고, 반박 시 님 말씀이 맞습니다. 구정까지는 시간이 조금 남았습니다. 새해 복 많이 받으세요.



1. 디자인은 메타포 싸움이 아니던가

2. 단순히 한 페이지가 아닌, User Journey를 설계

3. 한 페이지 안에서는 우선순위 정리를

4. 현실은 비관적으로, 해결책을 찾을 땐 긍정적으로

5. 실제 데이터를 기반으로 생각하기

6. 인터페이스를 채우는 알맹이

7. 함께 성장, 그리고 커뮤니케이션



1. 디자인은 메타포 싸움이 아니던가


프로덕트 디자이너의 존재 이유는 제한된 화면 안에서 심미적면서 효율적이 결과를 만들어내고, 또 사용자를 고려한 화면설계를 하는 것이라고 생각하는데요. 디자인된 화면이 무언가 명확하지 않고, 꼭 한 번 사용해 봐야 알고, 읽어봐야 이해된다면 메타포를 적절히 사용하고 있지 못하기 때문이지 않을까 싶습니다. 생각보다 우리 주변에 충분히 더 명확해질 수 있음에도 여러 이유로 애매하게 표현된 경우가 많은데요. 

실제 사례로 앱 내 하단 탭 바를 예시로 들면, Gmarket의 노란색 버튼, 배민앱의 배민뱃지 버튼은 터치 시 화면이동이 어디로 될지 쉽게 예상이 안되네요. 물론 한 번 사용해보고 나면 금방 학습이 되겠지만, 다음 액션을 예상할 수 있는 메타포를 사용했으면 더 좋지 않았을까 싶은 부분입니다.

앞서 사례와 서비스의 성격은 조금 다르지만, 하단 탭 바에서 메타포를 적절하게 잘 사용하고 있는 사례라고 생각되어 가져왔습니다. 우측의 네이버페이 녹색 버튼은 터치 시 바로 카메라가 작동하게 될 것을 누구나 쉽게 예측할 수 있죠. 이렇게 예측가능한 안내를 해주는 것이 메타포의 역할이라고 생각합니다.

버튼의 형태 자체를 고객의 기억과 경험을 활용해서 변주를 준 경우도 좋은 사례라고 생각합니다. 연락처 버튼을 예전 전화번호부의 디자인을 차용하고, 가게 주문의 버튼은 가게 천막의 메타포를 활용하는 것, 그리고 내가 방문한 장소의 이미지 틀을 즐겨찾기 또는 핀 형태를 차용한 부분에서 디자이너가 편하게 디자인한 것이 아니라, 어떻게 하면 고객이 더 쉽게 이해하고 고객의 선택을 이끌어 낼 수 있는지를 고민한 결과라고 생각합니다. 이런 작은 것들이 하나하나 모여서 서비스의 차별성을 만들고 매끄러운 고객 경험을 만드는 것이라고 믿습니다.


2. 단순히 한 페이지가 아닌, User Journey를 설계


나무 말고 숲을 보자! 예를 들어 홈 > 상품상세 > 장바구니 라는 Journey가 있다면, 적어도 이 과정에 포함된 UI 버튼 스타일과 버튼명, 안내 문구, 구매 자극 요소 등이 매끄러운 연결된 경험을 제공하고 있어야 한다는 것입니다. 또한, 각 Journey에서 강조해야할 정보를 단계적으로 배치하는것도 중요합니다.

쿠팡을 예로들면 홈 목록에서는 고객을 후킹하는 문구로 시선을 끌고, 그다음 ②상품 상세 페이지에서는 이 할인이 몇 시간 남았는지 고객을 자극하고,  ③구매 버튼을 눌렀을 때는 언제 도착하고, 원한다면 쉽게 반품할 수 있다는 말로 고객의 고민을 없애고, ④장바구니 지면에서는 고객이 지금 얼마나 할인된 가격으로 구매하여 이득을 취하고 있는지 설명하여 합리적인 소비를 했다는 생각을 심어주어 주문으로의 전환을 유도하고 있습니다. 이러한 장치들이 각 User Journey에 적절하게 배치되어야 매끄러운 구매 전환이 일어나겠죠.



3. 한 페이지 안에서는 우선순위 정리를


물론 한 페이지 안에서의 우선순위 정의도 중요합니다. 동시에 늘 생각하는게 시각적 위계입니다. 아니 UX/UI 디자인은 이게 거의 전부라 해도 과언이 아닌 것 같아요. 바쁜 고객들이 최대한 빠른 시간 안에 원하는 결과를 얻기 위해서는, 시각적 우선순위가 명확하면서 방지턱이 없어야 하니까요. 그러기 위해서는 제한된 화면 안에 Scale과 Hierarchy를 적절히 배분하여 최대한의 효율을 만들어내야 하고, 또 이것이 우리 프로덕트디자이너의 숙명이라고 생각합니다.

사실 화면 디자인 시안을 보면 이게 매력적인지 아닌지는 사용성이 좋을지 그렇지 않을지는 대부분 본능적으로 판단할 수 있습니다. 앞서 말씀드린 Scale과 Hierarchy의 배분을 통해서요. 왼쪽 화면은 비슷한 크기의 영역들이 강조 표현 없이 배치되어있다 보니 어떤 서비스가 주력인지, 또 다 비슷비슷하게 표현되어 있어서 내가 원하는 서비스가 무엇인지 쉽게 찾기가 힘든 반면, 오른쪽 화면은 비슷한 크기의 버튼들이지만 강약조절이 확실하고 이 서비스의 우선순위에 대한 정의가 명확합니다. 덕분에 고객은 큰 고민 없이 원하는 서비스를 찾을 수 있죠. 이렇듯 디자인의 기본은 제한된 그리드 안에서의 강약조절, 밸런스가 아니던가!



4. 현실은 비관적으로, 해결책을 찾을 땐 긍정적으로


지금 처한 상황 속에서 무엇을 해야 하는지 냉정하게 생각하는 것이 필요합니다. 즉 현실 감각을 가지고 문제를 해결하는 것에 집중해야겠죠. 하지만 안될 것을 미리 생각하여 시도조차 하지 않는 것은 좋지 않습니다. 해결책을 찾을 때는 긍정적으로 접근해야 합니다. 해결책을 찾을 때 대부분 레퍼런스 서치를 하게 될 텐데요, 레퍼런스 서치를 평소에 많이 하는 것은 좋습니다. 트렌드를 잘 파악하고 있는 것은 어느 분야나 중요하니까요. 하지만 트렌드를 무턱대고 따르기보다는, 요즘은 고객들이 어떤 것을 좋아하는지 이해하는 것이 포인트라고 생각합니다. 이런 희망과 달리, 레퍼런스에 매몰된 디자이너가 대부분이긴 하죠. 그래서 저는 무조건 레퍼런스부터 찾지 말자고 하고 싶어요. 내가 하고 싶은 걸 생각해 보고, 그것과 연관된 레퍼런스를 찾아서 보완하는 방식이 더 좋을 것 같습니다. 내가 작업한 결과물이 남들의 레퍼런스가 되길 바라는 심정으로, 긍정적으로!



5. 실제 데이터를 기반으로 생각하기


그저 시안을 위해 대충 입혀본 디자인은 실제 프로덕트에서 힘을 발휘하지 못합니다. 시안으로 좋은 디자인과 실제 프로덕트에서 효율이 좋은 디자인은 ‘실제 데이터를 얼마나 고려했는지’에서 차이가 난다고 생각합니다.

이 화면을 보면, 내 주변에 어떤 가게가 어떤 혜택을 주는지에 대한 UI인데요. 나를 중심으로 가게의 거리와 몇 개의 가게가 있는지는 알 수 있지만, 정작 중요한 혜택안내하는 문구가 대부분 말 줄임 처리되어 있습니다. 실제 어떤 혜택의 내용을 UI에 표현할지 고민 없이 디자인된 화면이라고 생각합니다. 글자수를 고려해서 텍스트 사이즈를 줄이거나, 텍스트 영역을 좀 더 넓게 처리했으면 혜택이 온전히 고객에게 전달되어 더 CTR이 높아지지 않았을까.. 싶네요.



6. 인터페이스를 채우는 알맹이

인터페이스를 채우는 알맹이에는 항상 목적이 있어야 합니다. 예를들면 커머스에서 고객의 관심을 끌고 터치를 유발하기 위해서는 현재 고객의 문제인식을 유발해야 하는데, 이것은 인간의 근본적인 욕구 충족(생리적, 사회적, 자아실현 등)에서 시작하면 좋습니다.

29CM의 UX라이팅은 이러한 부분을 잘 건드리고 있습니다. 특히 고객의 자아실현 욕구를 잘 자극하고 있죠. 모든 서비스가 29CM처럼 말할 필요는 없습니다. 영화 자막에서 관객의 언어가 중요하듯, 서비스에서도 타겟 고객의 언어가 중요합니다. 그들이 사용하는 언어로 그들이 필요로 하는 지점을 긁어서 설득하는 것이 중요하겠죠. 황석희 번역가의 '데드풀'의 자막이 호평을 받았던 것은 '데드풀'이었기에 가능한 것입니다. 그 말투와 드립력이 다른 영화에도 똑같이 적용되지는 않을 테니까요.

UX의 본질은 사용자의 '마음'을 다루는 것이기에 굉장히 중요한 부분 같습니다. 사용자는 누구인가? 사용자는 무엇을 하고자 하는가? 사용자의 문제와 목적을 이해하는 것이 인터페이스 설계의 시작이고, UX디자인의 핵심은 고객의 목표 달성이 매끄럽도록 만드는 일인 것을 생각해 보면 알맹이는 중요할 수밖에 없습니다. 그 무엇보다 중요한 것은 ‘본질’에 집중하는 것, 이것이 있어야 하는, 필요한 이유를 파고들면 알맹이 밀도는 더욱 높아질 것입니다.



7. 함께 성장, 그리고 커뮤니케이션


일하다 보면 역시나 나는 너무나 작은 존재라는 것을 깨닫게 됩니다. 주변에서 도와주는 동료들 덕분에 일이 마시작되고 또 마무리되는 걸 느낍니다. 자동차 하나가 굴러가려면 2만 5천 개의 부품이 필요하다고 합니다. 그 부품들이 하자 없이 잘 작동해야만 온전히 자동차의 성능을 발휘할 수 있겠죠.

UX/UI 설계를 주 업무로 하는 우리 프로덕트 디자이너들도 마찬가지입니다. 기획/개발/QA 등 유관부서 분들께 늘 감사와 칭찬을 아끼지 말아야 할 이유가 바로 이 때문입니다. 동시에, 누가 혹은 어떤 부서가 가장 중요한 이해관계자인지 파악하는 것은 언제나 중요합니다. 그분들이 우선적으로 생각하는 Pain Point를 파악하고 우선순위를 결정하여 디자인으로 개선하는 것이 우리의 역할이니까요.


그렇다고 해서 우리의 존재가 늘 유관부서를 만족시키기 위함은 아니겠지요. 모두를 만족시키기 위해서 둥글둥글 깎다 보면 날카로움이 사라 질 겁니다. 위에서 언급한 우리만의 뾰족함으로 고객경험을 설계하고 여러 사람을 설득하는 것 역시 너무나 중요합니다. 이렇게 쓰다 보니 정말 쉬운 일이 하나도 없네요. 그렇지만 언제나 즐거움을 잃지 않았으면 좋겠습니다. 

- SBS드라마 스토브리그 중에서



무엇을 위해 그동안 나를 소모하고 열과 성을 다했는지 생각해 봤습니다. 배운 게, 그나마 남들보다 좀 더 잘하는 게 이것뿐이라 아직까지 잡고 있는 것 같아요. 점점 쌓이는 연차에 다가오는 내일이 두려워 뭐라도 하고 싶은 마음에 이렇게 주절주절 새해 다짐처럼 글을 써봤습니다. 아직은 구정이 오지 않은 연초니까요. 읽어주셔서 감사합니다.




--

이미지 출처

이말년 4컷 만화

SBS드라마 스토브리그

배달의민족, 네이버, Gmarket, 카카오페이, 29CM, 쿠팡, Tmap, 우리동네GS 앱 화면 캡쳐

브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari