ux/ui 디자인을 잘 하기 위해서는 좋은 ux/ui 디자인을 많이 보는 것이 중요하다고 하셨다. 매우 공감한다. 어떤 분야에 대해 잘 하려면 관련 인사이트를 많이 찾아보는 것 또한 하나의 공부이니까.
그럼 좋은 ux/ui 디자인은 무엇이 있을까?
좋은 ux/ui디자인의 공통점 5가지를 알려주셨다.
직관적 사용성과 일관성, 효율성, 피드백 제공, 감성적 만족이 이에 속한다.
그니까 사용자가 따로 뭘 더 배울 필요 없이 쓸 수 있어야 하고 앱이나 웹사이트나 전반적으로 색상, 폰트, 아이콘 스타일 등이 통일되어야 한다. 사용자가 복잡하게 오랜 시간 헤메이지 않고 적은 클릭과 짧은 시간 안에 원하는 목표에 달성할 수 있어야 하며 사용자가 한 행동에 대해 바로바로 결과를 알 수 있게, 마지막으로 사용자가 경험했을 때 그냥 유용했다는 느낌을 넘어 기분 좋고 즐거운 감정을 유발해야 한다고 한다.
한 줄로 요약하면 통일된 디자인을 바탕으로 사용자가 쉽게 사용할 수 있으면서도 즐길 수 있게 해야한다는 것 같다.
이것들을 바탕으로 첨부해주신 네이버의 성공적인 ux/ui 사례들과 그것이 왜 좋은 디자인인지 분석하는 자료들을 살펴봤다. 더불어 이 글에 첨부한 이미지와 출처는 오즈코딩스쿨 측에서 제공한 자료에 있는 것을 가져다 쓸 것이다. 왜냐? 내가 아직 그 자료를 직접 만들 수준까지는 못 되므로... 아마 네이버 채널에서 발췌한 것 같은데 만약 문제가 생길 시 이미지를 없애거나 글을 비공개 처리 해야지.
첫번째는 체류 시간을 증가시킨 홈피드 개선 사례이다.
네이버는 이전부터 꾸준히 홈피드에 대한 테스트를 진행해 왔고 그걸 바탕으로 다시 한번 홈피드 개선을 했다고 한다. 내 기억으로는 아마 몇년 전부터 갑자기 네이버 앱에 접속하니 홈피드가 확 변했던 것 같은데 그 시기를 기점으로 계속 테스트한 것 같다. 바로 개인 맞춤형 컨텐츠 추천을 해주는 것.
자료에 첨부해주신 이미지로 띄워보자면
출처: 네이버 CH.TECH https://channeltech.naver.com/contentDetail/41
이런 디자인으로 홈피드에서 로그인한 사용자의 구독 정보, 검색 이력 등을 바탕으로 추천을 해준다고 한다. 쉽게 말해 사용자의 구독 정보 및 쿠키를 바탕으로 개인 맞춤형 콘텐츠를 추천하는 것 같다. 그렇게 해서 구지 사용자에게 관심 없는 것까지 노출해서 검색만 하고 이탈하게 하지 않게 관심을 끌만한 컨텐츠를 끊임없이 제공해서 체류 시간을 증가시키는 것이다.
그리고 왜 그러한 컨텐츠를 추천받았는지 사용자가 알 수 있게
출처: 네이버 CH.TECH https://channeltech.naver.com/contentDetail/41
이런식으로 '구독한 채널 컨텐츠, 최근 찾아본' 등의 설명을 추가해 이게 왜 나한테 유용한 정보인지를 간단히 확인하고 추천 시스템에 더 신뢰를 가질 수 있게 한다고 한다. 이러한 맞춤형 추천 시스템은 사용자 경험 향상, 플랫폼에 대한 충성도 상승에 기여한다고 한다.
나도 네이버 앱을 이용하면서 처음 바뀐 상황에서는 "오 깔끔해졌다?" 라고 느꼈고 그 다음 최근에 변한 홈피드에선 "엥? 조잡한데. 인스타나 다른 sns 따라하려는 걸까? 네이버까지 이러니 피곤하네." 라고 느끼긴 했지만 그래도 묘하게 이전보다 체류하는 시간이 길어졌다. 괜히 한번 더 내려보게 되는 경우가 생긴다. 내가 직접 겪어본 것이라 그런지 여기까지는 이해하기 쉽다.
두번째는 광고 매출을 극대화 시킨 광고영역 개선 사례이다.
반응형 소재라는 것을 적용했다고 한다. 광고주가 직접 설정한 제목과 설명 키워드가 소비자 반응에 따라 최적화되어 노출되는 형식이라는데 여러가지 제목들과 설명들을 기입해놓으면 사용자의 검색어에 해당 키워드가 포함된 경우 광고를 노출하는 시스템인 것 같다. 검색탭 영역에서 전체적으로 노출된다.
출처: 네이버 통합 광고주 센터
가독성 향상 개선도 있다.
네이버 통합 광고주센터 (출처: https://ads.naver.com/notice/15982)
음.. 이건 이미지에 기본 노출 형태 예시가 변경 후에 비해 작게 되어 있어서 뭔가 잘 와닿진 않지만 제목과 url의 노출 순서를 변경해 가독성을 높였다고 한다. 브랜드 네임과 로고를 더 눈에 띄게 수정해서 브랜드를 더 쉽게 인식할 수 있게 했다고 하는데 내가 아직 잘 모르는 상태라 그런지 사실 무가 더 눈에 띄게 수정된건지 못 찾겠다..... 다만 url이 제목보다 위로 올라가고 제목을 읽은 후 바로 밑에 있는 키워드로 이어지는 것과 순서 변경으로 네이버페이 로고도 따로 분리되니 연결이 붕 뜨는 느낌에서 이어지는 듯한 느낌을 받았다.
이 부분은 이해하기 좀 어렵게 느껴진다.
그리고 클릭 기능 확대 개선도 이루어졌다고 한다. 제목에만 클릭 기능이 있었는데 설명 영역에도 기능을 추가한 것인데 아마 이미지 상에서 첫구매 쿠폰, 베스트 상품 이런 아이콘이랑 크림 스파게티, 싱싱한 샐러드 같은 메뉴에 클릭할 수 있는 기능을 추가했다는 것 같다. 이 기능으로 사용자는 원하는 정보를 바로 눌러볼 수 있고 그로 인해 빠른 접근, 높은 클릭률이란 효과를 낸다. 실제로 이러한 개선으로 광고 매출이 증가했단다.
매출이 증가했으니 당연히 광고주는 광고비로 더 많은 투자를 할 것이고, 그러면 또 광고 효과로 매출이 증가하겠지?
이렇게 ux/ui 디자인 사례를 알아봤는데 역시나 내가 아직 잘 이해하지 못하거나 몰랐던 부분들도 많고, 은연 중에 내가 체감하고 이해해온 부분들도 있다. 아직까지는 사람마다 보고 느끼는게 달라서 그런건지는 모르겠지만 살짝 귀에 걸면 귀걸이 코에 걸면 코걸이 같은 느낌도 있다. 아마 내가 무지해서 그런 것이리라. 확실히 많이 보고, 공부하고 또 많이 해봐야 체화될 것 같다.