brunch

You can make anything
by writing

C.S.Lewis

by 정윤선 Oct 15. 2019

랜딩페이지 리뉴얼

랜딩페이지란 무엇인가?


랜딩페이지는 브랜드의 핵심이 가장 많이 담긴, 플랫폼의 대문 역할을 하는 페이지입니다.


이번에 랜딩페이지 리뉴얼 작업을 진행하면서 참고할만한 글을 찾았는데, 

서비스의 특성이 강하게 반영되는 페이지라서 그런지 생각보다 랜딩페이지 설계에 대한 심도 있는 글이 많이 없었습니다.


서비스 설계에 정답은 없지만 그래도 랜딩페이지의 목적에 충실한 글을 통해 디자인 설계에 참고할 수 있는 실무적인 글을 쓰고 싶었습니다.


랜딩 페이지의 리뉴얼을 고민하고 계시다면 이 글이 도움이 되었으면 좋겠습니다.






어떤 기능을 리뉴얼하기 전엔 리뉴얼의 목적이 필요합니다.


간혹 잘 쓰고 있던 서비스가 리뉴얼이 되며 기존 학습 패턴이 무너지고 사용성이 오히려 저해된 경우들을 경험해 보셨을 텐데요,  

뚜렷한 목적 없이 리뉴얼만 진행하게 된다면 기존 UI에 익숙해진 유저들의 거부감만 일으키고 아무 결과도 얻어내지 못하는 경우가 생깁니다.


그런 부작용을 막기 위해 리뉴얼 전에 우선 랜딩이란 무엇인가? 에 대한 정의를 내리고 그에 맞는 목적을 설정해보았습니다. 



1. 랜딩페이지란 무엇인가?


랜딩페이지는 유저들에게 첫인상이 되는 페이지인데요, 현재의 랜딩페이지를 서비스의 첫인상으로 사용하기엔

1. 디자인이 노후되어 디자인을 개편하는 작업이 필요했고 
2. 유저들에게 전달하고 싶은 메시지가
 달라지기도 했고 
3. 
특정 정보가 랜딩에서 더 강화되었으면 좋겠다고 생각되는 부분들이 있어서
개선 작업을 진행하게 되었습니다.


본격적인 개선에 앞서 가장 먼저 정해야 할 부분은 [2. 유저들에게 전달하고 싶은 메시지가 달라짐]으로 랜딩페이지에서 전달하고 싶은 메시지가 어떤 것인지를 정하는 일이었는데요,
이 부분이 가장 먼저 이야기되어야 하는 이유는 해당 항목이 랜딩페이지가 왜 존재하는가에 대한 답이기도 하기 때문입니다.


기존 랜딩페이지의 쓰임새로 미루어 보아 랜딩페이지의 존재 이유는 크게 두 가지였습니다. 


첫 번째는 우리는 어떤 서비스이고, 무슨 일을 하는지에 대한 서비스 설명을 하기 위해서,
두 번째는 우리 서비스를 쓰도록 유저들을 후킹 하기 위해서.


목적 1. 우리는 어떤 서비스인가? 

그렇다면 랜딩에서 서비스를 어떻게 효과적으로 설명할 수 있을까요?

어딘가 모자란 설명을 하지 않기 위해 기존에 잘 알려진 설명 프레임 중 '육하원칙'을 도입하도록 했습니다.

누가? 유저, 의뢰할 프로젝트가 있는 클라이언트 / 일을 하고 싶은 파트너스

언제? 본인이 생각한 서비스의 개발이나 디자인을 아웃소싱하고 싶을 때 / 디자인, 개발 일감을 찾을 때

무엇을? 개발, 디자인 카테고리의 IT 프로젝트를

어떻게? 위시켓의 프로세스로

어디서? 위시켓에서


목적 2. 유저들을 후킹 하기 위해서는 어떤 요소가 필요한가? 

유저들을 후킹 하기 위해서는 어떤 요소가 필요할까요?

1. 서비스의 메스 + 데이터 과시

    대기업, 믿을 만한 업체와 함께함

    많은 수의 프로젝트, 많은 수의 유저, 높은 프로젝트 등록 금액

    국내 1위의 선도업체

2. 서비스의 장점

    빠르고 편리하고 정확한 프로젝트 거래

    기존 아웃소싱 시장의 문제를 해결
3. 안심할만한, 진정성 있는 사용후기 콘텐츠

    실제로 사용해본 사람들이 이 서비스가 좋다고 하는구나.

4. 서비스의 니즈가 있는 유저의 마음 건드리기

    내가 사용한다면 어떨까? 나도 편리하게 사용할 수 있겠구나. 

5. CTA

   회원가입, 프로젝트 등록, 로그인


 



2. 타겟이란 누구인가?


위에서 랜딩에서 필수적으로 가져가야 하는 정보들을 나열했다면, 이번엔 [3. 특정 정보가 랜딩에서 더 강화되었으면 좋겠다고 생각되는 부분들이 있었음]의 의견들을 살펴보고 항목을 보강, 추가해보겠습니다.

이 부분은 유저의 피드백을 반영하는 것이 좋을 것 같아서 위에 정의한 랜딩의 존재 이유에 따라 유저를 4가지 타입으로 나누어 유저 피드백 표에 넣어보았습니다.


유저 피드백을 뜯어보면 추가될 항목이라기보다 강화될 항목들이 보였는데요,  


- '서비스 설명'의 육하원칙
- '유저 후킹'에서 서비스의 니즈가 있는 유저의 마음 건드리기 / 사이트의 장점 / 고액 프로젝트를 맡겨도 안심할 수 있는 포인트 / 프로세스에 대한 설명
이 더 강화되어야 할 것으로 보였습니다.




3. 우리와 비슷한 서비스는 어떻게 하고 있는가?  

그에 비해 우리가 잘 전달하는 것은 무엇이고, 잘 못 전달하는 것은 무엇인가?


어떤 항목이 들어가면 좋을지 방향성이 정해졌는데, 

그 방향성이 올바른지 알아보기 위해 업종은 비슷하지만 규모가 더 큰 해외 사이트인 업워크와 랜딩페이지 비교를 해보았습니다.


비교방식은 랜딩 페이지에서 해당 항목에 얼마 정도의 비중을 할애하고 있는지 단순 비교를 하는 방식으로 진행했고, 해당 조사를 통해 덜 설명되고 있는 부분(더 추가하면 좋을 항목)과 더 설명되고 있는 부분(덜어내거나, 이미 잘하고 있는 항목)을 찾아보았습니다.

덜 설명되고 있던 부분 : 유저와의 심리적인 접점(위시켓을 실제로 사용한다면? 나도 위시켓을 사용할 수 있을까?) / 어떻게(프로세스 설명) / 왜(당위성) / 안심할만한 진정성 있는 콘텐츠

우리가 더 많이 설명하고 있는 부분 : 메스, 데이터 과시 / CTA / 위시켓의 장점


