쇼핑몰 상세 페이지 디자인 가이드북

▣ 출판사서평

현직 웹디자이너, 온라인 쇼핑몰 대표이자
G마켓/옥션, 카페24 대표 강사인 저자의 노하우를 집약했다!

오래 불황이 이어지고 있지만 온라인 쇼핑몰 업계에서는 “‘기.승.전.이커머스”라는 말이 대두될 만큼 쇼핑몰(이커머스)시장은 불황을 꺾고 호황기를 맞이하고 있다. 이 호황기에 편승하려면, 온라인 쇼핑몰 상세페이지 디자인에도 마케팅과 컨셉의 마인드를 갖고 접근해야 한다.
카페24의 온라인 쇼핑몰 디자인 부분 대표 강사이자, G마켓/옥션 대표 강사인 저자는 매년 1,000여명 이상의 쇼핑몰 예비사업자와 초기 쇼핑물 사업자를 만나왔다. 15년차의 웹디자이너이자 웹디자인 업체의 대표로 쇼핑몰을 운영하며 얻은 웹디자인 감각과 운영 노하우를 그간 사업을 준비하는 예비 창업자들에게 전하며, 저자가 가장 강조한 것은 “판매자는 디자이너가 아니다. 마케터다!”라는 부분이었다고 한다.
이 책에는 저자가 실전 강의를 통해 쇼핑몰 사업자들과 만나며 얻은 노하우를 토대로 ''매출 3배로 이어진 상세페이지 제작 노하우'', ''상세페이지 디자인을 위판 포토샵 필수 기능'' 등을 담았다. 단순한 예제용 파일 등이 아닌 실제 판매 중인 상품의 디자인 과정을 다시 해보며 상세페이지 디자인을 위한 실전에 돌입할 수 있다. 또한 예제 파일 외에도, 작가가 실제 디자인한 쇼핑몰 상세페이지 템플릿 파일을 담았기에, 쇼핑몰 예비 창업자라면 자신이 실제 판매할 상품 상세페이지로도 활용해 볼 수 있을 것이다.


변화하는 온라인 마켓 시장, 그 트렌드를 더하다.

쇼핑의 패턴이 오프라인에서 온라인, 온라인에서도 PC보다는 모바일 쇼핑의 비중이 높아지며, 쇼핑몰과 쇼핑몰의 상품 상세페이지에서도 디자인 트렌드가 변화하고 있다. PC에서 모바일로 기기가 변화하며 20cm 이내의 시선 안에서 구매 여부가 결정되는 것이다. 즉, 웹페이지에 대한 체류 시간이 줄어들수록 그 페이지에 대한 집중도는 올라가며 이것이 빠른 구매로 이어진다. 이러한 변화에 따라 모바일 쇼핑몰 상세페이지의 디자인은 구매를 결정짓는 ''속도''에 유념해야 한다. 이 책은 상품을 돋보이는 디자인 뿐 아니라 이러한 모바일 쇼핑 트렌드에 맞춰 스크롤의 압박’을 벗어나 간략하지만 필요한 정보만을 담은, 즉 심플하지만 알짜 상세페이지를 제작하는 방법에 대해 알려준다.

이 책의 구성

Part 1 오픈마켓 디자인의 변화에 대처하기
: 오픈마켓 및 모바일마켓 디자인 트렌드에 대해 점검하며, 상세페이지 디자인 작업을 위한 업체 선정 요령 그리고 디자인 작업 시 유의사항들을 상세히 담았습니다.

Part 2 상세페이지를 위한 포토샵 기초 다지기
: 상세페이지 디자인에 필요한 포토샵 기초 기능들을 알려줍니다. 포토샵 초보도 금세 따라올 수 있는 매뉴얼 설명은 물론, 현직 디자이너의 노하우를 담은 디자인을 위한 포토샵 사용 팁 들이 가득합니다.

Part 3 오픈마켓 상세페이지 실전 제작하기
: 실전 오픈마켓 상세페이지 디자인을 위한 전반적인 사항들에 대해 알아봅니다. 카테고리별 상세페이지 디자인은 물론, 실제 오픈마켓 상세페이지로 사용된 단품 및 다중 옵션 상세페이지를 포토샵 따라하기를 통해 차분히 알려줍니다. 또, 옵션이미지, 팝업 이미지, 롤오버 코드 등의 제작 및 활용 방법도 담았습니다.

Part 4 오픈마켓 상세페이지로 노출 점수 높이기
: 오픈마켓은 등록된 제품의 품질지수가 높을수록 상위에 노출되기 쉽습니다. 단순히 보기 좋은 디자인이 아닌 매출을 올릴 수 있는 디자인을 위한 주의사항은 물론 오픈마켓별 품질지수 가이드 및 팝업링크, 메인이미지, 이미지 호스팅 등 오픈마켓 운영 전반에 필요한 주의사항 들을 알려줍니다.

Part 5 소셜커머스 상세페이지 제작가이드
: 인기 소셜커머스 3사의 상세페이지의 공통점 및 영역별 차이점을 둘러보며, 소셜커머스 상세페이지를 만들 때 주의해야 할 점 등을 요점 정리해줍니다.


■ 대상 독자층
√ 인터넷 쇼핑몰 운영을 준비하는 예비사업자
√ 인터넷 쇼핑몰 상세페이지 디자이너 및 예비 디자이너
√ 오픈마켓 및 소셜커머스 상세페이지를 직접 디자인 하려는 사업자
√ 매출을 높일 수 있는 상세페이지 비결이 궁금한 사업자 및 디자이너

