위즈위드 분석

위즈위드(WIZWID) 사이트의 전체 리뉴얼에 있어서 주요 이슈는 기존의 위즈위드(WIZWID) 쇼핑 고객에게 각인이 된 디자인의 아이덴티티를 그대로 유지하자는 것이다.
왜냐하면 이미 위즈위드 브랜드는 해외 상품 구매 대행으로 인지도가 높았으며, 브랜드 이미지에 맞게 표현한 우아하고 고급스러운 색상과 세련되고 감각적인 디자인이 기존사이트의 장점이었기 때문이다.
그래서 기존 사이트의 장점인 아이덴티티 이미지를 계속해서 유지시켜 타 쇼핑몰과 전면적으로 차별화된 느낌을 유지하기로 결정하였다. 대신에 위즈위드의 아이덴티티를 유지하면서 전체적으로 추가된 다양한 컨텐츠를 메인에 부각시키고 새롭게 구성된 디자인을 보여주도록 하도록 기획하는 것이 필요했다.
다양화된 컨텐츠 중 특히 신규로 추가된 Wiz Mall의 카테고리는, 기존 Wizwid.com의 Fashion Item에 대한 구매력이 Wiz Mall로 그대로 연결 될 수 있도록 구성하였으며, 쇼핑페이지의 차별화와 카테고리 식별의 용이성을 가져가고 전체적인 통일성을 유지하도록 하였다.
WIZWID, Wiz Shop, Wiz Mall 페이지의 각 메인은 마케팅 전개방향에 따라 프로모션형, 이벤트형, 세일형, 시즌형으로 페이지를 관리자가 자유롭게 구성하는 확장성을 가지도록 하였다.



정보 제공은 WIZWID의 가장 큰 장점이었다. 기존사이트에서도 구매대행 서비스를 위한 정보제공을 위해 WIZ Address (해외쇼핑 직접구매), WIZ Shop (해외쇼핑 구매대행)등을 기획하여 진행하였다.
여기에 쇼핑 기획전을 통합해 소개하는 위즈 스페셜(WIZ Special) 과 입점 브랜드를 한눈에 볼 수 있는 위즈 브랜드(WIZ Brand) 메뉴를 추가하였다.
그리고 이를 각 메인 페이지에 부각시킴으로써 쇼핑 편리성을 높였다.


특히 마이 위즈 스타일(My WIZ Style) 이라는 코너를 새로 추가하여, 고객이 좋아하는 브랜드의 물품으로 자신의 스타일에 맞춰 직접 코디한 물품이나, 전문 MD 가 추천하는 스타일의 물품을 손쉽게 구매할 수 있도록 하였다.

또한 MD가 추천하는 핫트렌드(Hot trend), 사용자가 최신 트렌드를 이끌며, 여러 상품을 테마에 맞게 구성이 가능한 영역이며 역시 여러 상품을 한번에 구매하도록 유도 가능한 영역을 기획했다.
이외에도 타 사이트에서 발견하기 힘든 부분인 관리자가 실시간 제어 가능한 템플릿을 기획하였다.
Mall의 브랜드 템플릿은 기존의 단순한 전개방식에서 벗어나 유명 브랜드의 성향에 맞는 메인 템플릿, 서브 템플릿이 수 십 가지가 구비되어 있다. 관리자들은 목적에 맞게 미리 제작된 템플릿을 통해 상품들을 매우 다양하게 조합이 가능하며 입점 브랜드와 사용자의 즐거움을 가미하였다.
끝으로 Help Desk 에서 이용안내, 구매가이드, About WIZWID, FAQ 등으로 분류를 하였으며, 그 하위 메뉴에 각 서비스 별로 설명을 하여, 고객이 원하는 정보를 손쉽게 찾아볼 수 있도록 하였다.
특히나 회사소개, 채용정보, 이용약관, 개인정보보호정책, 저작권정책, 국제전자상거래피해상담, 협력업체정보시스템(PIN), 제휴/ 입점 상담 등의 코너를 밖으로 구성하여, 고객 및 업체와의 이용 편리성을 최대한 높였다.




위즈위드(WIZWID) 라는 한 장소에서 WIZ Address (전문가용 해외쇼핑), WIZ Shop (해외쇼핑 구매대행), WIZ Mall (Top Brand 국내쇼핑) 이란 카피로 모든 쇼핑 영역을 다루고 있다.


일반인에게 생소한 ‘WIZ Address (전문가용 해외쇼핑)’ 메뉴 안에는 이용 편리성을 높이기 위해 세일이나 쿠폰 정보를 발 빠르게 소개하고 있다.
그리고 신규이용 고객을 위하여 해외 유명 쇼핑몰을 소개하는데, 해외 쇼핑몰의 구매법을 단계별로 소개하고 있으며, 또한 구매 및 배송시에 체크해야 할 사항들을 일목요연하게 정리하여 제공하고 있다.
특히 해외쇼핑 전문가인 ‘Editor’s Pick’ 코너를 새로 마련하여, 쇼핑에이전트가 추천하는 다양한 상품정보를 제공하고, 구매에 신뢰성을 높이고 있다.