두 사이트를 비교해 보니 두 사이트가 몸담고 있는 사회적 특징을 알아볼 수 있었는데요,


위시켓은 프리랜서 산업이 정착하지 않은 한국에서 서비스를 운영하다 보니 기존 프리랜서 시장의 문제를 해결하고 있다는 점과 아웃소싱도 안전하게 진행할 수 있다는 내용을 주로 어필하고 있었고, 

스타트업으로 시작한 서비스이다 보니 서비스의 메스나 데이터 과시를 통해 유저들에게 신뢰를 줘서 서비스의 사용을 유도하고 있었습니다. 


반면, 어느 정도 프리랜서 산업이 정착한 미국에서 서비스를 운영하는 업워크의 경우 만약 서비스를 사용한다면 어떻게 사용하는 것인지, 어떤 상황에서 업워크라는 서비스를 사용하는 건지에 대한 설명이 더 많은 것으로 보였습니다.


이 항목들로 미루어 보아 우리가 부족한 점이 [2. 타겟이란 누구인가?]의 개선점과 비슷해 해당 부분을 개선하면 유저들이 사용하기에 더 나은 랜딩페이지가 나올 것이라고 예상해 볼 수 있었습니다.




4. 내용을 어떻게 짜야 우리가 원하는 메시지가 전달될까?  


A. 우리는 00을 하는 회사이고, 많은 경험이 있습니다.


A-1. 리뉴얼 목적 : 서비스 설명 

강화할 포인트 : 육하원칙의 무엇을? 어떻게? 강화

위시켓에서 전달하고 싶은 것 : 위시켓의 신념과 대의, 우리는 이래서 위시켓을 합니다. 

유저 시나리오 : 위시켓이 뭐지? / 왜 위시켓을 써야 하지? / 내가 찾는 그 서비스인가? / 여기는 뭐하는데인가?

A-2. 리뉴얼 목적 :  유저 후킹 요소

강화할 포인트 : 서비스의 메스 + 데이터 과시

위시켓에서 전달하고 싶은 것 :  우리의 신념과 대의에 동감하면  위시켓을 쓰세요. 우리는 규모가 이렇게나 커서 믿을 수 있습니다.

유저 시나리오 : 회사가 이렇게나 커? 여기 뭔데 이렇게 커? / 베테랑이구나 / 이렇게 많은 경험이 있다니! / 진짜 이거 사실인가? 이렇게 잘되나? 

유저 시나리오 :  여기까지 봤을 때, 어떤 서비스인지 아직 감이 잘 안 오는데.. / IT아웃소싱이라는데 구체적으로 어떤 프로젝트들이 있나? / 좋아 보이는데 나도 한번 써볼까?


B. 그 00은 구체적으로 이런 것들이고, 일을 맡겨주시면 이렇게 일이 진행됩니다. 


B-1. 리뉴얼 목적 :  유저 후킹 요소

강화할 포인트 : 서비스의 니즈가 있는 유저들의 마음 건드리기

위시켓에서 전달하고 싶은 것 : 의뢰(수주)하고 싶은 일들이 우리에겐 있습니다. / 위시켓은 구체적으로 이런 일들을 취급합니다. 

유저 시나리오 : 아 , 개발 디자인 쪽 프로젝트를 거래하는 곳이구나 / 내가 할 수 있는 일이 있구나 (혹은) 없구나 / 어! 이건 내가 일해보고 싶은데! / 이건 내가 맡기려고 했던 거랑 비슷한데! / 이런 것들을 적어서 올리면 되나 보네 / 여기는 이런 전문가들이 있구나. 이 사람한테 일 맡겨보고 싶은데! / 회사가 이렇게나 커? 여기 뭔데 이렇게 커?

B-2. 리뉴얼 목적 :  서비스 설명

강화할 포인트 : 육하원칙의 '어떻게?' 강화

위시켓에서 전달하고 싶은 것 : 한번 써볼 생각이 들었다면 어떻게 쓰는지 궁금하시죠?/ 위시켓에선 이렇게 일이 진행됩니다. / 우리는 모든 프로세스에 장점이 있어서 아웃소싱을 하고 싶다면 결국 사용할 수밖에 없으실 겁니다. 

유저 시나리오 : 한번 써볼까? 위시켓 사용하려면 어떻게 해야 하지? / 위시켓에서는 이런 절차로 움직이는구나 / 프로세스 중에 이 부분은 참 좋다 / 생각보다 프로세스가 길구나 혹은 짧구나 / 이 프로세스는 더 자세히 알고 싶다


유저 시나리오 :  근데 프로세스가 약간 귀찮기도 한 것도 같고, 다른 업체들도 있던데.. / 실제로 써보면 어떠려나... / 이런 이런 건 위험할 것 같은데


C. 위시켓은 이렇게 좋고, 실제로 사용해 본 사람들도 좋다고 말합니다. 우리는 정말 좋은 플랫폼입니다.


C-1. 리뉴얼 목적 :  유저 후킹 요소

강화할 포인트 : 서비스의 장점

위시켓에서 전달하고 싶은 것 : 위시켓을 사용하면 이렇게 좋습니다. / 위시켓은 기존 아웃소싱 시장의 문제를 해결해 줍니다.

유저 시나리오 : 우와 좋다 / 내가 위험할 거라 생각하던 부분들이 많이 해결된다 / 똑똑한 서비스구나 / 새로운 미래지향적인 일하는 방식이다 / 아웃소싱했다 망했는데 해봐야 알겠지만 그래도 이런 장치들이 있으면 괜찮을 것 같네

C-2. 리뉴얼 목적 :  유저 후킹 요소

강화할 포인트 : 안심할만한, 진정성 있는 사용후기 콘텐츠

위시켓에서 전달하고 싶은 것 : 단지 우리가 말하는 장점이 아니라 진짜 위시켓을 써본 사람들도 좋았다고 했습니다.

유저 시나리오 : 위시켓에서 말하는 장점이 정말이구나 / 나도 이런 비슷한 거 외주 맡기려 하는데, 만족할 수 있겠네 / 만족도가 높은 서비스구나

C-3. 리뉴얼 목적 :  유저 후킹 요소

강화할 포인트 : 서비스의 메스 + 데이터 과시

위시켓에서 전달하고 싶은 것 : 이런 똑똑하고 잘 나가는 좋은 회사들도 위시켓이랑 일했습니다 / 그런 회사들이 위시켓을 선택한 걸 보면 위시켓은 좋은 플랫폼입니다  

유저 시나리오 : 나랑 비슷한 업계에 있는 누구누구도 위시켓 썼었구나 / 우와 나 여기 아는데 여기도 위시켓 썼구나/ 다들 쓰는데 나만 몰랐나 봐 



5. 유저들에게 유저 시나리오의 반응을 이끌어 내려면 어떻게 디자인이 되어야 할까?  


A. 우리는 00을 하는 회사이고, 많은 경험이 있습니다.

