흥미를 유발하는 상세페이지 디자인 팁 및 과대광고 규제
상세페이지 디자인에도 흐름이 존재한다
일반 vs 와디즈 상세페이지 디자인의 차이
비티와이플러스는 일반 상세페이지와 와디즈 상세페이지 제작을 진행하고 있습니다. 어떤 디바이스로 콘텐츠를 보느냐에 따라 다르지만 가로폭 기준 일반 상세페이지는 860~1000xp, 와디즈 상세페이지는 1300px로 만드는 것이 디폴트입니다.
일반과 와디즈의 차이는 크게 상세페이지 가로폭으로 인한 레이아웃 배치와 폰트 크기, 기획 자체인데요. 간략하게 말씀드리자면 일반 상세페이지는 제품 특징 위주의 내용을 간략하게 넣는 경우가 많고 와디즈의 경우에는 제품 후킹, 스토리, 브릿지, 특장점 소개 등 스토리가 길게 들어갑니다. 일반 상세페이지와 와디즈 상세페이지의 차이는 비티와이플러스가 작성한 이 글에서 확인 가능합니다.
1. 디자인 가이드 설정으로 흐름의 연속성 부여하기
와디즈 상세페이지를 작업할 때에는 워딩과 이미지의 단락 구분이 가장 중요합니다. 이를 위해 점, 선, 면, 박스 구조를 적극적으로 활용하며 헤드, 본문, 이미지 순서로 진행해 디자인 흐름의 연속성을 부여합니다.
디자인 작업할 때 가장 먼저 진행하는 일은 파트너와 제품의 특색을 파악하는 것입니다. 촬영컷의 톤앤매너를 가장 먼저 확인하고 전체적인 통일감을 내기 위해 같은 무드의 톤을 3가지 정도 지정합니다. 그리고 블랙, 화이트를 포함해 총 5가지의 컬러셋을 지정합니다.
컬러셋을 지정한 후에는 여백을 어느 정도 설정할 것인지, 제품 무드와 맞는 폰트 스타일과 크기는 어떻게 할 것인지, 좌측/우측/가운데 정렬 중 어느 쪽이 좋을지 고민한 후 작업에 들어가는 것이 좋습니다.
2. 한눈에 들어오는 소구점 표현
전체적인 흐름이 도출됐으면 후킹과 브릿지 그리고 메인 비주얼 순으로 디자인 제작을 하는 것이 유리합니다. 상세페이지 특성상 스토리 초입에서 소비자들의 흥미를 유발해야 하기 때문에 제품을 강조하여 보여줄 수 있는 여러 gif 효과 및 3D 효과를 도입부에서부터 스토리전까지, 집중적으로 넣어줍니다.
3. 무시할 수 없는 아이콘 디자인
비티와이플러스가 상세페이지 디자인을 하면서 신경 쓰는 부분 중 하나는 바로 아이콘 디자인입니다. 제품이 가진 특징을 보여주기 위하여 아이콘을 사용하는 경우가 많은데, 아이콘의 스타일이 다르거나 라인의 굵기가 다르면 상세페이지의 퀄리티가 떨어질 수 있으므로 아이콘도 톤앤매너를 맞춰 가공합니다.
4. 유료 이미지 활용하기, 단 자연스럽게
비티와이플러스에서는 이미지를 자체적으로 촬영 및 가공해 디자인에 활용합니다. 디자인 단계에서는 사진의 톤과 레이아웃을 고려하여 작업하며, 이미지의 크기, 배열, 여백 등 다양한 요소를 생각해 상황에 맞는 이미지를 만듭니다. 사진으로 표현할 수 없는 상황 연출이나 그래픽 효과는 유료 이미지나 일러스트레이터를 활용하여 그에 맞는 이미지를 만듭니다.
5. 알아보기 쉬운 제품 구성 또는 와디즈 리워드 제작
일반 상세페이지에는 제품 구성이 들어가는 반면에 와디즈 상세페이지는 리워드가 함께 들어갑니다. 구성이 복잡하기 때문에 제품을 얼마나 깔끔하고, 소비자가 파악하기 쉽게 만드는지가 중요합니다. 이때 디자인 레이아웃과 문구의 정렬을 신경 써서 작업해야 소비자가 정보를 쉽게 받아들일 수 있습니다.
비티와이플러스 디자인 사례
지금까지 비티와이플러스가 제작한 상세페이지 디자인 중 위에서 언급한 팁들의 본보기가 될 수 있는 프로젝트 일부를 소개합니다.
곤라면
곤라면의 경우 제품의 컬러와 파트너의 요청사항 중 하나였던 팝한 느낌의 디자인을 함께 살리고자 했습니다. 제품 패키지가 지닌 톤앤무드가 비비드한데 촬영도 그에 맞춰야 했기 때문에 강렬함을 최대한 중화시키며 작업했습니다. 사진부터 디자인까지 파트너가 매우 만족했었고 프로젝트도 매우 성공적으로 마쳤습니다.
슬립스테이지
슬립스테이지는 수면에 포커싱 된 제품 중에서도 특히 디자인이 잘 나온 프로젝트입니다. ‘수면’과 ‘기술’이 접목된 카테고리 특성상 다른 콘텐츠에 비해 양이 방대했습니다. 소비자들이 상세페이지를 읽으면서 지루함을 느끼지 않도록 gif, 아이콘 등에 더욱 신경 써서 작업했습니다.
누하스 오피스 체어
해당 프로젝트는 다소 급한 일정으로 진행돼 우려가 많았습니다. 스튜디오의 톤과 제품의 컬러가 잘 매치되어 제품의 사용감은 물론 편안함까지 표현할 수 있었는데요. 특히 파트너께서 옐로우의 색상이 상세페이지 디자인에 잘 나오길 바라셨기 때문에 컬러감을 표현하는데 더욱 많은 시간을 투자했습니다.
플레이모빌 세종대왕 피규어
야상 자켓
촬영 당일은 한여름이었습니다. 가을을 대비하는 야상 촬영이 쉽지만은 않았지만 그럼에도 불구하고 가을인 듯 무드가 잘 나타나서 모두가 놀라기도 했죠. 디자인 작업 전, 기획자 역시 고민을 안 할 수 없는 부분이 레이아웃인데요. 디자이너와 처음 이야기를 나누자마자 촬영 컷을 잘 살리자고 결론을 내렸습니다. 아무래도 ‘패션’ 카테고리이다 보니 화보가 페이지의 많은 부분을 차지할 텐데 글에 이미지가 가려져 버리면 아무 소용이 없기 때문입니다. 이렇게 ‘야상’하면 떠오르는 카키 컬러를 중심으로 제품을 잘 보여주는 이미지가 절반인 상세페이지가 탄생했습니다. 비주얼은 물론이고 제품의 핵심 포인트들이 간결하게 눈으로 잘 드러난 프로젝트입니다.
과대광고 제재, 단어가 바뀌면 디자인도 바뀐다
아무리 디자인 능력이 좋아도 이를 마음껏 펼치지 못하는 경우가 있습니다. 바로 허위 및 과대광고 때문입니다. ‘상세페이지에 법률이라니?’ 싶으실 수 있습니다. 하지만 상세페이지는 생각보다 많은 위법이 발생하는 곳입니다. 다이어트 식품을 먹고 갑자기 다른 사람이 되었다던가, 의약품은 아니지만 먹고 고질병이 사라졌다던가, 피부가 180도 바뀌었다던가 하는 수준의 상세페이지 광고들이 많이 보이고 있습니다. 이는 과대광고를 넘어 범죄로 다가오기도 합니다.
법적 제재로 인한 디자인의 한계
이미지 과장이나 허위 광고를 피하기 위해 상세페이지 디자인을 작업 하다 보면 가능 범위가 제한되기도 합니다. 식약처나 공정거래위원회 등에서 시행되는 지정고시를 보면 정말 많은 조항들이 있는데요. 특히 건기식이나 뷰티 제품들은 지켜야 할 것들이 훨씬 많습니다. 비티와이플러스가 진행한 프로젝트 중 일부를 예시로 보여드리겠습니다.
효능에 대해 말하지 못하는 뷰티 상세페이지
뷰티의 경우 표현의 제약이 상당히 많습니다. 예를 들어 ‘침투’, ‘흡수’라는 단어에도 굉장히 민감합니다. 제품이 직접적인 효과를 준다는 뉘앙스의 표현이 엄격하게 제한되고 제품에 들어간 원료의 역할을 곧 제품의 역할이라고 단정조로 표현하기도 매우 어렵죠.
기획자의 표현 방법 역시 직접적이지 못하고 우회적으로 바뀔 수밖에 없습니다. 와디즈의 경우 자체적으로 광고 심의를 먼저 진행하기 때문에 심사에 통과하지 못하면 프로젝트 오픈 소요 기간이 자연스럽게 지연됩니다. 특히나 뷰티 카테고리를 찾는 소비자들은 이미 많은 제품을 경험해보고 만족감을 느끼지 못해 새로운 제품을 찾는 분들이 많은데, 그런 분들을 사로잡기 위해서는 효과를 어필할 만한 강력한 제목이 필요한 것도 현실이죠.
해당 프로젝트는 ‘엑소좀’이라는 줄기세포배양액의 성분을 활용한 제품으로 개념이 어려울뿐더러 직접적인 효과 표현 역시 매우 우려된 제품입니다. 파트너는 제품의 모든 효과를 어필하고 싶어 하셨지만 비티와이플러스는 ‘엑소좀’의 핵심 포인트인 ‘모공보다 1,700배 작은 입자’를 흡수력과 탄력으로 연관 지어 표현하고자 했습니다. 효과를 간접적으로 보여주기 위해 제품 리뷰를 적극 사용하기도 했습니다.
▶ 뷰티 업계 기획 담당자가 페이지를 기획한다면 참고하세요!
개념을 이해시키려고 할 때는 간결하면서도 [이해가 쉽게] 빗대어 설명합니다.
표현의 제약이 생길 때는 이를 대신 할, 한 눈에 설명하기 좋은 [비주얼 자료]가 필요해요.
효과를 입증할 수 있는 [객관적인 자료(임상, 리뷰, 사용 이미지)]가 든든해야 합니다.
숙취해소제를 숙취해소제라 부르지 못하니
해당 프로젝트는 숙취해소 원료가 담긴 숙취해소제입니다. 임상시험으로 숙취 해소 효과가 입증되었음에도 불구하고 와디즈 심사 단계에서 ‘숙취해소제’라는 문구 사용이 제재되었습니다. 의약 용품으로 오인될 수 있는 문구는 모두 삭제해야 했으며 대신 ‘숙취 해소 음료’로 명칭을 바꾸어 심사를 완료 받을 수 있었습니다.
생리 팬티는 팬티일까? 생리대일까?
해당 제품은 생리 기간에 착요할 수 있는 생리대가 탑재된 여성 팬티입니다. 하지만 제품 자체는 생리대 인증을 받은 제품이 아닌 단순 팬티에 해당하기 때문에 ‘생리 팬티’라고 표기할 수 없었습니다. 더불어 특징을 설명할 때에도 생리대로 오인할 수 있는 문구가 모두 반려되어 혼란스럽기도 했는데요. 예를 들어, ‘샐 걱정이 없는 스펀지 같은 흡수력’, ‘생리혈 샐 걱정 NO’, ‘생리 걱정 없는 하루를 위해’ 등의 문장들이 모두 불가 판정을 받았습니다. 그래서 위생 팬티라는 말 대신 ‘생리 친화 팬티’로 표기하고, 생리라는 직접적인 단어 대신 ‘분비물’ 등의 문구로 대체해 통과할 수 있었습니다.
이렇듯 상세페이지에 사용되는 단어들이 바뀌면 디자인도 그에 맞게 수정이 필요합니다. 건강기능식품군이 아니더라도 심사가 까다로운 제품 품목들은 용어에 대한 반려 처리, 제품 기능을 오인할 수 있는 문구에 대한 반려 처리가 상세하게 들어옵니다. 그렇다고 반려된 문구들을 모두 삭제하기에는 콘텐츠의 전체적인 스토리 흐름이 존재하기에 최대한 대체할 수 있는 용어나 문구들을 고민하고 확인한 뒤에 최소한 우회할 수 있는 방법을 찾고자 노력하고 있습니다.
비티와이플러스도 광고 심의를 지키기 위해 언제나 조심하고 조심합니다. 법적 제한으로 인해 디자인에 한계가 발생하기도 하지만 그럼에도 불구하고 비티와이플러스는 차선책을 찾아 언제든 최고의 결과물을 파트너분들에게 전달드리고자 합니다.
비티와이플러스의 ‘상세페이지 제작 과정 및 소요 기간은 어떻게 될까?’ 글을 확인해 주세요.
과대광고에 대해 더 자세히 알고 싶다면, ‘상세페이지 기획 유의점 #2: 상세페이지 과대광고 위법 표현 알고 작성하자’를 확인해 주세요!