국내 최초로 해외 쇼핑 구매대행 서비스를 제공하고 있는 메뉴이다.
여기에서는 최신 등록된 상품, 한 주간의 최대 인기 상품이나, 꾸준히 히트하고 있는 상품 및 MD가 추천하는 상품들이 각 코너 별로 자세하게 안내되고 있다.
또한 고객이 직접 MD에게 신상품 제안을 할 수 있는 코너가 있어 국내에서 구하기 힘든 물품들을 손쉽게 구할 수 있는 최대의 장점을 가지고 있다.
그리고 고객의 니즈를 반영하여 고급(Luxury) 브랜드만 모아 브랜드 소개 및 컨텐츠를 제공함으로써 차별화된 서비스를 보여주고 있다.


국내에 무수히 많은 쇼핑몰들 중 위즈위드(WIZWID)가 지닌 패션 지향적이고 고급스러운 느낌에 맞는 국내외의 탑 브랜드(패션 잡화 위주)를 해외 구매대행이 아닌 국내 벤더들로부터 소싱(Sourcing)하는 신규 서비스이다.
특히 각각의 입점 브랜드는 Mall in Mall 형태로 구성되는데, 이때 여러 가지 템플릿 중 브랜드와 어울리는 페이지를 선택하여 마치 Off-Line 에서 인테리어를 하듯이 매장을 꾸밀 수 있으며, 이로써 브랜드 자체의 고유성이 충분히 지켜진다.
고객도 여타의 쇼핑몰에서 보여지듯 일원화된 페이지가 아니라, 생동감 있고 특화된 페이지를 보면서 해당 브랜드를 더 잘 알 수 있고, 쇼핑시에도 큰 도움을 받을 수 있다.


WIZ People 이라는 새로운 메뉴를 구성하여, 고객과 WIZWID 간의 대화 창구를 확장시켰다.
이곳에서는 고객이 여러 가지 게시판 형태의 채널에서 아이디어를 보여주고, 요구사항을 쉽게 전달 할 수 있도록 하였다.
이로 인하여 고객과 WIZWID 간의 피드백을 자연스럽게 보편화 하였다. 또한 WIZ People 은 고객들간의 커뮤니케이션 기능을 통해 서로간의 정보공유로 보다 알찬 쇼핑을 돕도록 하였다.
특히 기존에 좋은 반응을 보이던 나도MD, 신상품제안, 쇼핑노하우, Best 상품평 등을 한 자리에 모아, 고객간에 정보 공유성을 최대한 높였다.
그리고, 신설된 포토 Gallery 라는 코너에서는 고객이 WIZWID 에서 제공하는 서비스를 이용하여 구매한 물품을 사진으로 찍어 전시하는데, 이는 구매자의 표출 욕구를 충족시켜줄 뿐 아니라, 판매 물품에 신뢰성을 극대화하고 있다.




제안에 있어서 분석을 통해 방향설정을 하고 이에 따른 구조화와 시각화가 수반되었다면
프로젝트 진행에 있어서는 클라이언트의 실제적인 담당자와 함께 보다 구체화된 방향의 설정을 위한 커뮤니케이션이 필요하며 이를 실제 사이트 구축에 있어 디자인적인 가이드(Guide)로 활용하기 위한 재해석이 필요하다. 펜타브리드에서는 이러한 재해석에 의해 도출된 산출물을 프로토타입이라고 부른다.
이것의 제작이 가져오는 프로젝트 진행상의 이점은 클라이언트(Client)의 생각과 제작회사의 생각의 차이를 상호간에 분명히 인식함으로써 제작 진행 중의 오류를 방지할 수 있다는 것과 진행도중 처음의 설정방향과 어긋나게 제작되는 실수를 막을 수 있다는 것을 들 수 있다.

위즈위드(WIZWID)사이트 제작을 위해 국내외 기존 쇼핑몰을 벤치마킹하여 장단점을 분석 후 WIZWID의 특수성을 반영하여 작성된 프로토타입은 아래와 같은 구성을 가지고 각 사항을 가지고 각 항목을 정의해 나갔다.






디자인 프로토 타입에 의하여 구조적, 시각적 방향이 구체화 된 것에 준해 실제적인 사이트에서 활용 될 시안이 제작되며 이 작업을 통해 WIZWID의 실제적인 얼굴이 될 디자인 아웃풋이 생성된다. 이번 위즈위드(WIZWID)의 디자인 작업에서 쇼핑몰의 아이덴티티로써 확정된 비주얼 적인 요소는 아래와 같으며 이에 준하여 각 개별 쇼핑영역인 WIZ Address, WIZShop, WIZMall이 디자인 되었다.