A-1. 위시켓의 신념과 대의, 우리는 이래서 위시켓을 합니다.


디자인 타입 :  1. 타이틀 텍스트 + 2. 서브 타이틀 텍스트 +  3백그라운드 이미지 + 4. CTA

as-is


1. 타이틀 텍스트

랜딩의 텍스트는 유저와 처음 커뮤니케이션을 하는 순간이기 때문에 굉장히 중요합니다.

누군가를 처음 만났는데 그 사람이 말을 이상하게 한다면 어울리고 싶지 않겠지요? 

특히나 그게 플랫폼 서비스라면 유저를 놓칠 확률이 큽니다.

그래서 기존 프로젝트들보다 조금 더 많이 신경 써서 텍스트를 수정해보도록 하겠습니다.


기존 랜딩 페이지에는 '빠르고 안전한 아웃소싱 플랫폼'을 핵심 가치 문구로 사용하고 있었습니다.


해당 문구를 고쳐서 위시켓이 어떤 곳인지를 설명해 주려하는데요,
카피의 방향성은 카피 안에 1. 위시켓이라는 기업명을 넣고, 2. 유저의 니즈를 넣는 것으로 결정했습니다.


위시켓이라는 기업명을 타이틀 텍스트 위치에 굳이 넣는 이유는 위시켓이라는 서비스를 잘 모르는 유저가 처음 들어와서 읽는 문장이다 보니 서비스 명이 노출되어야 할 것이라고 판단했고, 

거기에 유저 니즈를 붙여서 유저들에게 '위시켓은 불편함을 해소해 주고자 하는 서비스다'라는 선언을 해주기 위함이었습니다. 

이렇게 랜딩 텍스트가 구성된다면 해당 불편함을 가진 유저들의 플랫폼 사용을 더 유도할 수 있겠지요.


- 유저들의 니즈를 해결해 주는 서비스, 위시켓

다음으로 정할 요소는 '유저들의 니즈'에 어떤 항목이 들어가면 좋을까? 였습니다.

위시켓이 해결하고 있는 대표적인 기존 시장의 문제는 1. 찾기 어려운 문제, 2. 클라이언트와 작업자 간의 신뢰 문제, 3. 계약대금의 문제가 있습니다. 위시켓은 해당 문제를 빠르고, 믿을 수 있고, 안전하게 해결하고 있습니다.

위시켓을 사용하면 위의 문제들을 해결할 수 있다는 점이 카피에 녹아들어 가면 좋을 것 같다는 생각을 했습니다.


- 작업자를 빠르게 찾을 수 있고, 파트너들의 정보를 믿을 수 있고, 계약 대금의 걱정이 없는 안전한 서비스 위시켓

만들어 놓고 보니 너무 길어서 주어 부분을 빼서 문장을 줄여보도록 하겠습니다.


- 빠르고, 믿을 수 있고, 안전한 서비스 위시켓

이제 '서비스'부분을 다듬어야겠다는 생각이 들었습니다. 

이 부분은 간단히 저희가 하고 있는 일인 ' IT 아웃소싱 플랫폼'을 넣어줍니다.


- 빠르고 믿을 수 있고 안전한 IT 아웃소싱 플랫폼, 위시켓

여기까지 문장을 만들어보니 명사+명사로 구성된 문장의 한계 때문에 문장의 구성이 딱딱하고 마음에 와 닿지 않았습니다. 

해당 불편함을 가진 유저들의 플랫폼 사용을 유도하려면 <어떻게? 무엇을? 어디서?> 구조에서 <무엇을? 어디서? 어떻게?>로 '무엇을?'을 먼저 말해줘야겠다는 생각이 들었습니다.

유저들에게는 '어떻게?'보다는 '무엇을?'을 먼저 노출해 주는 것이 더 강한 트리거가 될 것이기 때문이지요.


- IT 아웃소싱을 위시켓에서 빠르고 안전하게

 이 문장을 앞의 문장과 비교해 본다면 '무엇을'이 맨 앞으로 온 문장은 IT 프로젝트를 가지고 있는 유저들을 후킹 하는 효과가 강해져서 기존에 달성하고자 하는 목적(육하원칙의 설명, 유저 후킹, 서비스 선언)이 더 잘 달성된다고 느껴졌습니다.



2. 서브 타이틀 텍스트

위의 문장을 두고 보면 목적이 달성되었지만,  IT 아웃소싱이라는 말이 유저들에게 어렵게 느껴질 수도 있을 것 같았습니다.

유저들이 어려워할 만한 부분에 대한 설명을 잘해주고, 유저의 마음에 서비스가 더 잘 와 닿게 하려면 IT 아웃소싱의 카테고리로 예를 든 서브텍스트를 한 줄 추가하면 좋을 것 같습니다.


- IT 아웃소싱을 위시켓에서 빠르고 안전하게

- 애플리케이션 개발, 웹 개발, 소프트웨어 개발, 웹 디자인, 커머스, 쇼핑몰 개발 등 (해당 카테고리가 현재 등록된 프로젝트의 75% 차지)



3백그라운드 이미지

랜딩 페이지 상단에 이미지를 사용할 경우 직관적인 브랜드 인지가 가능하고, 본인이 이 브랜드를 사용하는 상황을 쉽게 상상할 수 있습니다. 

또한 이미지 가공을 통해 원하는 효과를 낼 수 있기에 많은 브랜드들이 선호하는 방식이기도 하지요. 

이미지가 포함된 게시물은 텍스트만 있는 게시물보다 참여도가 650 % 높다는 연구결과도 있었습니다.


백그라운드의 이미지는 어떤 디자인을 택해야 할지 자유도가 높아 적합한 이미지를 선택하기 위해서는 몇 가지 시안과 이미지를 통해 달성하고자 하는 목적이 있어야 했습니다. 


후보 1. 유저와의 심리적 거리를 좁히기 위해 이미지 안의 특정 유저가 위시켓을 사용하고 있는 이미지 활용. 

이미지를 본 유저가 자신을 대입해 위시켓을 사용하는 느낌을 줄 수 있는 이미지.

후보 1의 시안을 잡을 때는 디바이스의 기종을 많이 신경 썼습니다. 

기준 디바이스인 노트북과 기준 디바이스는 아니지만 해상도를 대응하고 있는 태블릿 두 가지 버전을 사용해 작업했었는데요(모바일은 현재 위시켓 프로덕트의 기준 디바이스가 아니어서 제외), 


태블릿을 사용한 이미지는 사용자와 디바이스의 거리가 가깝기 때문에 서비스와 유저 간의 친밀함을 연출할 수 있었습니다. 또한 좀 더 '서비스를 사용하고 있는 나'를 상상하게 해 준다는 장점이 있었으나, 태블릿 자체가 위시켓 닷컴의 기준 디바이스가 아니어서 메인 이미지로 사용하기 어려웠고 태블릿이 주는 핸디한 느낌이 약간은 진지하게 사용해야 하는 위시켓 서비스와 맞지 않아 해당 이미지를 반려했습니다.

 

