[핀다]디자이너는 디자인만 하지 않는다.

리브랜딩을 반영하기 위한 실제 과정들 

그래, 로고를 다시 디자인하였다. 그 다음은? 

앞서 이야기한 대로 핀다의 새 얼굴을 만들었다. 이제 핀다의 '몸'을 다시 디자인할 차례이다. 경우에 따라 바뀐 로고를 기존 사이트에 그대로 사용하는 경우도 있지만, 이는 바뀐 정도가 아주 미비한 경우에나 가능한 이야기이다. 

이런 경우라면 모를까... (출처: 구글) 

핀다의 새로운 로고는 기존 로고의 기하학적 요소를 활용하였지만, 외형적인 차이가 크고 로고가 전달하는 이미지도 많은 차이가 난다. 이 경우 기존의 사이트를 활용하는 것은 불가능에 가깝다. 

새 로고와 예전사이트를 조합해보았다 - 이상하다

껍데기만 바꿀 것인가, 알맹이도 바꿀 것인가?

사이트를 개편하는 프로젝트는 새로운 집을 짓는 것이 아닌 기존 집을 리모델링 하는 작업과 비슷하다. 기존의 뼈대 위에 새롭게 바꾼 외장재를 덧붙이는 형식이 많다. 그러나 필요에 따라 쓸모없는 공간을 부수고 다른 공간으로 만드는 것처럼 사이트의 기획도 부분적으로 수정하기도 한다. 물론 기획 수정이 들어가는 경우 더욱 많은 리소스가 필요하므로 전체적인 일정을 고려하여 기획 범위를 정해야 한다.

 하고 싶은건 많은데 늘 시간은 부족하다

그런데 난 디자이너이지 않나?

디자이너가 해야 하는 영역과 기획자가 하는 영역이 있지 각각 있지 않을까? 나도 예전에는 그렇게 일을 했었다. 뼈대를 만드는 사람, 그리고 거기에 예쁜 외장재를 붙이는 사람이 구분된 업무를 진행해 왔다. 내가 준비한 외장재가 어울리는 뼈대를 찾는 게 아니라 그 뼈대에 맞는 외장재를 준비하는 디자이너였다. 그렇게 준비해온 외장재는 마음에 들지 않기 일쑤였고 무엇보다 전달받은 뼈대가 마음에 들지 않았다. 

이러쿵 저러쿵 싫다면 둘다 하는 수 밖에 (출처: http://seokjun.kr/why-engineers-become-ceo/)

게다가 핀다(Finda)에는 기획자라는 포지션이 따로 있지 않았다. 이렇듯 스타트업의 환경에서는 각 회사와 단계에 맞춰 기존의 포지션이 없기도 하는데, 특히 디자이너가 두 가지 역할을 동시에 해야 하는 경우가 자주 발생한다. 빠른 속도로 효과적인 결과물을 만드는데 가장 필요한 것은 절차의 단순화이고, 이를 가장 잘 소화할 수 있는 포지션이 디자이너라 생각되었다. 즉, 외장재를 붙일 뼈대를 처음부터 세우는 역할은 무엇보다 디자이너가 가장 잘 할 수 있다.

그렇게 시작된 기획. 

모든 프로젝트가 그렇겠지만 빡빡한 일정을 고려하여 (세상에 일정이 넉넉한 프로젝트는 존재하지 않는다) 다음 몇 가지를 다시 기획하였다.

1) 메인페이지

말 그대로 얼굴이다. 기회 초기에는 소비자가 가장 처음 보는 화면인 만큼 많은 정보를 한꺼번에 보여주고자 하였다. 그러나 사용성 데이터 분석결과 정성스럽게 준비한 내용을 끝까지 꼼꼼하게 다 보는 사용자는 극히 일부였다. 

스마트폰이 이렇게 생기지 않는 이상 사용자가 화면 전체를 다 소화하긴 힘들 것이다. 

일반적으로 광고를 돌리거나 이벤트를 진행하는 경우 보통 메인페이지로 랜딩을 시키지 않기 때문에 새롭게 개편되는 메인페이지의 역할은 핀다 사용자들이 필요로하는 정보가 모여있는 최종 목표 페이지, 즉 상품 카테고리별 대표페이지나 상품을 전체적으로 볼 수있는 리스트페이지로 자연스럽게 이동시킬 수 있는 목적을 구현하는 것으로 출발선으로 정하였다. 아울러 우리의 소중한 파트너사들을 위한 광고영역 (스크롤 없이 노출이 가능한 비율을 기준으로 하였다.)도 중요하기 때문에 이 영역도 미리 고려해 두었다. 

 

모바일 화면상 핀다의 메인페이지를 구성하는 배너와 광고 영역의 예

2) 메뉴 구성

