|
|
|
|
|
|
|
|
이번에 소개할 작업은 종로에서 다이아몬드 매장을 운영해온 다이아몬드 팩토리의 주얼리 상세페이지 디자인이에요. 매장이 온라인으로 고객을 만나기 시작하면서 필요한 상세페이지로, 다이아몬드 반지와 나석 소개부터 감정서, 4C 등급, 교환·반품 안내까지 한 페이지에 담았어요.
페이지는 분위기를 보여주는 이미지 영역과 등급·감정서 같은 정보 영역으로 뚜렷하게 나뉘어 있어요.
블랙과 아이보리를 번갈아 쓴 화면 구성
첫 화면은 반짝이는 보케 배경 아래 펼친 책 위에 반지를 올리고, 반지 그림자가 하트 모양으로 떨어지도록 연출했어요. 그 위에 브랜드 문구를 리본 형태로 얹어 매장 이름이 먼저 눈에 들어오게 했어요.
이어지는 영역은 블랙 배경에 골드 명조 타이틀, 핀셋으로 집은 다이아몬드, 거친 암석 위의 반지 이미지로 구성했어요. 그다음엔 밝은 패브릭 위 솔리테어 반지가 나와요. 어두운 화면과 밝은 화면이 번갈아 나오니 긴 페이지에서도 내용이 바뀌는 지점이 자연스럽게 구분돼요.
직수입·감정·매입 안내를 앞쪽에 배치했어요
이미지 사이사이에는 짧은 문장으로 매장의 운영 방식을 담았어요. 직수입 후 감정 전문가가 선별한 다이아몬드를 사용한다는 점, 구매한 다이아몬드는 매입이 가능하다는 점, 나석은 시세와 재고에 따라 가격이 달라질 수 있어 유선으로 안내한다는 내용이에요. 다이아몬드를 처음 구매하는 분들이 궁금해할 만한 부분이라 상세 등급 설명보다 먼저 보이도록 했어요.
감정서 샘플과 실제 등급표로 보여준 정보
중간에는 우신보석감정원의 다이아몬드 감정서 샘플 이미지를 넣고, 0.30ct 이상 다이아몬드는 거들면에 일련번호가 각인된다는 점과 감정서 재발급 안내를 함께 정리했어요.
아래에는 CARAT 0.30ct, COLOR F, CLARITY SI2, CUT EXCELLENT로 구성된 DIAMOND REPORT 표를 배치했어요. 항목명은 베이지 톤의 둥근 라벨로, 값은 오른쪽에 크게 표시해 감정서 원본보다 훨씬 빠르게 읽히도록 했어요.
전문 용어가 많은 상품, 도표로 보여주면 뭐가 좋을까요?
도표를 쓰면 용어를 글로 길게 풀지 않아도 등급 사이의 차이를 한눈에 비교할 수 있어요. 고객이 "그래서 내 다이아몬드는 어느 정도인지"를 스스로 가늠하기 쉬워져요.
이번 상세페이지에서는 4C를 네 장의 카드로 나눴어요. 캐럿은 0.05ct부터 5.00ct까지 실제 크기와 mm를 함께 보여주는 사이즈표로, 컬러는 D부터 FANCY까지 점점 노래지는 원형 아이콘으로 표현했어요. 클래리티는 내포물 점이 늘어나는 아이콘으로, 컷은 단면도와 Excellent부터 Poor까지의 단계 막대로 정리했어요.
상세페이지에 도표를 넣을 때 제가 중요하게 보는 건 카드마다 형식을 똑같이 맞추는 것이에요. 영문 제목, 한글 설명, 도표 순서가 반복되면 처음 보는 정보도 금방 읽는 방법이 익숙해져요.
마지막에는 밀봉 상태로 출고되는 점, 개봉 시 반품이 어렵다는 점, 검품 후 교환·반품까지 약 7~10일이 걸린다는 내용을 차분한 블루그레이 배경에 담아 마무리했어요.
굿파크에서는 주얼리처럼 분위기와 정보가 모두 중요한 상품을 작업할 때, 이미지 연출과 구매 전 확인 정보를 어떤 순서로 보여줄지 함께 고민해요. 2012년부터 다양한 상품의 상세페이지를 작업하며 고객과 직접 소통하고 있어요.
이 게시물을
