본문바로가기

loading...

Gongcha
Web/Mobile Renewal

Category : Web Client : 공차 Url : gong-cha.co.kr 2017.05.08

프리미엄잎차, 밀크티 하면 떠오르는 Global Tea Brand, 공차 웹사이트 리뉴얼 프로젝트를 진행하였습니다.

브랜드에 대해 가지고 있는 철학과 고민을 최대한 반영하여 구글 애널리틱스 분석과 빅데이터 수집 및 분석 등을 통해 효과적인 웹사이트 구축 방안을 제안하여 단순히 정보 제공만을 위한 웹사이트가 아닌 높은 브랜드 가치를 경험할 수 있는 공간으로 만들고자 하였습니다.

“잎차 음료라니 신선하다”, “커피 시장이 이미 대부분인데 티 음료가 팔릴까?”

2012년 4월, 공차가 처음 한국에 등장했을 당시 사람들의 반응은 두 가지였습니다. 공차는 한국 음료 시장에서 자신만의 영역을 구축하기 시작하였고 지금은 밀크티하면 공차를 떠올릴 정도로 끝없이 영역을 확대하여 브랜드를 증명하였습니다.

뉴리버X공차 프로젝트는 공차 리뉴얼을 ‘공차 브랜드’화부터 시작하였습니다.

단순히 공차의 정보를 노출하는데 그치지 않고 공차의 좋은 브랜드를 소개하고 공차가 가진 브랜드 가치를 고객에게 스토리 텔링 형식으로 경험하게 하는데 중점을 두었습니다. 기존 딱딱하고 획일화된 브랜드 웹사이트의 새로운 가치를 부여하기 위해 뉴리버는 다음과 같은 부분을 고려했습니다.

방향1. 고객이 직접 선택함으로써 애착을 형성할 수 있도록.

공차가 제공하는 기존 음료 시장에 없는 공차만의 차별화된 서비스, 고객이 직접 선택하여 커스터마이징 할 수 있는 큐레이션 서비스를 전면에 노출했습니다.
또한 고객의 더 나은 선택을 돕기 위해 공차가 추천하는 음료의 노출과 음료의 탄생 스토리를 의미 있게 노출하고 메뉴에 대한 상상을 불러 일으키는 과정을 고려하여 구현하였습니다. 고객에게 직접 안내하듯 공차의 브랜드와 메뉴를 소개하고 다양한 브랜드를 보기 쉽고 편하게 공차의 제품뿐만 아니라 다양한 메뉴를 동시에 노출하는 서비스를 구현하는데 있어 브랜드 히스토리와 이미지, 메뉴의 스토리를 심플하게 설계하였습니다.

방향2. 2030세대가 좋아하는 것.

2030세대는 나를 위한 투자, 합리적 소비에 관심이 많습니다.
공차는 오리지널 티(Tea)와 에이드, 스무디 등을 베이스로 5가지 당도와 얼음량, 토핑까지 조절할 수 있어 개별 맞춤 주문이 가능한 커스터마이징 시스템입니다. 레시피에 따라 정해진 것이 아닌 선택에 따라 60여 가지의 다양한 조합으로 음료를 즐길 수 있습니다.
공차에서는 3명이 각자 다른 밀크티를 마실 수 있습니다. 단순히 하나의 레시피로 제공되는 것이 아닌 직접 만드는 나만의 음료, DIY 취향에 맞춰 공차에 고객이 모이는 이유를 우리는 오프라인에 한정 짓지 않고 웹사이트에서도 알 수 있도록 HOW TO ORDER, 시간대별 변경되는 공차 베스트 콤비네이션 제안 등 다양한 큐레이션을 구현하였습니다.

2030세대는 커뮤니케이션에 강합니다.

공차를 이미 알고 있거나, 곧 공차를 접할 고객이 공차 브랜드에 대한 소속감과 유대감, 공차가 고객들을 잊지 않고 챙겨주고 있다는 메시지를 명확히 전달하도록 메인 비주얼에서 푸터까지 일관성 있게 기획 및 디자인하고 인스타그램으로 하단에 마무리하여 자연스럽게 인스타그램에서도 공차 소식을 접근하도록 배려하였습니다.
또한 별개로 유지되는 것이 아닌 공차 웹사이트가 브랜드 채널로서 확장성을 갖도록 다양한 요소에 사용자 반응을 이끌어낼 수 있는 인터렉션 디자인을 적용하였습니다.

2030세대는 고유한 컨셉에 반응합니다.

모든 기업들은 무엇인가를 팔고 있습니다. 이 경쟁 속에서 우리는 공차를 어떻게 돋보이게 할 수 있을까요? 웹사이트 상에서 고유한 컨셉을 갖는 것은 타겟 고객의 주목을 끌 수 있는 아주 좋은 방법입니다. 틀에 박혀 있지 않는 고유한 개성을 부각시키기 위해 우리는 공차의 메인 페이지를 마치 블록이 쌓이듯 어긋나는 형태로 배치하였습니다. 물론 각각의 블록이 합쳐져 하나의 브랜드가 되도록 유도하는 것을 놓치지 않는 것에도 집중하였습니다.

