웹페이지 제작 사례, 대기업 CS프로그램 제작회사의 가장 중요한 XX

|

아몽소프트웨어

|

네이버 · 카카오 · KT와 협력하며,

GS리테일 · 클래스 101 · 블랭크 등의

대기업 유명스타트업의 CS프로그램을 제공하는 회사

위 회사는 어떤 회사일까요?

안녕하세요. 그동안 진행하였던 프로젝트가 성공리에 마무리되며 웹페이지 제작 문의가 폭주하고 있는 아몽소프트웨어입니다.

웹페이지 제작

다음에 이어지는 내용은 이번에 마무리된 프로젝트인, TWC의 프로젝트를 설명하는 글인데요.

아마 이번 글을 읽으시는 분들은 TWC라는 이름이 많이 낯설으실 것같습니다. 처음에 아몽소프트웨어도 똑같은 것을 느꼈습니다.

하지만 프로젝트 진행을 위해 TWC를 방문하였을 때에는, 한 건물 전체가 TWC 사옥이었으며 그 안에는 400 여명의 임직원분이 계신다는 사실을 알았습니다.

위와 같은 많은 400명에 가까운 임직원 분들이 TWC에 계시지만, 임직원분들 모두가 회사업무에 집중하고 있어 홈페이지 리뉴얼을 사내에서 진행하기 어려운 상황이었습니다.

그렇게 TWC 측은 웹에이전시인 아몽소프트웨어와 함께 일 할 수 있게 되었으며, 다음과 같은 결과물을 얻어가셨습니다.

(Before) 리뉴얼 전 홈페이지 모습

웹페이지 제작

(After) 리뉴얼 후 홈페이지 모습

TWC_2

 

어떻게 TWC는 위와 같은 결과물을 얻아가실 수 있으셨을까요? 지금 바로 알아보도록 하겠습니다.

 

웹페이지 제작사례, TWC

TWC는 상담 솔루션을 판매하는 회사로, 홈페이지를 통해 제품문의를 이끌어내는 것이 핵심 목표였는데요.

그러기 위해서는 홈페이지에서 서비스의 장점을 잘 나타내고, 가치를 입증하여 방문자의 마음을 사로잡는 것이 중요했습니다.

하지만 이전의 메인페이지에서는 서비스에 대해 한눈에 이해하기 힘들었고, 고객의 흥미를 확 이끌만한 요소가 없었습니다.

따라서 홈페이지를 통해 문의를 만들어내는 것이 매우 어려웠죠. 그래서 TWC 대표님께서는 리뉴얼을 결정하신 것 인데요.

아몽소프트웨어는 문의를 유도하는 홈페이지를 만들기 위해 어떤 기획과 디자인을 진행하였을까요?

그 내용에 대해서는 아래에 나와있으니, 함께 확인해보도록 하겠습니다.

웹페이지 제작사례, TWC

 

1. 고객의 마음을 사로잡는, 히어로 섹션

 

이전의 TWC 홈페이지가 문의를 유도하지 못한 것은, 5초 안에 방문자에게 매력을 어필하지 못했기 때문입니다.

사용자가 홈페이지에 방문하고 이탈하기까지 걸리는 시간은 고작 5초에 불과합니다.

그렇기 때문에 히어로페이지에서 흥미를 끌지 못한다면, 사용자는 곧바로 나가기 버튼을 클릭하게 될 것 입니다.

(히어로페이지 : 방문자가 맨처음 접하는 홈페이지의 첫 화면)

❌  Before page

 웹페이지 제작 2

기존 홈페이지의 히어로페이지에서는 슬라이드를 통해 서비스에 대해 설명하고자 하였습니다.

하지만, 어떤 서비스인지 한 눈에 알아보기 힘들었고, 그다지 사용자의 흥미를 유발할만한 요소가 없었습니다.

따라서 사용자가 히어로페이지에서 더이상 스크롤을 내리지 못하고 홈페이지를 이탈하는 상황이 발생하게 된 것 인데요.

✅  After page

 웹페이지 제작 3

 

아몽소프트웨어는 히어로페이지에서 서비스에 대한 정보를 전부 알려주지 않고, ‘오퍼레이션, 이제 전문가에게 맡겨보세요’ 라는 카피라이팅을 사용해 궁금증을 유발하였습니다.

또한, 자사 제품 광고 모델인 배우 정경호님의 사진을 활용하여 신뢰감을 주고, 관심을 끌고자 하였습니다.

그 결과, 방문자가 홈페이지에 더 오랫동안 머물게 하여 홈페이지 체류시간을 늘릴 수 있었습니다.

