스마트스토어 상품 상세페이지 제대로 만들기 총정리

안녕하세요~ 보여주는 일기장입니다

그동안 포토샵 작업을 주로 공유드렸었는데요

 

오늘부터는 한건 한건의 개별 작업이 아니라

상품을 소싱하고부터 판매까지 이르게되는

과정에서 필요한 '시각화' 부분에 대해서

정보를 공유해드리고자 합니다!

 

가장 먼저 상품을 소비자들에게 보여주는

오프라인에서의 디스플레이와 같은 역할인

'상세페이지'에 관하여 말씀드리겠습니다

 

- 만약 '너무도 당연한 말이다' 라고 느낀다면

더블체크하는 용도로 생각해주세요

- 본인에게 해당하지 않는 내용이라면

따로 응용하시거나 다시 한번 고려해보세요

- 주관적이며 개인적인 의견을 바탕으로

기재하였으니 긍정적인 시각으로 봐주셨으면 좋겠습니다

 

1. 상품 기획에서부터 정립해둔 모든 정보를 연계 활용하라

상품을 소싱하면서 계획적이지 않더라도, 각자 머릿속으로는 대략적으로

'이 상품을 누구에게 팔면 좋겠다' 또는 '30대 아줌마에게 팔아봐야겠다'라는

간단하고 직감적인 판단은 하셨을거라 생각합니다

상세페이지에 활용하기 위해서 바로 그런 내용들을

(기업에서는 주로 기획안을 작성)

노트를 펼쳐 수기로 작성해보는 것입니다

- 타겟에 따라 성별, 연령층, 직업, 성향을 파악한다

- 경쟁자들의 상품을 분석한다

- 스스로 상품의 장점과 단점을 파악한다

- 시장조사 중, 나의 상품의 가격 포지션이 어떤지 파악한다
(최고가/최저가/중고가/중저가 등)

- 이외 다른 특징들을 캐치한다

 

위에서 언급한 내용들을 상세페이지에 녹히듯 적용하는 것입니다

 

2. 가이드라인, 콘티, 기획안, 구성/목차 를 작성하라

1번에서 생각들을 글로 표현하며, 타당한 이유인지 아닌지....

나름의 필터를 거쳤고 이로써 남에게 더 보이기 좋게만들어졌을 것입니다

이제 두번째 작업은 글로 정리된 생각들을

다시 한번 우리들은 더 좋게 보이기 위해서(상품 판매를 위해)

글과 함께 사진, 그림, 영상, 움짤 등으로 '시각화' 해야합니다

 

2-1. 구성/목차를 만든다

소비자는 상세페이지를 가장 상단부터

하단으로 스크롤을 내리며 읽습니다

신문의 '헤드타이틀' 역할처럼

가장 먼저 보이는 부분의 중요성을 알아야하고

상세페이지의 구성 순서에 따라

가독성의 높아지거나 낮아질 수 있고

이는 구매전환과 이어질수있기 때문에

간단하지만서도 중요한 작업입니다

(중요하지 않은 작업은 없는 것 같습니다)

 

2-2. 스캐치한다

목차 작업을 마쳤다면,

다시 한번 노트를 펼쳐 나만 알아 볼 수있는

악필로 끄적여도 좋고, 피피티로 작성하여도 좋습니다

작곡가들이 가사없이 허밍하며 가이드라인을 녹음하듯이

러프하게 상품의 느낌 또는 연출하고자하는 느낌들을

적어가며 최대한 예쁜 말들;

소비자가 구매자극을 받을 수 있는 말들을 고안해봅니다

2-3. 구성에 따라 필요한 이미지를 삽입한다.

예를 들어 아래처럼 구성을 만들었다면,

1. 브랜드 소개

2. 상품

3. 배송

각 구성에 필요한 이미지를 준비하는 것입니다.

1. 브랜드 로고 / 브랜드 메인상품

2. 상품 메인 이미지/다각도/색상/옵션/디테일/누끼

(누끼 : 배경이 없는 .png파일)

3. 실제 배송 패키지/ 배송안내

이 작업을 진행하며

촬영에 필요한 리소스를 줄일 수 있고,

또는 아웃소싱하여 외주로 촬영을 맡긴다고하여도

1번과 2번에 필요한 '상품 메인 이미지'는 공통적으로

한번의 촬영으로 쓰여질 것으로 불필요한 촬영을 줄일 수 있습니다

