메뉴로 건너 뛰기 내용으로 건너 뛰기

프로젝트

닥터자르트 —

닥터자르트 반응형웹 웹사이트

Project Summary

디파이 포트폴리오 닥터자르트 웹사이트 KV 입니다.

Launch Date

6월
2014년

Categories

  • 커머스 사이트 구축

Tages

  • Uaaaaa

Project Number

34N.

스마트 쇼핑, 강력한 브랜딩으로 새롭게 재정비한 반응형 웹 사이트 리뉴얼 기능성 화장품 전문 브랜드인 닥터자르트 웹사이트가 ‘반응형 웹’으로 새롭게 리뉴얼 되었습니다. 사이트에서 제품을 판매하는 행위에만 목적을 두는 것이 아닌, 다양한 피부 고민을 갖고 있는 사용자들에게 피부에 관련된 정보를 공유하고, 소통하고, 이해하는 공간을 만드는 것이 리뉴얼의 핵심 목표였습니다.

  • 다양한 디바이스 환경을 고려한 반응형 웹 구현

    디바이스의 다양성에 구애받지 않고 모두가 쉽게 사용할 수 있는 ‘반응형 웹’으로의 구현을 위해 화려하고 복잡한 구성 대신 필요한 요소들 만으로 짜임새 있는 표현을 하고자 하였습니다. 국내 이커머스 분야에서는 다양한 요소와 복잡하게 얽혀있는 구조적인 문제들로 인해 ‘반응형 웹’ 구현이 쉽지 않은 터라 ‘보다 완벽하게 구현된 반응형 웹’에 중점을 두고 사이트를 구현하였습니다.

  • 구매에 최적화하여 견고하게 표현된 UI / UX

    커머스의 특성상 쇼핑에 대한 기능과 제품 정보에 대한 구성, 프로모션 등 다양한 성향의 콘텐츠들이 혼재되어 있는 것을 정리하여 사이트의 구성이 쉽게 파악 되도록 하였고, 실시간 장바구니 카운팅 기능과 상세페이지에 들어가지 않아도 제품 리스트에서 위시리스트와 코멘트, 장바구니 기능을 이용할 수 있도록 하여 구매까지의 단계를 최소화할 수 있는 UI / UX를 설계하였습니다.

  • 웹폰트의 적극적 활용

    ‘반응형 웹’ 구현에 있어 필수 요소인 ‘웹폰트’를 적극적으로 활용하였습니다. 다양한 플랫폼에서 동일한 디자인으로 표현되는 장점뿐만 아니라 Helvetica를 근간으로 디자인된 닥터자르트의 브랜드 아이덴티티와의 일관성을 부여할 수 있는 특징이 있습니다.

  • 웹사이트의 역할에 충실한 웹사이트

    사용자들과의 원활한 커뮤니케이션을 위해 다양하게 운영되어 있던 각종 SNS를 닥터자르트 웹사이트에 재정리하여 다시금 재확산 시키는 베이스캠프 역할을 할 수 있도록 구성하였습니다. 일관성 있는 브랜딩의 초석을 마련함과 동시에 고객과의 다양한 접점이 분산되지 않고 집중될 수 있도록 하였으며 SNS의 환경 상 이용하기가 힘든 ‘메디컬 테스트’나 ‘전문가 컨설팅’ 등 양질의 콘텐츠를 고도화하여 웹사이트 에서만 제공함으로써 사이트 방문의 가치를 높였습니다.

  • 제품의 특징을 최대한 부각시키는 상품 상세페이지 디자인

    이번 리뉴얼은 사이트의 틀 뿐만 아니라 모든 닥터자르트 제품 전체에 대한 상세페이지까지 디자인하게 되었습니다. 피부의 고민별로 제품이 분류되는 닥터자르트 만의 섬세한 제품 별 특징을 살려내는 상세페이지가 나올 수 있도록 상세페이지를 리디자인 하여 겉과 속이 모두 단단한 사이트를 만들고자 하였습니다.

  • 닥터와 아트의 만남, 닥터자르트의 브랜딩

    닥터자르트는 닥터와 아트가 만나 과학적 이면서도 아름다움을 추구하는 브랜드입니다. 그간 닥터자르트에서 선보였던 제품의 패키지 들은 국내의 브랜드라는 것이 믿기지 않을 만큼 미니멀 하면서도 견고한 디자인을 선보여 왔습니다. 그러한 닥터자르트만의 브랜드 아이덴티티를 최대한 살리면서도 본질을 잊지 않는 세련된 브랜드의 색을 표현하는 것에 중점을 두었습니다.

닥터자르트 사이트 PC, 모바일 버전 이미지입니다.
닥터자르트 사이트 오버뷰 이미지입니다.
닥터자르트 사이트 네비게이션 관련 이미지입니다.
닥터자르트 사이트 폰트 가이드라인 관련 이미지입니다.
닥터자르트 사이트 콘텐츠 관련 이미지입니다.
닥터자르트 사이트 콘텐츠 관련 이미지입니다.
닥터자르트 사이트 제품 상세 페이지 이미지입니다.
닥터자르트 사이트 제품 상세 페이지 이미지입니다.
닥터자르트 사이트 태블릿 버전 이미지입니다.

Credits.

닥터자르트 반응형웹 웹사이트

D.FY(디파이)

코발트식스티

어나더 레인보우

라운디드

-

임정민 - 프로젝트 매니저

방대석 - 디자인

디파이 포트폴리오 닥터자르트 사이트 섬네일 이미지입니다.