노트북의 경우는 노트북의 윗 라인이 GNB와 수평을 이루어 다소 지루해 보인다는 느낌이 있었습니다. 

강하게 투시를 먹일 수가 없어서(강한 투시를 입힐 경우 이미지 왜곡이 심해 보임) 이미지의 몰입도가 약했고, 키패드와 손이 이미지에서 같이 연출되다 보니 아무래도 화면으로 시선이 많이 가지 않고 인물로 시선이 가서 원하는 집중도를 이끌어 낼 수 없었습니다.


후보 1의 두 이미지 다 결정적인 단점이 있었는데요, 그것은 위시켓 사이트의 어떤 정지된 한 화면만을 보여주는 것은 컨텍스트를 내포할 수 없어서 우리가 뭘 하는 곳인지, 서비스에 대한 감을 잡기 어렵다는 것이었습니다. 



후보 2. 신뢰를 강조하기 위해 사무실이나 일하는 장면을 노출해서, 위시켓이란 회사가 형체가 있고 고액의 프로젝트 대금을 송금해도 괜찮을 것이라는 안심을 주는 이미지.

후보 2는 사무실을 노출해서 위시켓이 실체가 있다는 것을 드러내 주고, 사무실의 한쪽 벽을 사용해서 텍스트와 버튼을 돋보이게 하는 레이아웃을 사용했습니다.

근데 막상 작업을 해 놓고 보니 인테리어 사이트나 카페 같은 느낌이 들고 위시켓이 뭐하는 서비스인지 감을 잡을 수 없었습니다.



후보 3. 오브젝트를 이용해 텍스트의 집중도를 높인 이미지

해당 안을 통해서는 일을 할 때 사용되는 오브젝트를 간결하게 배치해 텍스트의 집중도를 높이고 일할 때 쓰는 플랫폼이라는 이미지를 구성해보려 했는데요,

이 이미지 또한 오브젝트의 의미들이 위시켓 닷컴을 설명하기엔 약하다고 생각되어 반려되었습니다.



후보 4. 일러스트를 사용해 서비스의 설명이 가능하고, 우리가 어떤 일을 하고 있는지 유추할 수 있는 이미지 

일러스트를 사용하는 것은 '서비스에 대한 설명을 우리가 원하는 데로 할 수 있다'는 것에 가장 큰 장점이 있었습니다. 최종 결정은 일러스트를 이용해 우리가 원하는 느낌을 주는 방향으로 픽스되었는데요, 일러스트의 여러 레이어를 통해 컨텍스트 같은 스토리가 담긴 화면을 연출할 수 있었기 때문입니다.



최종 결정된 일러스트는 여러 의미를 내포하고 있는데요

전체적인 톤 앤 매너는 위시켓 색상을 활용한 밝은 느낌을 주고자 했고

프로젝트를 통해 위시켓과 파트너(작업자), 클라이언트가 서로 연결되며 위시켓에서 예산 상담과 계약서 작성, 지원자 선택, 일정 상담을 해준다는 의미를 담았습니다.



4. 프로젝트 등록 CTA

CTA의 경우, 텍스트와 함께 좌정렬 시켜서 텍스트를 읽고 자연스레 버튼을 확인할 수 있도록 배치했습니다.




A-2. 우리의 신념과 대의에 동감하면 위시켓을 쓰세요. 우리는 규모가 이렇게나 커서 믿을 수 있습니다.


디자인 타입 :  숫자 현황판

As-is
To-be

숫자 현황판

노출되어야 하는 지표 : 

등록된 프로젝트 개수, 프로젝트 등록금액, 개발회사 & 프리랜서 수


추가로 노출되는 것을 검토해봐야 하는 지표 : 

- 국내 1위 아웃소싱 플랫폼 → 타이틀로 노출

- 클라이언트의  → C-3에서 컨텍스트에 맞춰 어필할 예정

클라이언트, 파트너들의 평균 평점 → C-2에서 컨텍스트에 맞춰 어필할 예정

모집 중인 프로젝트 개수, 계약수와 계약 금액  → 등록된 프로젝트 개수나 프로젝트 등록금액을 노출하는 것이 더 규모를 어필하기 쉽고 프로젝트 개수나 프로젝트 금액에 있어서는 여러 지표를 노출하는 것보다 임팩트 있는 지표를 노출하는 것이 더 나을 것이라 판단 

- 발생한 지원 → 계약하기 어려운 곳으로 느껴질 수 있어서 제외



후보 1. 세로 스크롤 타입

기존 As-is의 디자인은 3열로 구성되어 있어서 숫자를 읽으려면 시선이 분산된다는 단점이 있었습니다. 

이 단점을 보완하기 위해 세로 스크롤 타입을 디자인해보았는데요, 

세로 타입으로 디자인이 되면 시원시원해 보이긴 하지만 단순히 메스를 알려주기에는 너무 많은 영역을 차지해서 랜딩페이지가 과하게 늘어진다는 부담이 있었기 때문에 결론적으로는 3열 타입을 유지하는 것으로 정했습니다. 


후보 2. 3열 타입

이번 숫자 현황판은 기존의 3열 타입에서 메스가 더 와 닿을 수 있게 변경되었는데요, 

타이틀 텍스트가 먼저 노출되어 '[등록된 프로젝트]-> [N개]'의 흐름을 가지고 있던 부분을 

[N개]라는 숫자가 먼저 눈에 띄게 해서 서비스의 메스가 좀 더 강조될 수 있도록 '[N개]의 [등록된 프로젝트]'로 변경해 숫자가 먼저 눈에 들어올 수 있도록 디자인했습니다.


프로젝트 등록금액 숫자의 경우도 단위가 너무 커서 얼마인지 세기 어려운 부분이 있었는데 숫자를 절삭하고 단위를 붙여줘서 얼마인지 바로 알 수 있도록 변경했습니다.


'국내 1위 아웃소싱 플랫폼'의 경우, 텍스트 형식으로 들어가게 되면 현황판의 뷰가 너무 텍스트로 빼곡해져서 이미지로 제작했고, 월계수의 이미지 메타포를 사용해 국내 1위라는 것을 더욱 강조해주고자 했습니다.



A파트 완성




B. 그 00은 구체적으로 이런 것들이고, 일을 맡겨주시면 이렇게 일이 진행됩니다. 


B-1. 의뢰(수주)하고 싶은 일들이 우리에겐 있습니다. 위시켓은 구체적으로 이런 일들을 취급합니다. 


디자인 타입 : 1. 섹션 제목 + 2. 카테고리 탭 + 3. 등록된 프로젝트 카드 + 4. 회원가입 CTA

As-is
To-be

1. 섹션 제목