소비자들이 믿고 구매대행을 맡길 수 있게끔 유도하기 위해 신뢰감과 안정감을 상징하는 그린계열의 컬러를 사용하였고, MD가 추천하는 사이트 바로 가기의 위치를 크게 배치하는 레이아웃 구조를 가지고 있다.



위즈위드 쇼핑에서 가장 매출이 높고 기존에 사용자들이 가장 사용빈도가 높기 때문에 대표컬러인 버번디 컬러를 사용하였고, 레이아웃 구조도 기존의 WIZ Shop과 크게 벗어나지 않게 디자인 되었다.




위즈위드에서 새로 추진하는 사업으로써 참신함과 깨끗한 느낌을 주는 블루계열의 색상을 사용하였고, 입점 브랜드를 강조하기 위한 브랜드 배너를 메인 비쥬얼 비롯하여 화면 곳곳에 배치하는 형태의 레이아웃구조를 가지고 있다.





아직도 많은 디자이너들이 플래시와 데이터의 연동에 대해서 어려워하고 쉽게 접근하지 못하는 경우가 많다. 플래시에서 외부데이타를 이용하는 방법은 많지만 이번에 위즈위드에서 사용한 방법은 가장 간단한 방법 중에 하나이다.
위즈위드에서는 DB에 저장된 상품의 데이터들-상품이미지와 상품명, 가격이나 상품설명 같은 값을 가져와서 플래시에서 사용하게 된다. 플래시가 데이터를 받은 다음 그것을 사용하는 것은 보통의 플래시와 전혀 다르지 않다.
그러므로 이번에는 위즈위드의 상품전시플래시에서 데이터를 얻어오는 부분을 이야기하도록 하겠다.

HTML에서 플래시를 삽입할 때 들어가는 태그 중에 태그가 있다. 이 태그를 사용하면 플래시가 로딩될 때 브라우저가 가진 데이터를 플래시로 넘길 수 있다.

<PARAM NAME=FlashVars value="p_img1= p_a.jpg&p_id1= www.abc(가칭).com">
<PARAM NAME=movie VALUE="main01.swf">
<PARAM NAME=quality VALUE=high>
<PARAM NAME=bgcolor VALUE=#FFFFFF>

위의 태그는 main01.swf라는 플래시를 HTML에 삽입하면서 사용된 <PARAM>들이다.
이중에 주목할 것은 FlashVars라는 name을 가진 태그인데 이것이 main01.swf로 데이터들을 넘겨주는 역할을 하는 것이다.
예에서 보면 main01.swf라는 플래시로 p_img1과 p_id1이라는 변수에 각각 ‘p_a.jpg’와 ‘www.abc(가칭).com’ 이라는 값을 넣어주고 있다.
이렇게 HTML에서 PARAM태그를 써서 정의한 변수는 플래시의 _root에 같은 이름의 변수로 생겨나게 되어서, 플래시에서는 _root.p_img1과 _root.p_id1이라는 변수값으로 사용할 수 있게 되는 것이다.
위의 예는 특정한 변수에 특정한 데이터 값을 정의해서 플래시로 넘겨주는 것이고, 실제 위즈위드에서는 상품데이타를 <PARAM>태그를 사용하여 넘기면서 HTML이 아닌 ASP구문을 사용하여 DB에서 받아온 값을 적절히 넣어주도록 되어 있다.
이것은 아주 간단한 응용으로서 <PARAM NAME=FlashVars value=”ASP구문”>과 같은 형식으로 사용하면 된다. 여기서 value값에 필요한 값을 넣어주면 되는데, 쿠키에서 얻어온 값을 넣을 수도 있고 DB의 데이터가 들어갈 수도 있고 또한 이전 페이지의 링크에서 넘어온 데이터를 지정해 줄 수도 있다.
이것은 필요에 따라 사용하면 되는 것으로 여러 부분에 다양하게 적용되어질 수 있다.

<%
MemberID = Request.Cookies("MemberID ")
WebID = Request.Cookies("WebID")
MemberNM = Request.Cookies("MemberNM")
MemberPoint = Request.Cookies("MemberPoint ")
%>
_________________________________________________________________

<PARAM=FlashVars value="log_sta=<% If WebID< "" Then %>in&log_name=<%= MemberNM %> & MemberNM = <%= MemberNM % > & MemberPoint = <%= MemberPoint %> & WebID = <%= WebID % > <% Else % > out <% End If %> ">

이것은 실제 메가박스에 적용된 것과 같은 내용인데, 쿠키에서 유저의 정보를 얻어와서 PARAM태그에 적용시키는 구문이다. 위와 같이 다양하게 응용한다면 여러 분야에 유용하게 사용할 수 있다.