즉, 컷수에 따라 비용이 추가되므로, 비용을 줄일 수 있는 것입니다

추가로 실제 사용될 이미지를 배치하며,

글로 생각하였을때는 괜찮았으나, 실제 느낌이 많이 달라

이전에 계획한것과 수정할 수도있습니다

(계획에서 의도된 바와 취지를 지키며 수정하시는걸 추천합니다)

(간단한 촬영은 직접하여 비용을 아껴보시고

고퀄리티의 아웃풋을 원하신다면 촬영대행을 맡기시는걸 추천합니다)

 

3. 포토샵을 키고 상세페이지를 만든다

스마트스토어는 가로 860픽셀이 최적화 사이즈입니다

오픈마켓, 쇼핑몰마다 최적의 사이즈는 다르므로 유의하시어

작업을 진행하세요

2번 작업을 바탕으로 응축된 작업물 (사진, 글귀 등)을

조합하여 최종적으로 시각화합니다

 

같은 구성과 배치를 계속적으로(다음 상품에도) 사용한다면,

포토샵으로 상세페이지를 만들때

레이어 정리, 파일명, 배치, 가이드라인(안내선)등을

한번에 깔끔하게 정리하고 필요시 마다

복사/수정하여 사용하시는 것이 시간/비용적으로 좋습니다

 

- 응축된 작업물의 느낌대로 컬러를 뽑는다
주황색은 식욕을 돋구고 초록색은 안정감을 주고

파란색은 신뢰감 빨간색은 생동감 등

각각의 컬러들은 나타내는 느낌이 다릅니다

이를 이용하여 상품 또는 브랜드의 메인 컬러를 만들고

포인트컬러나 백그라운드 컬러로 사용하며

상세페이지에 반영하는것이 좋습니다

- 장점 등 소비자가 가장 잘 알아 주었으면 하는 정보를

반복 노출한다

상단부터 하단까지 문구 또는 이미지를 반복사용하여

알려주고싶은 보여주고싶은 정보를 부각시켜줍니다

 

- PPT 처럼 만들어보세요

핵심내용을 제외한 문구는 과감하게 생략하고

표어와 같은 배너나 PPT와 같이 가독성이 높고

초등학생도 이해할 수 있도록 쉽게 만들어보세요

 

- GIF이미지;움짤을 넣어보세요

소비자입장에서 동영상은 재생을 시켜야하며 왠지 모르게 부담스럽고

사진은 정보가 너무 적고 큰 영향을 받지 못합니다

동영상과 사진의 장점을 합친 GIF 이미지 움짤을 활용해보세요

 

- 사이즈 표기 등 복잡한 정보는 간단한 이미지로 재정리

의류상품의 사이즈는 다양하기 때문에 표로도 많이 보여지고있고

의상 위에 화살표를 그려주어 이미지로 나타내주기도합니다

높은 가독성은 소비자에게 편의를 제공하고

복잡한 UI/UX로 번거로움 제공하는 스토어보다

구매로 유인하기 쉬운 환경을 조성합니다

 

4. 최종 작업물을 계속적으로 업데이트한다.

시즌상품은 계절이 변하면 계절감에 따라

컬러를 변경해주는것이 좋고

겨울이되면 더 따뜻한 느낌의 워딩이 좋습니다

보기 좋은것이 먹기도 좋으며

좋은게 좋은것입니다

귀찮지만 하나라도 더 팔 수 있다는 일념하나로

꾸준히 업데이트해나가야합니다

(독단적인 판단과 수정은 오히려 악惡수가 될 수 있습니다,

객관적이며 냉정하게 판단하고 타인의 의견을 존중하여

피드백을 반영하여 수정 작업하며

또 다시 나오는 최종 작업물을 갖고 이 싸이클을 반복합니다)

 

---

나름 최선을 다해 글로 정리해보았는데

보는이들 모두 유용한 정보가 되었음합니다

스마트스토어 판매자이며, 

디자인 프리랜서로 활동하며

많은 대표님들의 의뢰를 받았고

작업을 진행하며 그 과정중에서

제가 아쉽고 답답한 부분들을 떠올리며

적어보았습니다

 

개인적인 자문이나 도움이 필요하다거나

상담/문의/의뢰건이 있다면 이메일 보내주세요 :)

binsane90@gmail.com

 

긴글 읽어주셔서 감사합니다!