기존에 '등록된 프로젝트'로 딱딱하게 표현되던 텍스트를 수정해서 <1. 클라이언트님이 의뢰(수주)하려는 비슷한 프로젝트가 있습니다. → 2. 위시켓에서 비슷한 프로젝트를 처리한 경험이 있으니 걱정 말고 등록하세요. → 3. 등록하면 유사 경험이 있어서 프로젝트를 잘 완수해줄 전문가를 만날 수 있습니다.>의 플로우를 가진 문장을 통해 유저의 니즈를 건드려 심리적 거리를 좀 더 좁히려고 했습니다.


- 1. 클라이언트님이 의뢰(수주)하려는 비슷한 프로젝트가 있습니다. / 2. 위시켓에서 비슷한 프로젝트를 처리한 경험이 있으니 걱정 말고 등록하세요.  

본인이 의뢰(수주)하고 싶은 일을 사이트에서 확인한다면, 유저가 강하게 후킹 될 것으로 예상되어서 카테고리 탭을 노출해 카테고리 별 등록된 프로젝트 볼 수 있게 해주려 했습니다.


- 3. 등록하면 유사 경험이 있어서 프로젝트를 잘 완수해줄 전문가를 만날 수 있습니다. : 

카테고리를 통해 1차적으로 클라이언트의 니즈를 건드리고 2차 니즈인 프로젝트를 구현해 줄 사람을 만날 수 있음을 문장에서 어필해서, 유저가 가지고 있는 두 가지 문제가 동시에 해결되는 플랫폼이라는 인지를 주고자 했습니다.


"다양한 카테고리의 IT 프로젝트를 등록하고 전문가를 만나보세요."



2. 카테고리 탭

기존 랜딩 페이지에는 등록된 프로젝트들이 노출되는 구역이 있었는데요, 

카테고리별로 소팅이 되어있지 않아서 앱이나 웹같이 특정 카테고리의 일을 의뢰하고 싶은 니즈를 가진 클라이언트는 내가 의뢰하려는 프로젝트와 비슷한 프로젝트가 등록되어있는지 랜딩페이지에서 알기 어려웠습니다.

해당 문제를 해결해 주기 위해 사이트를 운영하면서 얻은 데이터를 이용해 많이 제출된 프로젝트 카테고리를 노출해 주었습니다.


카테고리 메뉴 정하기 : 

앱 개발 / 웹 개발 / 소프트웨어 개발 / 웹 디자인 / 커머스, 쇼핑몰 개발 / 기타 개발 / 애플리케이션 디자인 / 퍼블리싱 개발 →  해당 8개 카테고리는 위시켓에서 81%를 차지하는 프로젝트의 카테고리입니다. 

해당 카테고리를 탭 형식으로 노출함으로써 특정 카테고리의 프로젝트를 의뢰하려는 클라이언트들에게 유사한 프로젝트가 등록된 적이 있으니 걱정 말고 프로젝트를 등록해도 된다는 것을 어필하고자 했습니다.



3. 등록된 프로젝트 카드 

위시켓은 서비스를 확장해 재택 프로젝트 외에 상주 프로젝트들도 거래하고 있는데요, 최근 상주 프로젝트의 등록이 급증함에 따라 상주 프로젝트에 대한 표시를 해주기로 하였습니다.


등록된 프로젝트 카드에 담길 항목 :프로젝트 제목 / 금액 / 기간 / 지원자 수 / 프로젝트 내용 / 상주 / 관련 기술



4. 회원가입 CTA

위시켓은 일을 의뢰하려는 클라이언트와, 일을 수주하고자 하는 파트너 모두가 사용하는 플랫폼입니다. 

그럼에도 불구하고 랜딩페이지가 클라이언트에 가깝게 설계된 이유는 좋은 프로젝트가 많이 계약되는 것이 플랫폼의 유지의 핵심이라 생각하기 때문입니다. 

좋은 프로젝트가 많아야 파트너 수가 늘어나는 선순환 구조가 가능하고, 그 선순환이 지속되는 플랫폼이 이상적이라고 생각하기 때문에 클라이언트의 좋은 프로젝트를 많이 수주하는 것에 초점이 맞추어져 있습니다.


사이트를 이용하고 있는 파트너라면, 본인이 하고 싶은 좋은 프로젝트를 발견한 다음 바로 파트너로 회원 가입할 수 있도록 이 흐름에서 회원가입 CTA를 추가해 주었습니다.




B-2. 한번 써볼 생각이 들었다면 어떻게 쓰는지 궁금하시죠?/ 위시켓에선 이렇게 일이 진행됩니다. 
우리는 모든 프로세스에 장점이 있어서 아웃소싱을 하고 싶다면 결국 쓸 수밖에 없으실 겁니다. 


디자인 타입 : 1. 프로세스 타이틀 + 2. 프로세스 콘텐츠

As-is
To-be

1. 프로세스 콘텐츠

가장 먼저 핵심 프로세스를 정합니다. 프로세스의 개수는 너무 많아 보이지 않게 숫자를 5개로 제한했습니다. 

5개의 프로세스의 기준은 프로젝트 상태가 변경되거나 위시켓 내에서 담당 매니저가 변경되는 기준으로 나누었습니다. 


1. 프로젝트 등록 및 상담 → 2. 지원자 모집 및 선택 → 3. 프로젝트 미팅 → 4. 프로젝트 계약 →  5. 프로젝트 진행 및 완료


여기까지 프로세스 항목을 짜고 나니, 한 가지 큰 고민이 생겼습니다.

전체적인 랜딩페이지 구성에서 프로세스 영역 다음이 장점 영역인데요, 이 두 부분의 비율을 조정하는 것이 이슈였습니다.


- 1. 프로세스에 장점을 녹여서 프로세스 영역이 길게 풀어지고, 장점 영역이 단순해지는 것 

- 2. 프로세스를 단순화시키고, 장점 영역을 길게 푸는 것 

두 가지 방식 중 어떤 것이 진짜 나을까요? 고민을 해결하기 위해 기준을 정해보았습니다.


1. 유저들은 어떤 것을 원할까? 

프로세스에 장점을 녹여 프로세스 영역이 강화되고 장점이 단순해지는 1번 방식을 택할 경우, 

프로세스가 길고 복잡하다고 생각하는 유저들이 늘어날 것 같았습니다. 

하지만 프로세스에 대한 유저 문의가 줄어들고 프로세스에 대한 상상이 더 잘 될 것으로 예상했습니다. 

상상이 가능하고, 유저들이 정말 좋다고 생각하게 되면 수박 겉핥기 식의 랜딩페이지를 벗어나 조금 더 유저 맘에 다가갈 수 있겠지요. 


프로세스를 단순화하고 장점을 길게 푸는 2번 방식을 택할 경우, 

프로세스 부분이 짧다 보니 위시켓이 사용하기에 간편하다고 느낄 수 있는 유저가 많을 것 같았습니다. 

하지만 대충 이렇겠구나~ 감만 올 거고, 디테일한 상상은 불가능할 거라 생각했습니다. 

그리고 정말 간편한 지에 대한 의문이 들었습니다. 