2. 자사의 서비스를 알리는, 서비스 섹션

 

히어로페이지에서 사용자가 이탈하는 것을 막았다면, 이제는 자사 서비스에 대해 소개할 차례인데요.

❌  Before page

기존의 홈페이지에서는 히어로페이지의 이미지 슬라이드를 통해 서비스를 소개하였는데요.

이 때문에 사용자의 흥미를 유발하지 못했을 뿐더러, 읽다보면 넘어가는 설명 때문에 가독성을 떨어뜨리는 요인이 되기도 하였습니다.

✅  After page

웹페이지 제작 7

웹페이지 제작 8

그래서 아몽소프트웨어는 히어로페이지와 별개로 따로 서비스 섹션을 만들어, 서비스의 핵심만 소개하는 카피라이팅과 실사용 이미지를 통해 알기 쉽게 전달하고자 하였습니다.

또한, 마우스를 올리면 파란색으로 변하는 CTA버튼(서비스 살펴보기)를 통해 사용자가 상세페이지로 넘어가도록 유도하고자 하였습니다.

(CTA 버튼 : Call To Action의 줄임말로 사용자의 행동을 유도하는 버튼)

이때, 사용자가 많은 페이지를 열람한다면 페이지 뷰가 올라가면서 홈페이지 SEO 점수에 좋은 영향을 끼칠 수 있습니다.

SEO 점수가 높아진다면 구글이나 네이버와 같은 검색엔진에서 홈페이지가 상위노출되는 마케팅 효과까지 얻을 수 있죠.

 

3. 검증된 서비스임을 알리는, 기업 로고 섹션

 

지금까지 사용자의 관심을 끄는 히어로페이지와 서비스 소개 섹션에 대해 설명을 드렸는데요.

아마 홈페이지가 윗 부분만 존재했다면 그 어느 누구도 TWC의 서비스를 구매하지 않았을 것입니다. 그 이유는 바로 제품에 대한 신뢰감이 없기 때문인데요.

이같은 문제를 해결하고자 이미 TWC의 제품을 사용하고 있는 유명 기업들의 로고를 홈페이지에 추가하여 사용자에게 신뢰를 주고자 하였습니다.

❌  Before page

 웹페이지 제작 9

기존 홈페이지의 기업 로고 섹션은 로고의 크기가 너무 크고, 스크롤 압박이 심해서 화면을 꽉채우는 듯한 답답한 느낌을 주었습니다.

뿐만 아니라, 로고가 변경된 기업도 몇몇 있었음에도 수정을 하지 않아 구버전인 상태로 올라가 있는 경우도 존재하였습니다.

이같은 점들은 오히려 전문성과 신뢰성을 떨어뜨리는 요인이 되기도 하였는데요.

✅  After page

웹페이지 제작 10

아몽소프트웨어는 사용자가 알만한 유명 기업의 로고를 우선적으로 사용하여 스크롤 압박의 문제를 해소하고자 하였습니다.

또한, 1,000개 이상의 브랜드라는 카피라이팅을 추가하여 사용자로 하여금 ‘이렇게나 많은 기업이 사용하고 있구나’ 라는 생각이 들게 설계하였습니다.

뿐만 아니라, 새롭게 리뉴얼 된 기업의 로고도 업데이트를 진행하였습니다.

 

4. 신뢰감을 증대하는, 파트너사 섹션

 

앞서 자사 제품을 사용중인 기업을 알리면서 검증된 상품임을 알렸습니다. 하지만, 위 로고들은 사용자가 모를 수도 있는 기업들도 다반수였는데요.

그래서 그 아랫 부분에는 누가 봐도 알만한 대기업과 협력하고 있음을 알리면서 신뢰감을 더욱 증대하고자 하였습니다.

❌  Before page

 웹페이지 제작 11

네이버, 카카오, 카페24, KT 등 대중들에게 이미 알려진 기업의 로고를 활용한 것은 좋았으나, 카피라이팅에서 아쉬운 부분이 있었는데요.

우선 글의 내용이 잘 읽히거나 와닿지 않았고, TWC가 성장하고 있다는 것은 제품을 구매하는 사용자의 입장에서는 아무런 득이 없는 내용이었습니다.

따라서 고객에게는 의미가 없는 카피라이팅이었다는 것인데요.

✅  After page

 

웹페이지 제작 12

아몽소프트웨어는 이전의 카피라이팅보다 쉬운 단어를 사용하여 사용자가 카피라이팅을 읽는데 편리하도록 변경하였습니다.