기존 GNB에는 상당히 많은 메뉴가 존재했다. 취급하는 상품이 다양하기에 그만큼 보여주고 싶은 것도 많았었다. 그렇게 하나둘씩 늘어난 메뉴의 가짓수는 그 상품의 목적이 비슷함에도 불구하고 별도의 메뉴로 나누어져 있었고 블로그 콘텐츠도 메뉴의 항목으로 구성되어 있었다. 

리브랜딩 전 메뉴구성 (위) vs 리브랜딩 후 메뉴구성 (아래) 

이번 리뉴얼에서는 여러 개로나누어진 상품들을 상품의 목적에 따라 카테고리화했다. 돈을 벌기 위한 '투자', 돈을 빌리기 위한 '대출', 그리고 소비를 위한 '카드' 크게 3가지로 나뉘었고, 브랜드관과 블로그를 추가하여 총 5개의 메뉴로 개편하였다. 기존에 있었던 블로그 콘텐츠, 특판상품은 새롭게 추가된 페이지 내부에 배치하여 메뉴 가짓수를 줄일 뿐만 아니라 프로덕트 전체에서 사용성 및 중요도에 따라 계층구조를 체계화시킬 수 있었다.

3) 카테고리별 대표 페이지의 추가 

상품 형식을 세 가지로 줄이고 각 형식에 해당하는 상품군을 배치하였지만 무턱대고 우리 이런 상품 정보가 있다고 줄줄이 보여주기에는 묶인 단위와 결과값이 너무나 방대하다고 생각했다. 하다못해 마트에서 수많은 물건중 하나를 고르기도 어려운데 금융인들의 일상용어로 꾸며진 상품은 오죽하겠는가... 사용자들이 가장 궁금해하는 일부 우려진 추천상품에 대한 정보 제공 및 자연스럽게 각 하위 상품들로의 연결, 계산기와 맞춤 추천, 나아가 관련 콘텐츠까지 자연스럽게 연결할 수 있는 일종의 허브 역할을 하는 대표 페이지를 새롭게 추가하였다.

카드 추천을 위해 기획된 user flow별 실제 화면 (feat. 착착 이렇게만 넘어가면 좋겠는데)  

이 페이지들은 메인페이지 -> 상품 메인페이지 -> 상품 목록페이지 -> 상품 상세페이지로 이어지는 플로우를 보다 자연스럽게 만들어 주었으며 다양한 목적의 랜딩페이지로도 활용이 가능하다. 

4) 회사 소개 페이지의 상단 이동

과거 나이 많은 CEO의 허세 가득한 비전만 담긴 회사소개와 달리 요즘 회사소개 페이지는 그 회사의 문화를 보여줄 수 있는 등 다양한 역할을 가지고 있다.

전형적인 기업들의 진부한 CEO 인사말 

일반적인 기업들과는 달리 핀다와 같은 스타트업의 경우 회사가 무엇을 하는 것 만큼 회사의 문화, 사람을 알고 싶어 하는 니즈가 더 크기에 기존 꼭꼭 숨어있던 회사소개 페이지를 과감히 상단에 배치하였다. 실제로 과거 사용성 데이터를 보았을 때도 상품 가입 페이지를 제외하곤 메뉴나 페이지 사용성이 매우 높은 페이지 중 하나였다. 회사가 나아가고자 하는 비전도 중요하지만 어떤 경험을 가지고 있는 사람이 모여있는지, 그리고 핀다가 브랜딩에 얼마나 애정을 가졌는지를 보여주고 싶었다. 회사 페이지 내 배치될 비전과 미션, 그리고 팀원들을 정성스레 소개하기 위해서 지난 몇개월간 팀 전체가 고민하며 더 꼼꼼하게 채워나갔고, 일반적으로 카메라를 들이대면 부끄러워하는 우리나라 사람들과 달리 매우 잘 포즈를 취해준 팀원들 덕분에 활기차고 당당한 프로필사진을 촬영하여 그대로 잘 활용할 수 있었다.

Thanks to Photoshop and our team

새로운 사이트를 이미 오픈한 시점에서 앞서 언급한 것 보다 더 많은 것을 구성했으나 반영하지 못하고 미리 고려해보지 못한 점들이 너무나 많이 있어 아쉽다. (그랬다면 아직도 오픈을 못 했을수도 있다. 명심하자. 프로젝트를 공개하는 것과 공개된 프로젝트를 유지 보수하는 업무 구분은 명확히 해야 한다. 그러지 못할 경우 계속 지연되는 것 밖에 없다.) 

이번 글에는 무엇을 목적으로 어떻게 리브랜딩을 기획했는지에 대한 간단한 이야기를 해보았다. 다음 글에서는 좀 더 디자이너답게 프로덕트를 어떻게 꾸며 나가고 있는지에 대해 이야기해 보고자 한다.