위시켓은 간편하지는 않습니다. 우리는 큰돈과 프로젝트를 다루기 때문에 철저해야 하고, 잘 쓰기 위해 당연한 노력을 해야 합니다. 간편할 것을 예상하고 사용한다면 아무래도 뒤에 가서 생각보다 많은 인풋이 들어가는 것을 경험한 유저들에게 오히려 불편함을 줄 것 같았습니다.


2. 유저들에게 우리가 말하고자 하는 바가 제대로 전달되는가? 

장점 영역을 설계한다면, 우리의 장점은 주로 추가적인 어떤 것을 제공해주는 것이 아닌 기존의 문제를 해결해 주는 데에 포인트가 있다고 생각했습니다. 

그렇기에 장점을 '따로 디테일하게 설명해주는 것(추가적인 어떤 것 제공)'과 장점을 '불편함과 붙여 좀 더 와 닿게 설명해 주는 것(기존의 문제를 해결)' 사이에서 장점을 불편함과 붙여 좀 더 와 닿게 설명해 주는 것이 더 중요하다고 생각했습니다. 


프로세스에 장점을 녹여 프로세스 영역이 강화되고 장점이 단순해지는 1번 방식을 선택할 경우, 

장점의 설명을 줄이게 된다면 위시켓이 가진 장점들이 적어 보일 수 있을 것 같다는 생각을 했습니다. 

그렇지만 기존에 어떤 문제를 해결해주는 것에서 장점이 발생한다면, 프로세스를 통해 해당 단계에서 유저들이 겪는 불편함을 언급해주고 해소가 된다는 것을 하나씩 차근차근 말해주는 것이 따로 빼서 장점을 길게 설명하는 것보다 마인드맵핑이 잘될 것이라 생각했습니다. 


프로세스를 단순화하고 장점을 길게 푸는 2번 방식을 택할 경우, 

유저들에게는 장점이 많은 서비스로 보일 수 있을 것 같다는 생각을 했습니다. 

그렇지만 따로 장점을 길게 빼는 것은 유저들이 많은 장점을 한꺼번에 기억하지 못할뿐더러, 좋은 것들의 나열일 뿐이라고 느껴질 수도 있을 것 같아서 프로세스에 기반한 장점은 프로세스에 녹이고 그 외 장점들만 따로 추가적으로 어필하는 구조가 더 나을 것이라고 생각했습니다.


3. 그럼에도 불구하고, 복잡해 보이게 꼭 프로세스를 길게 가져가야 할까? 

프로세스가 길어지면 유저들이 위시켓 사용이 복잡하다고 느낄 수 있는 리스크는 있습니다. 

그래서, 불편함을 해소해 준다는 방식으로 프로세스를 어필하고, 너무 많은 영역을 차지한다면 가로 스크롤이나 디자인적으로 여러 배치를 시도해보는 등 UI를 통해 푸는 것이 좋겠다고 생각했습니다.



프로세스에 장점을 같이 녹이기로 했다면, 프로세스 항목 별 어필 포인트(유저 니즈) 정하기 

프로세스는 어필 포인트를 잘 설계해야 하는 항목 중 하나입니다.

프로세스라고 해서 절차만을 설명해주면 콘텐츠의 집중도가 떨어지고 자칫하면 서비스 이용이 복잡해 보일 수 있습니다.

또한 "나중에 쓰면서 알게 되겠지"하는 반응은 실제적으로 서비스를 운영할 때 일일이 안내가 나가야 해서 내부 리소스를 증가시키는 원인이 됩니다.


이런 상황들 때문에 프로세스를 설계할 때는 잠재 유저의 집중도를 이끌어 내고 사전에 미리 프로세스를 인지시키는 것이 중요한데요,

이런 문제를 해결하기 위한 한 가지 방법으로, 각 프로세스마다 클라이언트가 가지고 있는 문제점이나 니즈를 제일 먼저 얘기해준다면('~가 불편하셨나요? ~해보세요'로 클라이언트에게 말 걸기) 콘텐츠의 집중도가 높아질 거라 생각했습니다.  


유저 니즈를 건드리기 위해 타이틀 문장을 의문문 혹은 권유형 톤으로 구성하고, 위시켓이 어떻게 해결해 주고 있는지를 말해줄 수 있는 문장의 흐름을 유지하도록 합니다. 


추가적으로, 데이터가 있는 부분은 문장에 데이터를 제시해 신뢰도를 높이도록 하겠습니다.


<유저 니즈 건드리기 : '유저님, ~가 불편하셨나요?' 혹은 '유저님,~해보세요' → 위시켓이 해결해 줍니다 : 우리는 이런 게 있어서 불편함을 해소해드립니다.>


프로세스 1. 프로젝트 등록 및 상담 

- 유저 니즈 건드리기 :

프로젝트 예산 작성과 내용 작성이 어려움 → 프로젝트에 딱 맞는 맞춤 상담을 받아보세요.

- 플로우에서 제공하는 장점 : 

프로젝트를 등록해 주시면 견적 상담과 내용 작성을 도와드립니다.

1. 위시켓에서는 위시켓 매니저가 요구사항 구체화를 도와드리고, 그에 맞는 적정 견적을 안내합니다.

2. 개발자와 디자이너가 이해할 수 있는 용어로 프로젝트 내용을 수정해드립니다.

데이터 : 28,000여 건을 상담한 경험

프로세스 2.  지원자 모집 및 선택

- 유저 니즈 건드리기 : 

마음에 드는 작업자를 만나기 어려움 → 마음에 드는 믿을만한 파트너를 만나보세요.  

- 플로우에서 제공하는 장점 : 

유사 프로젝트를 진행한 경험이 있는 파트너에게 프로젝트 분석 및 제안을 받아볼 수 있습니다.

1. 위시켓에서는 지원자가 빠르게 발생합니다.

2. 지원자들의 견적, 포트폴리오, 클라이언트 평가를 한눈에 비교할 수 있습니다.

데이터 : 24시간 내에 평균 5.2명의 지원자가 발생

프로세스 3. 프로젝트 미팅

- 유저 니즈 건드리기 : 

파트너들을 만나봐도 개발 쪽 전문성이 없어 적합한 파트너 선정이 어려움 → 프로젝트에 적합한 파트너 선정이 어려우셨나요?

- 플로우에서 제공하는 장점 : 

위시켓 매니저와 함께 미팅을 진행하면서 파트너를 검증할 수 있습니다.

1. 업무범위, 계약 조건, 견적 및 일정을 협의한 후 안전하게 계약하실 수 있습니다.

2. 담당 매니저가 배정되어 성공적으로 파트너와 계약할 수 있도록 상담해 드립니다.

프로세스 4. 프로젝트 계약

- 유저 니즈 건드리기 : 

계약 과정이 복잡하고 번거롭고 어려움 → 계약 과정이 복잡하고 번거로우셨나요?

- 플로우에서 제공하는 장점 : 

아웃소싱에 특화된 계약 시스템을 이용해 보세요.