▣ 작가 소개

저자 : 김경은
3년차 쇼핑몰 대표이며 15년차의 웹디자이너로 현재 웹디자인 업체 W2A를 운영하고 있다. 국방부, 검찰청 등 국가기관 출장 강의를 하고 있으며 CJ, 유한양행 등 유수의 기업에 판매 컨설팅을 하고 있다. 카이스트 등 다수의 대학에 강의를 하고 있으며, 글로벌이커머스 자격증 대표 강사, 카페24 대표 강사, 이베이 교육센터 전문 강사이기도 하다. 꼼꼼하고 친절한, 고객과 소통하는 쇼핑몰 제작을 모토로 쇼핑몰 제작 실전 및 전반에 대해 강의하고 있다.

▣ 주요 목차

머리말
예제 및 완성 파일 다운로드 방법
이 책 미리보기
이 책을 읽는 법
차례

Part 1 오픈마켓 디자인의 변화에 대처하기
Chapter 1 온라인 시장의 변화
Section 01. 온라인마켓 디자인 트렌드
Section 02. 모바일 시장에서 살아남는 디자인 트렌드
Section 03. 쇼핑몰 사장님은 디자이너가 아니다. 기획자다!

Chapter 2 상세페이지, 디자인 업체 VS Self Making
Section 01. 디자인 업체의 상세페이지 제작 비밀 노트
Section 02. 1인 온라인 마켓 사장님의 상세페이지 제작 비밀 노트

Chapter 3 디자인 작업 시 유의사항
Section 01. 디자인 업체 유형 선정
Section 02. 상세페이지 제작의뢰서 작성 요령
Section 03. 기타 유의사항

Part 2 상세페이지를 위한 포토샵 기초 다지기
Chapter 1 포토샵과 절친되기
Section 01. 포토샵이 하는 가장 기본적인 일
Section 02. 포토샵의 툴 이해하기
Section 03. 상세페이지를 위한 포토샵 인터페이스 만들기
Section 04. 상세페이지 기본 틀 만들기
Section 05. 포토샵 레이어 알아보기
Section 06. 상품 색상 보정하기
Section 07. 상세페이지에 필요한 폰트 사용설명서
Section 08. 웹/모바일 최적화로 이미지 저장하기

Chapter 2 상세페이지 제작을 위한 포토샵 필수 기능 설명 10가지
Section 01. 상품 사진 촬영 후 사용하는 기능 모음
Section 02. 로고 지우기
Section 03. 인물사진 보정하기
Section 04. 배경 지우기1(Quick Selection)
Section 05. 배경 지우기2 - 펜 툴을 이용한 배경 지우기
Section 06. 이미지 합성으로 인트로 제작하기
Section 07. Hit 상품 도형(메달) 만들기
Section 08. 상점 워터마크 제작으로 저작권 표시하기
Section 09. 클리핑 마스크로 로고 제작하기
Section 10. 벽에 걸린 상품진열장 만들기와 상품 그림자 만들기

Part 3 오픈마켓 상세페이지 실전 제작하기
Chapter 1 카테고리별 상세페이지의 특징
Section 01. 식품류 상세페이지의 특징(송이토마토 상세페이지 제작)
Section 02. 공산품 상세페이지의 특징(모기장 상세페이지 제작)
Section 03. 화장품 상세페이지의 특징 및 제작
Section 04. 패션 잡화 상세페이지의 특징(귀걸이 상세페이지 제작)
Section 05. IT 제품 상세페이지의 특징(액정보호필름 상세페이지 제작)
Section 06. 유아용품 상세페이지 만들기

Chapter 2 단품 상세페이지 실전 제작하기
Section 01. 썸네일 제작하기
Section 02. 단품 상세페이지 제작하기
Section 03. 배송 정보 제작하기

Chapter 3 다중 옵션 상세페이지 실전 제작하기(앨범)
Section 01. 인트로 제작하기
Section 02. 옵션 제작하기
Section 03. 상품상세영역 제작하기
Section 04. 배송안내 제작하기

Chapter 4 의류 상세페이지 실전 제작하기
Section 01. 클릭(옵션) 이미지
Section 02. 팝업용 상세페이지 이미지
Section 03. 롤오버 코드와 html 작성을 활용한 팝업페이지 제작 방법

Part 4 오픈마켓 상세페이지로 노출 점수 높이기
Chapter 1 G마켓/ 옥션 템플릿과 품질지수 만점 받기
Section 01. 품질지수 평가가이드
Section 02. 영역별 템플릿 확인하기

Chapter 2 오픈마켓에서 놓치면 안 되는 영역 제작하기
Section 01. 판매자의 다른 상품 팝업링크 제작하기
Section 02. 미니샵 메인 이미지 제작하기(움직이는 대문이미지 제작)
Section 03. G마켓, 옥션 이미지호스팅

Part 5 소셜커머스 상세페이지 제작가이드
Chapter 1 소셜커머스 상세페이지의 공통점
Section 01. 최적의 개별이미지 용량
Section 02. 소셜커머스 상세페이지 레이아웃
Section 03. 소셜커머스의 배너이미지 제작 시 유의사항
Section 04. 폰트 사용 규정
Section 05. 컨텐츠 표시광고 법규 준수

Chapter 2 소셜커머스별 영역별 차이점
Section 01. 인트로 영역
Section 02. 옵션리스트
Section 03. 옵션상세 설명 부분
Section 04. 부가설명