또한, ‘완벽한 서비스를 제공하기 위해 파트너쉽을 지속한다’와 같은 문구로 신뢰를 증대하는 것은 물론, 고객에게 최상의 서비스를 주는 회사라는 이미지를 주고자 하였습니다.

 

5. 기업의 가치를 알리는, 뉴스 섹션

 

앞서 설명드린 협력사와 자사 제품을 이용중인 기업을 소개함으로써, 신뢰를 줌과 동시에 가치입증까지 이루었습니다.

하지만, 이에 뒷받침하여 실제로 언론에 보도된 기사를 활용하는 것도 좋은 방안이라고 생각하였습니다.

❌  Before page

웹페이지 제작 13

이전 홈페이지의 뉴스 섹션은 너무 오래된 기사를 사용하고 있었을 뿐더러, 기사를 클릭시 홈페이지 내에 있는 기사 페이지로 이동을 하였는데요.

실제 기사 페이지가 아닌, 홈페이지에 옮겨 적은 내용이라서 신뢰를 떨어뜨리게 되는 문제가 있었습니다.

✅  After page

 

아몽소프트웨어는 오래된 기사대신, 비교적 최근의 기사이면서 TWC의 가장 중요한 이슈는 무엇일까 생각을 했습니다. 그러던 와중 자극적인 제목의 기사를 선택하게 되었는데요.

이로 인해 방문자의 클릭률을 높였을 뿐더러, 실제 기사페이지로 이동하게 하여 신뢰성이 떨어지는 문제를 막을 수 있었습니다.

 

웹페이지 제작사례, TWC 홈페이지에 사용된 기술

TWC 홈페이지에 사용된 기술을 설명하기에 앞서, 이 글의 제목이 대기업 CS프로그램 제작회사의 가장 중요한 XX 였던 걸 보셨나요?

똑똑하신 분들이라면 벌써 가장 중요한 XX가 무엇인지 파악하셨을 거라 생각합니다.

네 맞습니다. B2B서비스를 하는 TWC에게 가장 중요한 XX는 바로 문의를 받아내는 폼 즉, 데이터관리입니다.

 

문의 폼 구현을 통한 쉬운 데이터 관리

 

이미지 파일뿐만 아니라, 모든 형식의 파일을 최대 5개까지 업로드가 가능하도록 하여 고객에게 편리함을 주고자 하였습니다.

또한 해당 문의 폼은 워드프레스에 있는 WP-forms라는 기능을 활용하여 제작된 폼인데요.

WP-form의 장점은 손쉽게 문의 데이터를 관리할 수 있다는 점입니다.

홈페이지를 통해 들어온 문의를 관리자 페이지에서 읽기, 수정, 삭제 등 모든 작업이 가능하기 때문인데요.

뿐만 아니라, 이름, 기업, 직책 등 문의 폼에서 받고자하는 데이터의 입력창을 마음대로 만들 수 있고, 실제로 조회할 때에도 받아온 값을 모두 테이블로 정리해서 볼 수 있습니다.

이처럼 기업의 고객을 위한 홈페이지 UX / UX 디자인 & 기업을 위한 손쉬운 기능 구현이 가능했기에 TWC측에서 감사하게도 저희를 찾아주셨다고 생각합니다.


 

지금까지 TWC의 웹페이지제작 사례에 대해 설명드렸습니다.

글을 마치기전 여기까지 읽어주신 대표 / 담당자님께 한 가지 말씀을 드리고 싶습니다.

최근 다양한 규모의 회사에서 매일같이 저희에게 많은 문의를 넣어주시고 있습니다.

현재는 폭발적인 문의로 인해 프로젝트 수주가 많아지면서, 쿼터가 한 자리만 남아 있는 상태인데요.

많은 프로젝트를 진행함에 따라 아몽소프트웨어의 기술 수준도 성장하고 있으며, 홈페이지 제작뿐만 아니라 브랜딩회사까지 사업의 규모를 늘릴 수 있었습니다.

아몽소프트웨어가 이렇게 성장한 것은 모두 클라이언트님들 덕분이라는 말씀을 드리고 싶습니다.

세상에는 400개가 넘는 매우 많은 웹에이전시가 존재합니다. 그럼에도 저희를 믿고, 프로젝트를 맡겨주신 분들께 진심으로 감사의 말씀을 전하고 싶습니다.

저희에게 믿음을 주신만큼 앞으로도 기대에 보답하는 업체가 되겠습니다.

긴 글 읽어주셔서 감사드리며, 다음번에는 더 좋은 정보로 찾아뵙겠습니다.

우리의 목표는 단 하나,

소비자가 대표님의 상품을 구입하게 만드는 것