1. 법무법인의 검토를 받은 신뢰할 수 있는 표준계약서를 사용해 공정한 계약 체결을 도와드립니다.

2. 계약서 검토, 날인 등 모든 계약과정을 위시켓 플랫폼 내에서 진행할 수 있어서 계약 이력을 보호받을 수 있습니다.

프로세스 5. 프로젝트 진행 및 완료

- 유저 니즈 건드리기 : 

프로젝트에 대한 돈을 떼이거나 금액이 보호받지 못할 것이라는 불안감이 있음 → 위시켓의 안전한 대금 보호 시스템을 사용해보세요.

- 플로우에서 제공하는 장점 : 

혹시 모를 분쟁도 안심 중재 솔루션 3단계를 통해 원만하게 해결할 수 있습니다.

1. 에스크로 방식의 대금 보호 시스템을 통해 대금 걱정 없이 프로젝트에만 집중하실 수 있습니다.

2. 커뮤니케이션 매니저가 수시로 프로젝트 진행상황을 체크하고 효율적인 커뮤니케이션을 도와드립니다.



2. 프로세스 타이틀

프로세스를 짰으면 '위시켓 프로세스'를 대체할 전체 타이틀이 필요합니다. 

결국 프로세스를 통해 말하고자 하는 건 '우리는 000한 프로세스를 가지고 있으니 써보라.'일 것입니다. 

속마음을 좀 더 드러내면서 후킹 해보도록 하겠습니다. 

000한 프로세스를 정의한다면, 위시켓에서 주고 싶은 서비스의 핵심가치인 '빠르고 편리하고 안전한'이 될 것입니다. 

타이틀 문장의 톤은 이 위의 타이틀인 <다양한 카테고리의 IT 프로젝트를 등록하고 전문가를 만나보세요>와 맞춰 권유형으로 변경합니다. 

이 텍스트가 권유형으로 바뀐다면 타이틀의 톤 앤 매너가 통일되는 것뿐 아니라, 유저 니즈를 건드리며 다가가는 텍스트와도 결이 잘 맞을 것 같았습니다.


"위시켓의 빠르고 편리하고 안전한 프로세스를 경험해 보세요."



타이틀과 콘텐츠가 정해져서 이제 디자인에 들어갔는데요, 해당 부분은 최종적으로 두 가지 시안을 놓고 고민했습니다.


후보 1. 세로로 스크롤이 가능해 프로세스를 넘겨 볼 수 있는 프로세스 바 디자인. 

시선의 흐름이 세로이다 보니 프로세스에 대한 순차적 인식이 가능하다는 것이 가장 큰 장점이지만, 

해당 디자인은 텍스트 메뉴가 아닌 숫자로 프로세스의 인덱스가 이뤄지기 때문에 전체 프로세스를 미리 간략히 훑어보기 어렵고 유저가 정교하게 컨트롤이 어려운 문제 (4번 프로세스까지 읽고 다시 2번 프로세스로 돌아가려면 3번 프로세스를 거치고 돌아가야 함)가 있었습니다.

해당 프로세스 바 디자인은 주로 콘텐츠의 순서가 덜 중요하고(1->2->3의 구조가 아닌 1,2,3의 구조) 이미지가 주가 되는 항목에 어울릴 것으로 생각되어 다른 디자인이 선택되었습니다.



후보 2. 가로로 스크롤이 가능해 프로세스를 넘겨 볼 수 있는 프로세스 바 디자인. 

해당 디자인은 타이틀 구분자가 존재해 전체 프로세스를 훑어볼 수 있고, 메뉴바가 존재해 유저가 원하는 데로 컨트롤이 가능하다는 장점이 있었습니다.

또한 다음 프로세스를 오퍼시티를 통해 노출함으로써 뒤에 프로세스가 더 있다는 인지가 가능하기 때문에서 해당 안으로 디자인을 진행하기로 했습니다.



B파트 완성




C. 위시켓은 이렇게 좋고, 실제로 사용해 본 사람들도 좋다고 말합니다. 우리는 정말 좋은 플랫폼입니다. 


C-1. 위시켓을 사용하면 이렇게 좋습니다. / 위시켓은 기존 아웃소싱 시장의 문제를 해결해 줍니다.


디자인 타입 : 1. 장점 타이틀 + 2. 장점 콘텐츠

As-is
To-be


1. 장점 타이틀

장점 항목 정하기

위시켓의 어떤 장점을 실어야 사람들이 위시켓 서비스가 좋다고 느낄까요? 

기존 장점 3가지는 유지하면서 계약 단계의 새로운 장점 3가지를 추가해 보았습니다. 


+. 신뢰와 안전에 있는 위시켓 안심계약 

+. 신뢰와 안전에 있는 위시켓 표준계약서 

+. 신뢰와 안전에 있는 프로젝트별 담당 매니저 배정


해당 항목을 구성하며 가장 고민했던 부분은 장점을 추가적으로 설명해주는 서브 텍스트가 필요한가? 였습니다.


서브 텍스트는 왜 필요할까요?

대표 텍스트 한 줄로 모든 것이 설명 가능하면 좋겠지만, 서브 텍스트를 사용하는 것에는 이유가 있습니다.


1. 느낌적으로 좀 더 다가올 수 있도록 예시를 들어준다던가(A-1. IT 프로젝트 = 즉, 애플리케이션 개발, 웹 개발, 소프트웨어 개발, 웹 디자인, 커머스, 쇼핑몰 개발 등)  

2. 대표 텍스트를 설명하는데 두 개 이상의 문장이 필요할 때(B-2. 위시켓에서는 28,000여 건을 상담한 경험을 가진 위시켓 매니저가 요구사항 구체화를 도와드리고, 그에 맞는 적정 견적을 안내합니다.)

설명의 해상도를 높여주는 장치로서 서브텍스트가 사용됩니다.


이 두 가지 기준을 두고 보았을 때,  

장점에 예시가 필요할까? 에서 장점이라면 직관적으로 바로 꽂혀야 하기 때문에 굳이 예시를 들어줄 필요가 없다고 보았습니다. 또한 느낌적으로 좀 더 다가올 수 있도록 프로세스에도 장점이 녹아들어 있기 때문에 여기서도 예시들을 노출해주는 건 랜딩이 투머치 해진다고 보았습니다. 

두 개 이상의 문장이 필요한가? 에서는 장점은 큰 한 가지를 엄청 크게 와 닿게 구성하는 것이기 때문에 장점에서 두 가지 갈래가 뻗어 나올 필요는 없다고 보았습니다. 

만약 장점이 '안전한 계약 시스템'이고 그 서브 장점으로 '위시켓 안심계약'과 '위시켓 표준계약서'가 나온다면 해당 장치가 필요하겠지만 지금 장점의 구성은 큰 장점을 쪼개서 나열하는 게 아니라 하나의 장점을 크게, 잘 와 닿게 설명하는 구조로, 장점의 대표 텍스트가 잘 뽑힌다면 서브텍스트가 필요 없을 것으로 보았습니다.


