Journal Archive

구본기는 온라인쇼핑몰은 기업이 인터넷을 이용하여 고객 간의 거래가 일어날 수 있는 다양한 가상 형태의 점포들을 모아놓은 것을 의미하며, 소비자가 쇼핑몰에 접속 후 구매상품을 조회, 주문, 결제, 배달의 과정이 한 번에 이루어지는 형태의 쇼핑방식으로 정의하고 있다[7].

온라인쇼핑몰을 물리적 공간의 오프라인 상점과 비교해 보면 구매자가 직접 상품의 검색 및 비교를 통해 원하는 상품을 선택하며, 전화상담 혹은 질의응답 등을 통해 서비스를 받는다. 대체로 쇼핑몰을 구성하는 인터페이스의 그래픽 디자인 및 서비스 품질이 해당 쇼핑몰의 이미지에 영향을 미친다.

이러한 온라인쇼핑몰은 시간과 공간의 제약 없이 편리한 쇼핑이 가능하며, 쇼핑몰 간 가격 비교가 쉬우며, 많은 정보와 편리한 시장 접근성을 지닌 것을 특징으로 한다. 또한 쇼핑 활동에 필요한 데이터베이스의 구축을 통해 상호 정보교환이 이루어짐에 따라 고객의 특성 및 취향을 파악할 수 있고 이를 통한 맞춤 서비스의 제공이 가능하다. 이는 구매자의 욕구를 만족시킬 수 있는 장점이 있다[8].

온라인쇼핑몰의 품질특성은 시스템 품질, 정보 품질, 서비스 품질, 제품 품질, 관계 품질로 구성된다[9]. 신다혜는 선행 연구를 바탕으로 연구에서는 온라인특성을 크게 네 가지로 구분하여, 고객이 원하는 상품의 가격 및 특성에 대한 비교의 용이 정도를 의미하는 비교 용이성, 동일 제품에서 저렴한 가격을 우선하여 구매하는 비용 절약 차원의 가격우위, 상품의 속성, 이미지, 디자인, 기능성, 실용성 등을 포함하는 상품 구색, 정보 이용 가능성, 질의응답에 관한 신속하고 정확한 답변, 주문의 편리성, 반품 및 교환의 정확성 등과 관련한 고객지원 서비스로 구분하였다[8].

상세페이지의 인터페이스를 구성하는 시각디자인 요소로는 타이포그래피, 이미지, 동영상, 컬러, 레이아웃, 아이콘 등이 있다.

• 타이포그래피

타이포그래피는 헤드라인, 서브타이틀, 본문, 캡션 등으로 구분할 수 있다. 고객의 마음을 첫눈에 사로잡을 수 있는 헤드라인과 제품에 관한 정보를 함축적으로 표현하는 서브타이틀, 구체적인 상세정보를 제공하는 본문, 그리고 이미지의 정보를 보이는 캡션은 서로 간에 계층적인 구조를 지님으로써 페이지 전체에 일관성을 줌과 동시에 고객의 시선의 흐름을 유도한다. 특히, 제품에 관한 구체적인 정보를 전달하는 본문의 경우 글줄의 길이와 행간 등의 조절을 통해 가독성을 높여야 한다.

• 이미지

상세페이지의 이미지는 크게 일러스트와 사진 이미지로 구분할 수 있다. 일러스트는 그래프, 지도, 도표 등과 함께 시각표현을 위한 방법이다[10], 상세페이지에서는 도표나 그래프 등의 일러스트를 통해 정량화되고 수치화된 정보전달이 가능하다. 상세페이지에 나타난 사진은 온라인상에서 고객이 물품을 구매하는 데 있어서 매우 중요한 역할을 하므로 사진의 해상도, 구도, 색상 등이 중요하다. 특히, 크기 등을 비교할 수 있는 다른 사물과의 배치, 사진을 돋보이게 할 수 있는 연출된 사진 등이 고객의 구매에 도움을 줄 수 있다.

• 동영상

상세페이지의 동영상은 상품의 기능을 보이는 수단으로 많이 사용된다. 상품의 재질, 강도, 성능 등 오프라인상에서 확인할 수 있는 정보를 보이기 위한 효과적인 방법이 된다.

• 컬러

인터페이스상에서 컬러는 사용자의 시선을 유도하고, 인지하는 데 중요한 역할을 하며 조작 시간에도 영향을 줄 수 있으며, 정보 간의 계층적인 구조를 이루는 데도 중요한 역할을 하는 디자인 요소이다[11]. 브랜드가 지니는 아이덴티티를 보이기 위해 브랜드 컬러의 톤앤매너를 유지하는 방법이 있으며, 메인컬러와 대비되는 강조 색을 적절히 사용함으로써 중요한 내용에 시선을 집중시킬 수 있다. 특히, 제품에 관한 많은 정보를 보이는 콘텐츠 영역은 내용에 따라 배경색을 달리함으로써 정보를 그룹화하는 것에 도움을 줄 수 있다. 상세페이지 디자인 역시 웹 접근성을 고려하여 텍스트와 명도 대비를 준수하여야 한다[12].

• 레이아웃

상세페이지의 레이아웃은 많은 양의 정보를 직관적으로 보이기 위해 일반적으로 그리드가 잘 지켜지는 경우가 많다. 특히 테블릿 PC와 스마트폰의 화면 크기에 맞게 폰트의 크기, 이미지 등이 재배치되는 반응형 디자인을 고려한 레이아웃이 기획된다[13].

• 아이콘

상세페이지의 아이콘은 제품의 기능 및 특징을 시각적으로 보여주는데 효과적인 요소이다. 직관적으로 내용의 인지가 가능한 아이콘을 통해 많은 양의 텍스트를 대체할 수 있는 직관적인 정보전달이 가능하다. 상세페이지에서 아이콘은 페이지 전체 내에서 일관성을 갖도록 라인의 두께, 색상의 톤, 표현 방법 등에 통일성이 적용되어야 하며, 아이콘의 크기 및 아이콘과의 간격 등을 시스템화시킴으로써 다양한 아이콘을 양산하고 제어하는데 효율성을 높일 수 있다.

제이콥 닐슨(Jacob Nielsen)은 의 10가지 휴리스틱 평가원칙을 제시하였다[14].

선행 연구[15]에서는 제이콥 닐슨의 휴리스틱 평가원칙 등을 기반으로 1인 가구 증가에 따른 대형 유통업체 모바일 커머스 사용성 평가를 위해 심미성, 일관성, 편의성, 피드백, 효율성, 예측성, 인지성 등 7가지 원칙을 선정하였다. 본 절에서는 선행 연구들 가운데 상세페이지 내에서 적용 가능한 인지성, 편의성, 효율성, 일관성, 심미성, 정확성 측면에서 살펴본다.

• 직관성(Recognition Rather than Recall)

고객이 별도 학습 없이 정보에 관해 쉽게 인식할 수 있어야 하며, 이를 위해 메뉴 및 아이콘, 내용이 알아보기 쉬우며 사용법을 기억하기 쉽도록 제작한다[14].

• 편의성(Convenience)

적정한 양과 내용의 제품 상세정보를 얻을 수 있으며 고객평을 통해 정보의 공유가 편하다[15].

• 효율성(Flexibility and Efficiency of Use)

제품의 카테고리 구성이 잘 되어있으며, 상품이 지니는 특징, 기능, 장단점, 비교 효율성 등에 관한 내용이 잘 전달되어 고객이 원하는 정보를 정확하고 빠르게 파악할 수 있다[14].

• 일관성(Consistency)

상세페이지에서 보일 수 있는 일관성은 텍스트 간의 계층구조, 메인색과 보조색 등의 계획성 있는 사용, 버튼, 화면의 표현 및 구성, 이미지의 배열 등을 기준에 맞게 시스템화함으로써 일관성을 보일 수 있다[14].

• 심미성(Aesthetic and Minimalist Design)

전체적인 화면의 구성이 깔끔하고 텍스트의 스타일과 크기, 아이콘의 모양과 색상 등이 조화롭고 보기 편하며 색상이나 로고에서 기업의 아이덴티티를 보인다[15].

• 정확성(Match between System and the Real World)

사용자가 쉽게 이해할 수 있는 언어와 용어를 사용한다. 특히 상세페이지의 목적인 제품의 정보를 정확히 전달하기 위해서 고객에게 익숙한 단어와 아이콘을 사용하고 논리적인 순서에 의한 정보를 제공한다[14].

본 조사의 설문 대상자의 일반 사항은 전체 100명 가운데 수도권에 위치한 대학과 서울에 위치한 여대의 20대 대학생을 대상으로 조사되었으며, 남성이 5%, 여성이 95%의 비율을 보였다. 먼저 본 연구의 사전 조사를 위해 설문 대상자 가운데 67명을 대상으로 상세페이지의 사용성을 살펴보았다. 제품구매에 앞서 상세페이지를 통해 정보를 받는 편인가에 대한 답변으로는 표 1과 같이 그렇다가 47.8%, 매우 그렇다가 38.8%로 사용자의 86.6%가 제품구매에 앞서 상세페이지를 이용하는 비중이 높음을 알 수 있었다.

다음으로, 온라인 쇼핑에서 오픈마켓 상세페이지가 제품구매 결정에 영향을 미치는가에 관한 답으로는 표 2와 같이 그렇다가 58.2%, 매우 그렇다가 23.9%로 사용자의 82.1%가 제품구매에 앞서 상세페이지를 이용하는 비중이 높음을 알 수 있었다.

본 절에서는 선행 연구를 기반으로 오픈마켓의 상세페이지 디자인을 콘텐츠 측면과 디자인 측면으로 구분하고 사용자가 인지하는 중요성을 조사하기 위해 각 항목을 다음과 같이 분류한다. 먼저 콘텐츠 측면으로는 카피라이팅, 통계 자료 등을 통한 제품의 성능, 기능, 성분 등에 관해 신뢰할 수 있는 객관적 정보제공, 타제품과의 비교, 제품의 크기와 용량 등에 관한 정보제공, 자주 묻는 질문(FAQ)·질문 및 답변(QnA), 사용자 리뷰, 포트폴리오 등을 통한 기업 또는 브랜드의 가치 증명, 배송정책 등을 포함한다. 다음으로, 디자인 측면으로는 타이틀, 본문의 가독성, 사진, 일러스트, 다이아그램(도표 및 그래프), 영상, 컬러, 레이아웃 등을 포함한다.

사용자 조사에서 상세페이지 디자인의 콘텐츠 측면의 중요성에 관한 조사 결과는 다음과 같다. 콘텐츠 항목 가운데 가장 중요하게 생각하는 우선순위 세 개를 선정하고, 선정한 우선순위 가운데 1순위~3순위까지를 조사하였다.

먼저, 콘텐츠 항목 가운데 가장 중요하게 생각하는 항목들로는 표 3과 같이 응답자의 27.3%(82명)가 통계 자료 등을 통한 신뢰할 수 있는 객관적 정보(제품의 성능, 기능, 성분 등)로 답했으며, 다음으로 중요하게 생각하는 콘텐츠는 응답자의 24.3%(73명)가 사용자 리뷰에 관한 콘텐츠로 답했다. 세 번째로 높은 비중을 차지하고 있는 콘텐츠는 응답자의 21.7%(65명)가 제품의 크기와 용량 등에 관한 정보제공으로 답했다.

다음으로, 표 4는 각 콘텐츠 항목에서 가장 중요하게 생각하는 요소의 1순위부터 3순위까지의 조사 결과이다. 먼저 1순위로 생각하는 콘텐츠로는 응답자의 38%(38명)가 통계 자료 등을 통한 신뢰할 수 있는 객관적 정보(제품의 성능, 기능, 성분 등) 제공으로 답했으며, 다음으로는 사용자 리뷰에 관한 콘텐츠 29%(29명), 제품의 크기와 용량 등에 관한 정보제공 21%(21명)에 관한 항목 순으로 나타났다.

다음으로 2순위로 중요도를 높게 생각하는 콘텐츠로는 표 5와 같이 응답자의 33%(33명)가 통계 자료 등을 통한 신뢰할 수 있는 객관적 정보(제품의 성능, 기능, 성분 등)로 답했으며, 그다음 큰 비중을 차지하는 항목으로는 제품의 크기와 용량 등에 관한 정보제공 25%(25명), 사용자 리뷰에 관한 콘텐츠 23%(23명)에 관한 순으로 나타났다.

3순위로 중요하게 생각하는 콘텐츠로는 표 6과 같이 응답자의 20%(20명)가 제품의 크기와 용량 등에 관한 정보제공으로 답했으며, 다음으로는 사용자 리뷰에 관한 콘텐츠, 사용자 리뷰에 관한 콘텐츠 20%(20명), 자주 묻는 질문(FAQ)·질문 및 답변(QnA) 15%(15명)의 순으로 나타났다.

사용자 조사에서 상세페이지 디자인의 디자인 요소 측면의 중요성에 관한 조사 결과는 다음과 같다. 디자인 요소들 가운데 가장 중요하게 생각하는 우선순위 세 개를 선정하고, 선정한 우선순위 가운데 1순위~3순위까지를 조사하였다.

먼저, 디자인 요소들 가운데 가장 중요하게 생각하는 항목으로는 표 7과 같이 응답자의 26%(78명)가 본문의 가독성으로 답했으며, 다음으로 중요하게 생각하는 요소는 응답자의 22.6%(68명)가 사진으로 답했다. 세 번째로 높은 비중을 차지하고 있는 디자인 요소는 응답자의 18.7%(56명)가 레이아웃으로 답했다. 이에 반해 비디오와 일러스트레이션은 각각 2.7%(8명)와 4.3%(13명)로 다른 콘텐츠에 비해 낮은 비중을 차지하였다.

다음으로, 표 8은 각 디자인 요소들 가운데 가장 중요하게 생각하는 요소의 1순위부터 3순위까지의 조사 결과이다. 먼저 1순위로 생각하는 콘텐츠로는 응답자의 39%(39명)가 본문의 가독성으로 답했으며, 다음으로는 사진 22%(22명), 레이아웃 이 19%(19명) 순으로 각각 나타났다.

다음으로 2순위로 중요도를 높게 생각하는 디자인 요소로는 표 9와 같이 응답자의 26%(26명)가 본문의 가독성으로 답했으며, 그다음 큰 비중을 차지하는 항목으로는 사진과 레이아웃이 각 각각 23%(23명)와 16%(16명)로 나타났으며 이는 디자인 요소 중요도의 1순위와 동일한 순서를 보인다.

3순위로 중요하게 생각하는 콘텐츠로는 표 10과 같이 응답자의 21%(21명)가 타이틀디자인으로 답했으며, 다음으로는 사진, 사용자 리뷰에 관한 콘텐츠 19%(19명)와 다이아그램 15%(5명)순으로 나타났다.