개발자, 디자이너, 마케터와의 협업 방법
미국 Girl Scouts의 사례로 본 마케터와 디자이너의 접점 찾기
이메일마케팅이 고민이라면
이번 8월호는 204호~207호에 걸쳐 연재됐던 슬로워크의 이메일마케팅을 담아봤다. 당시 원고를 진행할 때만 해도 ‘이메일마케팅’에 대한 인식이 그리 높지 않았던 걸로 기억한다. 하지만 현재, 북저널리즘, 퍼블리, 스페이스오디티, 안전가옥 등 기자의 메일함에는 다양한 브랜드에서 발송하는 뉴스레터가 가득하다. 뉴스레터는 이제 하나의 큐레이션 콘텐츠가 된 것이다. 더 나아가, 쇼핑몰의 발송완료 메일 하나도 고객을 재유입하게 만드는 마케팅 수단이 될 수 있다는 사실. 이메일을 둘러싼 다양한 마케팅 사례를 살펴보자.
03. 개발자, 디자이너, 마케터와의 협업 방법
이메일마케팅을 제대로 하려면 마케터 혼자서, 디자이너 혼자서, 개발자 혼자서는 불가능하다. 타 직군과 협업하게 되면 더 좋은 결과물을 만들어내고, 더 높은 성과를 낼 수 있다. 이 과정에서 서로의 언어와 전문성이 달라서 겪는 시행착오가 있을 수 있다. 이번 회차에서는 마케터와 디자이너가 협업하며 접점을 찾아간 미국 Girl Scouts의 사례를 소개한다.
TEDC(The Email Design Conference)에서 ‘D’는 Design이다. 그렇지만 디자이너만 참석하는 컨퍼런스가 아니다. 여기서의 디자인은 그래픽디자인만 뜻하는 것이 아니라 이메일 제작 전반을 칭하는 넓은 의미의 디자인이다. 그래서 TEDC는 마케터, 디자이너, 개발자가 모두 참석하는 컨퍼런스이고, 이렇게 다른 직군들이 서로를 이해하는 데 도움이 되는 세션이 있었다. 그렇다면, 서로 다른 직군끼리만 이해를 하면 될까? 서로 다른 조직끼리의 이해도 필요하다. 자체 인력으로 이메일마케팅을 수행하는 브랜드도 있지만, 전문성을 지닌 에이전시에게 의뢰하는 경우도 많다. 스티비를 운영하는 슬로워크도 디자인 및 개발 에이전시로 시작했고, 크리에이티브 부서에서는 여전히 마케팅 이메일 제작 대행업무를 하고 있다. 그래서 브랜드와 에이전시의 협업을 많이 경험해 봤고, 어떤 프로세스로 일을 하는지, 얼마나 잘 협업하는지에 따라 결과물의 수준과 서로에 대한 만족도가 달라지는 것을 목격해 왔다. 마침 에이전시와 협업할 때 참고가 될 만한 세션도 있었다. 이번 회차에서는 마케터와 디자이너 간의 시각 차이로 발생하는 문제와 이를 극복한 사례를 소개한다.
형태(디자인)와 기능(마케팅)의 대결
‘The Battle of Form vs. Function’ 세션에서는 특이하게 두 명의 연사가 나왔다. 게다가 한 명은 마케팅 매니저이고 다른 한 명은 디자이너다. Girl Scouts의 시니어 이메일마케팅 매니저인 Kristin Bond(이하, 크리스틴)는 ‘Email Snarketing’이라는 블로그를 운영하며 이메일마케팅 분야에서 10년 가까이 왕성하게 활동하고 있다. 지난해 TEDC에서는 <Content Cliches: stop doing what everyone else is doing>이라는 세션의 연사로 나오기도 했다(지난 2회차 인게이지먼트 챕터에서 CTA버튼에 대해 다룬 Really Good Emails의 Mike Nelson은 이 세션을 지난해 TEDC에서 최고의 세션 중 하나로 꼽기도 했다). 세션은 전체적으로 크리스틴이 주도하고, 중간중간 시니어 이커머스 디자이너인 Rebecca Lewis(이하, 레베카)가 첨언을 하는 식으로 진행됐다.
이 세션에 들어가며 가장 신기했던 것은 두 명의 연사가 Girl Scouts에서 일하고 있다는 것이었다. TEDC 연사 중 비영리조직에서 일하는 것은 이 둘뿐이었다. 비영리조직에 이메일마케팅 매니저가 있다는 것은 전혀 낯선 일이 아니다. 많은 비영리조직이 이메일을 후원자 관리와 모금에 적극적으로 활용하고 있다. 특히 비영리조직에서 발송하는 마케팅 이메일의 평균 오픈율은 25.06%로, 이커머스의 16.76%와 뷰티 & 퍼스널케어의 18.75%에 비해 매우 높다(Email Marketing Benchmarks, Mailchimp, 2016.8.1). 가장 인기있는 이메일마케팅 서비스 중 하나인 Mailchimp에서는 비영리조직을 위한 가이드북을 따로 배포하고 있기도 하다.
그런데 또다른 연사인 레베카의 타이틀은 ‘이커머스 디자이너’였다. 이건 좀 낯설 수도 있는데, 비영리조직과 이커머스가 어울리지 않는다는 생각이 들 수도 있다. 이야기를 들어 보니, Girl Scouts 공식 온라인 스토어에서는 청소년의 걸스카우트 활동과 성인의 자원봉사 활동에 필요한 물품을 비롯해 다양한 종류의 기념품을 판매하고 있었다. 그래서 이커머스를 담당하는 디자이너가 따로 있는 것이었다.
그래픽디자이너와 ‘이메일 너드’의 만남
그럼 이제 본격적으로 디자이너와 마케터이자 ‘이메일 너드’인 두 명의 이야기를 들어보자. 둘은 올해 1월부터 함께 일하게 됐다. 그 전에는 디자이너 레베카 혼자서 이커머스 이메일을 제작했다. 거의 모든 이메일 마케터들이 디자이너들과 논쟁을 벌이는 지점이 있는데, 바로 ‘이미지냐, 라이브 텍스트냐’이다(라이브 텍스트는 글자를 이미지로 만들지 않고 글자 그대로 입력한 것을 뜻한다. 라이브 텍스트는 선택 영역을 지정해서 복사가 가능하고, 확대해도 글자가 깨지지 않는다). 디자이너는 브랜드 가이드라인에서 정한 폰트를 사용하기를 원하는데, 그 폰트는 대부분 시스템 기본 폰트가 아니기 때문에 이메일 본문에서 사용하려면 이미지로 제작해야 한다(대부분의 이메일 클라이언트가 자바스크립트를 지원하지 않기 때문에 이메일에서는 웹사이트에서 흔히 사용되는 ‘웹 폰트’를 적용할 수 없다. 그래서 라이브 텍스트로 디자인하려면 시스템 기본 폰트를 사용할 수밖에 없다). 그렇게 하면 브랜드의 아이덴티티를 지킬 수 있는 반면 이메일 용량이 증가하고, 반응형 디자인에 제약이 생길 수 있다. 디자이너 레베카와 마케터 크리스틴은 이 문제를 어떻게 해결했을까?
가장 많은 클릭이 ‘수신거부’ 링크에서 발생했던 시절
1년 전에 레베카가 디자인했던 이메일이다. 모바일은 고려하지 않고, 마치 웹사이트를 보는 듯 상단 내비게이션 바가 복잡하며, CTA버튼도 눈에 잘 띄지 않음을 알 수 있다. 심지어 이미지맵으로 제작했다고 한다(HTML에서 하나의 큰 이미지를 지도처럼 영역으로 나누어 링크를 거는 방법이다. 디스플레이 사이즈에 따라 레이아웃이 자동으로 조정되는 반응형 디자인이 불가능하고, 이미지 용량이 커서 로딩시간이 오래 걸리기 때문에 최근에는 거의 사용되지 않고 있다).
그리고 놀라운 사실이 하나 더 있다. 가장 많은 클릭이 발생했던 링크가 ‘Unsubscribe(수신거부)’였다고 한다. 당시에는 카피라이터도 없었고, 개발자도 없었고, 레베카는 편집디자인을 공부했었기 때문에 코딩 지식 없이 디자인만 할 줄 알았다. 그래서 ‘이메일 너드’ 크리스틴을 만난 후, 크리스틴이 여러 자료를 보여주고 웨비나(Webinar)에 참석하도록 권유해서 이메일마케팅에 대한 지식을 쌓을 수 있었다고 한다(웨비나는 Web과 Seminar의 합성어다. 온라인에서 실시간으로 진행되고, 참석자가 한정돼 있다. 따라서 오프라인 세미나처럼 좌석 예약을 해야 하고, 정해진 시간에 접속해서 실시간 스트리밍으로 진행되는 세미나를 뜻한다. 이메일마케팅 분야에서 다양한 웨비나가 자주 열리고 있다).
Girl Scouts에서 보내는 이메일의 62.2%가 모바일 디바이스에서 오픈된다. 그렇지만 그 전까지의 이커머스 이메일은 모바일 대응이 전혀 돼 있지 않았다. 그래서 모바일 대응을 최우선으로 하고, 반응형(Responsive) 디자인을 적용했다.
한 걸음부터 개선하기
이커머스 뉴스레터는 주 1회 발송하고 있었다. 그래서 발송을 중단하고 디자인을 전면 수정할 시간이 없어서 일단 첫 번째 단계로 이메일 본문 상단의 내비게이션 바를 변경했다. 기존 디자인은 메뉴가 많고, 글자가 작으며, 헤더(header)와 내비게이션 바의 배경색이 같아서 가독성이 좋지 않았다. 기존 7개 메뉴를 5개 메뉴로 줄이고, 배경색과 글자 크기를 조정해서 가독성을 높였다. 이 때까지는 이미지맵을 사용했다.
반응형 디자인의 우선 고려사항은 ‘폰트’
그 다음으로 내비게이션 바에 반응형 디자인을 적용했다. PC에서 열면 아래 사진의 왼쪽처럼 보이고, 모바일에서 열면 오른쪽처럼 보인다. 여기서 폰트 이슈가 불거졌다.
아래 폰트가 Girl Scouts의 브랜드 가이드라인에서 규정한 폰트, ‘Omnes’이다. 시스템 기본 폰트가 아니기 때문에 이 폰트를 이메일에 사용할 수 있으려면 이미지로 제작해야 한다. 이전 이메일처럼 이미지맵으로 내비게이션을 구현한다면 상관이 없으나, 반응형으로 구현한다면 이미지를 사용하기보다 라이브 텍스트를 사용하는 것이 적합하다. 그래서 크리스틴은 시스템 기본 폰트인 Arial Bold를 사용하자고 제안했다.
아래 사진 왼쪽은 CTA버튼을 라이브 텍스트로 구현해서 Arial 폰트를 사용했고, 오른쪽은 CTA버튼도 이미지로 구현했다. 레베카는 처음에 Omnes 폰트 사용을 주장했지만, 왼쪽처럼 CTA버튼을 이미지와 분리하니 가방이 더 돋보이고, 버튼도 명확해져서 결과적으로 더 좋아졌다고 평했다.
드디어 ‘Right Mix’를 찾다
그래서 지금은 아래와 같이 ‘Right Mix’를 찾아서 이메일을 제작하고 있다. 헤드라인 등 강조해야 하는 문구는 Omnes 폰트를 사용해서 이미지로 만들고, 나머지 문구는 Arial 폰트를 사용해서 라이브 텍스트로 만든다. 그렇게 이메일을 개선한 결과, 지난해 2월~7월과 비교했을 때 이메일에서의 구매 전환이 19% 증가했고, 모바일을 통한 매출이 31% 증가했으며 모바일에서의 이메일 오픈이 68% 증가하는 성과를 달성했다.
앞으로의 과제
크리스틴과 레베카가 앞으로의 과제를 꼽았다. 첫 번째, 모바일 웹사이트를 반응형으로 리디자인할 것. 두 번째, 현재 112개 지부가 각기 다른 ESP를 사용하고 있는데 그것을 통일할 것. 마지막으로 개인화에 더 신경쓸 것. 지속적으로 이메일을 발송해야 하는 상황에서 작지만 중요한 것(내비게이션 바 디자인)부터 개선해 나간 점이 인상 깊었다. 그리고 마케터와 디자이너 어느 한 쪽의 말만 맞는 것이 아니다. 브랜드 가이드라인을 준수해서 일관된 브랜드 경험을 제공하려는 레베카와 수신자들이 많이 사용하는 모바일 디바이스에서의 사용성을 강화하려는 크리스틴의 입장 모두 이해가 된다. 사실 정답은 브랜드 가이드라인에 이메일에서의 활용법에 대한 규정이 들어있어야 되는 게 아닌가 싶다. 레베카와 크리스틴이 서로의 의견을 알맞게 적용해서 ‘Right Mix’를 찾은 과정이 매우 흥미롭다.