그렇다면 어떻게 해야 장점의 대표 텍스트를 잘 뽑을 수 있을까요?

장점이 잘 보이기 위해서는 우리가 제공해주는 가치가 제대로 드러나야 하고, 그 장점을 담고 있는 시스템 명이 제대로 잘 보여야 하는 것이 잘 뽑힌 대표 텍스트라 생각했습니다.


1. 가치 : 빠르고, 편리하게, 무료로 / 시스템 명 : 프로젝트 등록 

2. 가지 :  실력 있는 지원자를 한눈에 비교 및 선택 

3. 가치 : 안전, 간편 / 시스템 명 : 대금 보호, 계약 시스템

4. 가치 : 보호 / 시스템 명 : 위시켓 안심 계약

5. 가치 : 신뢰 / 시스템 명 : 표준계약서

6. 가치 : 시작부터 끝까지 / 시스템 명 : 담당 매니저



2. 장점 콘텐츠

장점 항목을 짰으면 '빠르고 안전한 위시켓'을 대체할 전체 타이틀이 필요합니다. 

현재 있는 서비스의 기존 철학인 '빠르고 안전한 위시켓'이 장점을 잘 말해주는 것 같아 그대로 유지하도록 하고, 문장의 톤만 명사형이 아닌 설명형으로 변경해 주었습니다.   


"위시켓은 빠르고 편리하고 안전합니다"




C-2. 단지 우리가 말하는 장점이 아니라 진짜 위시켓을 써본 사람들도 좋았다고 했습니다.


디자인 타입 : 1. 장점 타이틀 + 2. 장점 콘텐츠 + 3. 이용후기 링크

As-is
To-be


1. 장점 콘텐츠

이 부분은 실제로 위시켓을 사용해본 사람들의 인터뷰에서 위시켓의 장점이 골고루 드러날 수 있도록 텍스트를 발췌해 사용했습니다.


1. 파트너스 프로필의 실제 프로젝트 기록 덕분에 좋은 작업자를 만날 수 있었다.

2. 하루 만에 8명의 지원자가 발생해서 빠르게 프로젝트를 완료할 수 있었습니다.

3. 견적과 일정을 상담해주고 프로젝트 범위 정리를 도와주어 편리하게 계약을 체결했다.

4. 위시켓 덕분에 비즈니스의 핵심에 집중할 수 있었습니다. 스타트업에게 최고의 서비스.


2. 이용후기 링크

클라이언트의 인터뷰가 4명만 나와있고 그게 마치 인터뷰 한 사람들만 만족한 것처럼 보일 수 있기 때문에, 이용후기에 있는 클라이언트 평균 만족도를 추가해서 위시켓을 사용해본 전체 클라이언트가 얼마나 만족했는지 객관적 수치로 좀 더 와 닿게 해 주었습니다. 

뿐만 아니라, 여기까지 긍정적인 인식이 쌓였다면 긍정적인 인식의 굳히기를 하기 위해 이용후기로 바로 갈 수 있는 링크를 넣어줍니다. (반신반의하던 사람도 이용후기를 보고 더 확신을 얻을 수 있도록) 


추가적으로 이용후기의 링크를 눌러 들어간 이용후기 메뉴의 첫 페이지에서도 빠르고, 안전하고, 믿을 수 있다는 내용의 콘텐츠가 있기 때문에 이용후기 링크를 통해 위시켓은 정말 빠르고 편리하고 안전하다는 더 브랜드 인식을 한번 더 강화시킬 수 있습니다.


3. 장점 타이틀

어필할 항목은 여기서도 빠르고 편리하고 안전한 위시켓입니다. 

한 번 보고 모르고 두 번 보고 알고 세 번 보고 각인되도록 여기서도 또 '빠르고 편리하고 안전한'을 얘기해줍니다.

결국 '유저들이 말하는 위시켓'을 통해 말하고자 하는 건 '우리는 빠르고 편리하고 안전한 서비스이다.'일 것입니다. 그래서 여기서도 지독하고 일관성 있고 집착적으로 빠르고 편리하고 안전한을 넣어줍니다. 

우리가 빠르고 편리하고 안전하다고 말하는데 유저들도 그렇게 말하더라, 위시켓은 정말 빠르고 편리하고 안전하다.


"위시켓은 정말 빠르고 편리하고 안전합니다."




C-3. 이런 똑똑하고 잘 나가는 좋은 회사들도 위시켓이랑 일했습니다. 
그런 회사들이 위시켓을 선택한 걸 보면 위시켓은 좋은 플랫폼입니다.


디자인 타입 : 1. 고객사 타이틀 + 2. 고객사 로고 + 3. 프로젝트 등록 CTA

As-is
To-be

1. 고객사 로고

As-is에서는 많은 클라이언트가 위시켓을 쓰고 있다는 걸 강조하고 싶어서 로고를 있는 데로 많이 나열하고 있습니다. 이런 비효율적인 방식을 벗어나, 메스를 더 강조하기 위해 직접적으로 클라이언트 수를 타이틀에 노출해주고 클라이언트는 로고는 한 페이지에 3~5줄로만 강조한 뒤 나머지 클라이언트는 자동 스크롤 방식으로 hide and show로 보여주도록 합니다.


자동 스크롤 방식은 시간이 되면 알아서 옆 페이지로 스크롤되기 때문에 랜딩페이지가 좀 더 동적여 보이는 효과가 있습니다. 또한 고객사 로고 부분은 대부분 대충 훑어보는 영역이기 때문에 스틸 이미지로 처리할 경우 시선이 잘 안 간다는 문제점이 있었는데 동적 애니메이션을 넣어줌으로써 자동으로 시선을 움직여줘서 고객사 로고를 조금 더 잘 확인할 수 있습니다.



2. 고객사 타이틀

단순히 클라이언트 개수만 나열하면 아쉬우니 양념을 좀 쳐봅시다. '다들 쓰고 있는데 아직 안 써보셨나요?'의 뉘앙스를 강조해 주기 위해 '이미'를 넣고, 진행형으로 우리를 사용하고 있다는 걸 강조해 줍니다.   


"이미 49,083개의 클라이언트가 이용하고 있습니다."



3. 프로젝트 등록 CTA

맨 마지막 항목에서는 근본적인 목적, 프로젝트 등록하기를 다시 넣어줍니다.



C. 파트 완성






전체 랜딩페이지는 www.wishket.com와 Landing page_Online outsourcing platform, Wishket에서 보실 수 있습니다. 


이 기나긴 프로젝트를 함께해주고, 항상 제 의사결정을 지지해주는 디자인 팀에게 보낼 수 있는 모든 감사를 보내며 긴 글을 마칩니다 �



작가의 이전글 웹 페이지를 디자인할 때, 자주 하는 실수

작품 선택

키워드 선택 0 / 3 0

댓글여부

afliean
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari