본문 바로가기

웹디자인

[UI / UX] 쇼핑몰의 완성도를 높이기 위한 기초

쇼핑몰의 UI / UX 에 대해서는 간단해 보이면서도 쉽지 않기도 합니다.

특히 제품 상세 화면을 보면, 쇼핑몰의 화면들이 비슷 비슷한 구조를 가지고 있는거 같기도 하죠.

쇼핑몰은 모바일쪽의 매출이 점점 높아지고 있기 때문에 UI나 UX 측면도 모바일쪽을 강화하는 것이 필요합니다.

오늘은 모바일이나 PC를 구분하지 않고, 일반적인 사항에 대해서만 이야기를 하고자 합니다.

(이미지 :  unsplash  / 쇼핑몰 관련)

온라인 쇼핑몰을 사용하는 것이 일반화가 되었습니다.

다양한 상품을 검색해 보고, 제일 싼 가격을 찾아서, 편리한 지불 수단으로 언제 어디서나 구매를 할 수 있습니다.

일반적인 UI의 구성은 상품명, 상품 썸네일, 상품에 대한 기본정보 ( 가격, 배송정책이나 배송비 등) 으로 되어 있고, 장바구니, 구매, 공유버튼, 상품상세 이미지, 상품평, Q&A 등으로 되어 있습니다.

UI 구성에 있어서 고려할 점은 대상 쇼핑몰의 상품에 따라서 달라질 수 있습니다.

가령, 화장품 상세와 도서상품 상세 UI는 똑같을 수는 없습니다.

구축하게 되는 쇼핑몰의 분야에서 필요한 UI 및 UX 구성이 필요한 것입니다.

(이미지 :  unsplash  / 쇼핑몰 관련)

 

그래도 공통적인 UI / UX에서 적용할 점은 다음과 같습니다.

1. 공유 기능을 빼먹지 말라.

좋은 상품을 만나게 되면, 반드시 그 자리에서 구매를 못하는 경우가 생기게 됩니다.

나를 위해서 SNS나 카톡으로 공유하기도 하고, 주변에 알리기 위해서 공유 기능은 쉽게 사용할 수 있는 기능이죠.

크게 어려운 것도 아니고, 일반적인 기능이기 때문에 빼먹지 말고 화면 UI에 적용해 보시면 됩니다.

( 좋아요 버튼도 있어야 한다. )

2. 쇼핑몰 로고는 잠시 가려도 좋다

쇼핑몰 로고가 상단에 Fix 해야 하는 고정관념이 있는 거 같습니다.

메인 상단에는 쇼핑몰 로고를 반드시 배치를 해야 겠지만, 하단으로 내려가거나 모바이르이 상세 화면에서는 잠시 내려 놓아도 좋습니다.

3. 상단으로 올라가는 버튼은 구현이 어려운 것이 아니다.

의외로 많은 쇼핑몰에서 상단으로 올라가는 버튼을 제공하지 않는 경우가 있더군요.

상단으로 한번에 올라가는 버튼은 쉬우면서도 사용자 편의성을 높여줍니다.

상품 상세 화면에 여러가지 정보를 보여줘야 하고, 모바일의 경우 롱 스크롤이 빈번하게 일어나기 때문에 상단으로 한번에 올라갈 수 있는 기능을 제공해 준다면, 사용자들이 보다 편리하게 쇼핑몰을 이용할 수 있습니다.

쇼핑몰에서의 UI / UX는 많은 고민을 하면서 힘들게 구성을 하지만, 보기에는 비슷해 보이는 것이 사실입니다.

(이미지 :  unsplash  / 쇼핑몰 관련)

 

쇼핑몰에서 제공하는 핵심 정보들은 비슷하니, 사용자를 위한 상세한 UI / UX가 두드러지게 표현되지는 못하기 때문이죠.

그리고 쇼핑몰의 경쟁력은 제품, 가격, 배송 등 UI / UX 보다 더 중요한 것들이 많기 때문에 상대적으로 돋보이지는 못합니다.

하지만 쇼핑몰이 성장하고, 경쟁력을 높이고, 완성도를 높이는데에는 중요한 요소입니다.

쇼핑몰 구축 설계

쇼핑몰 ERP 연동 설계

bemadeshop

bemadeshop