방향3. 재미, 호기심, 신뢰. 고객에게 콘텐츠를 보여주는 법.

공차의 기획 및 디자인하는데 있어 타겟 고객이 가장 많이 사용하는 SNS에서 아이디어를 두었습니다.
페이스북, 인스타그램과 핀터레스트 등 박스형 이미지에 익숙한 타겟을 고려하고 이용 형태를 분석하여 자신의 경험을 이미지와 짧은 이야기로 나눈 점에 착안, 비주얼 중심의 감각적인 콘텐츠 배치를 하였습니다.
퍼블리싱 단계에서 다양한 모션 기능을 삽입, 공차 메인 페이지부터 서브 페이지까지 각각의 특별한 모션 노출로 고객이 흥미를 느끼고 쉽고 빠르게 정보를 습득할 수 있도록 구현하였습니다.

사랑받는 기업은 이해당사자의 이익을 적극적으로 보호하고 그들과 상호협력적인 관계를 구축합니다.
우리는 가맹점주, 예비 가맹점주가 원하는 새롭고 차별화된 가치를 경험하도록 별도의 프랜차이즈 플랫폼을 제작하였습니다.
좋은 스토리를 가지고 있는 공차 브랜드가 사이트를 통해 브랜드를 알리고 사람들이 공차를 좋아하고 이를 통해 브랜드가 성장할 때 프랜차이즈 플랫폼은
가맹점주의 만족도를 높일 것입니다.

방향4. 쉽고 편리하고 안정적으로.

고객에게 공차의 서비스를 제공함에 있어 안정성 및 편의성 향상을 통해 브랜드 가치를 높이는데 그치지 않고 관리 측면에서 운영의 편의성을 고려하여 디자인 가이드 확립 및 쉽고 편한 관리 시스템을 구축하였습니다.
노출할 콘텐츠를 정하는데 있어 우리는 데이터를 기반으로 하였습니다. 지난 1년간 공차의 구글 애널리틱스 결과를 토대로 기존 방문 고객이 제일 많이 찾은 1, 2순위 콘텐츠인 음료와 매장찾기를 전면에 배치하고 3순위 콘텐츠인 이벤트를 배치하였습니다.

우리는 팝업을 없앴습니다.

대부분의 기업들은 고객에게 어필하기 위해 이벤트나 할인을 진행하며 팝업을 띄우는데 사용자 경험으로 보아 좋지 않은 인상을 줍니다.
진행하는 이벤트에 대해 방문고객에게 계속 알리고 싶어하지만 웹사이트 방문 목적을 저해하는 이런 요소들이
결국 고객으로 하여금 브랜드에 대한 부정적 인식만 쌓아주고 이탈률을 높일 뿐입니다.

팝업이 아닌 웹사이트의 모든 곳에서 원하는 정보를 쉽게 얻을 수 있으며, 이벤트를 제안해준다면 어떨까요?
그 예로 우리는 네비게이션의 영역에서 고객에게 리마인드 시킬 수 있도록 이벤트 영역을 설정하고 자연스러운 노출을 유도했습니다.
단순한 변화지만 팝업창에 짜증을 내는 고객에게 보다 안정적으로 브랜드를 노출할 수 있어 긍정적인 효과를 가져다 줄 것입니다.

뉴리버와 공차가 만난 이후

2017년 4월 14일 공차 웹사이트 리뉴얼로 PC와 모바일 사이트 리뉴얼 이후 2017년 4월 28일까지 현재 공차 웹사이트 방문자 중
80%에 달하는 사람이 모바일로 접근하고 있습니다.
2030 세대가 공차의 브랜드 가치를 체험할 수 있는 공간으로 구축하는데 있어 고려한 부분이 주효하였습니다.

공차 리뉴얼에는 저희가 브랜드에 대해 가지고 있는 철학과 고민을 최대한 반영하였습니다.
우리는 공차의 리뉴얼 이후로도 유지보수를 함께 진행하며, 구글 애널리틱스 분석과 빅데이터 수집 및 분석 등으로 더욱 브랜드를 완성시켜 나갈 것입니다.
기존 단순 정보 제공에 그친 웹사이트에서 새롭게 브랜드를 선보이고 계속 발전해나갈 뉴리버x공차 프로젝트. 앞으로도 뉴리버의 프로젝트를 기대해주세요.

PROJECT

gong-cha.co.kr

  • Design. UI/UX, Grid layout
  • Web strategy. UI/UX 및 Backoffice 기획
    요구사항 분석, 기능정의
  • UI development. 웹 표준, 웹 접근성,
    slider motion,
    css3 transition motion