다국적 CBD 제품 연구 개발 기업
씨비디 랩 재팬
CBD Lab Japan
- WordPress
- Responsive Web
- Server Setting
일본에 본사를 두고 글로벌 시장을 타겟으로하는 CBD Lab Japan의 다국어 웹사이트 개발 프로젝트를 담당하여,
컨셉 및 구성 기획 단계에서부터 디자인과 AWS서버 셋팅, 워드프레스 다국어 사이트 셋팅, 웹 퍼블리싱까지의 전반적인 업무를 성공적으로 수행하였습니다.
동종 기업의 글로벌 트렌드를 조사/분석하여 컨셉을 정리하고, 퀄리티 있는 결과물을 위한 디자인 시안 작업을 거쳐, 세련되고 일반적인 워드프레스 웹사이트와는 차별화 될 수 있는 디자인의 웹사이트를 완성해드렸으며, 디테일한 부분에서 기업의 아이덴티티가 드러날 수 있도록 완성도 높은 작업을 진행해드렸습니다.
또한, 제품과 기업 소개를 위한 퀄리티 있는 이미지들을 선별하여 클라이언트사의 컨펌을 거쳐 구매 후 디자인에 적용해드렸습니다.
– Full Screen Banner, Parallax Scrolling, Animation & Interactive –
메인 페이지를 비롯한 모든 페이지들의 상단에는 패럴렉스 (Parallax) 효과가 가미된 풀 스크린(Full Screen) 배너를 적용하였으며, 페이지의 중간 중간에도 패럴렉스 (Parallax) 효과를 가미하여 트렌드를 반영했습니다.
또한, 의도적으로 이미지 등의 요소들이 프레임 밖으로 벗어나는 애니메이션을 적용하여 탈 그리드( Brocken Grid) 스타일을 구현하였습니다.
COSMETICS
CBGセラム&クリーム
20ml / 1000mg CBD
CBD美容液
20ml / 1000mg CBD
CBD Lab Japan 웹사이트는 페이지 스크롤링에 따라 인터렉티브하게 등장하는 이미지와 텍스트 그리고 버튼 등 전반적인 웹사이트의 구성 요소들이 정적인 레이아웃으로 고정되어 있지 않고 방문 고객의 페이지 탐색에 따라 흥미진진하게 움직임을 보여주는 웹사이트로 구현하기 위해 많은 요소들에 섬세한 기획과 작업 공정을 거쳐 완성되었습니다.
제품 갤러리의 섬네일 이미지에도 이미지 전환 마우스 호버(Hover) 이펙트를 가미하여 더욱 유니크한 웹사이트를 구현하기 위해 노력했습니다.
– Design Concept Planning –
CBD Lab Japan은 일본에 본사를 두고 있지만 한국에서 시작된 기업 입니다. 그러한 고객사의 요청으로 CBD Lab Japan의 로고 아이덴티티 컬러를 기반으로 한국적 색동 컬러를 재해석하여 포인트 컬러와 서브 컬러들을 규정하였습니다.
일본어와 영어의 두가지 언어로 구현되는 CBD Lab Japan 다국어 사이트 셋팅을 위해 두 언어의 폰트를 각각 규정하였으며, 제품 특성을 표현하기 위한 일러스트 Icon 세트를 제작하였습니다.
– Header & In-page Navigation –
CBD Lab Japan 웹사이트의 헤더(Header) 메뉴는 사이트의 아이덴티티를 위한 색동컬러 라인이 적용되었으며, 각 메인 메뉴로 이동시 해당 메뉴의 서브 메뉴가 인 페이지(In-Page) 네비게이션으로 표시되도록 UI를 구성하였습니다.
– Product Page –
CBD Lab Japan 웹사이트의 Product 페이지는 상단 풀 와이드(Full-Width) 배너 아래로 1컬럼 제품 리스트 갤러리가 표시됩니다.
제품 리스트 갤러리는 웹사이트 완성 후 클라이언트사에서 제품 업데이트시 관련 이미지와 내용을 기입하면 자동으로 제품 페이지에 규정된 레이아웃으로 표시되도록 셋팅하였습니다.
또한, 제품 페이지의 하단에는 관련 제품(Related Products) 갤러리를 넣어 관련 제품들이 랜덤으로 표시되도록 구성하였습니다.
– Unbalanced & Broken Grid Layout –
CBD Lab Japan 웹사이트 프로젝트에서 중점을 두었던 부분은 변화무쌍하면서도 미니멀한 레이아웃 입니다.
페이지 내에서 풀 와이드(Full Width)와 인 그리드(In Grid) 레이아웃를 조화롭게 배치하여 페이지 내에서 끊임없이 구도의 변화를 주었으며, 언밸런스한 컬럼 배치로 미니멀 하고 트랜디한 웹사이트 이미지를 구현하였습니다.
이미지와 칼럼들은 정해진 그리드를 벗어나 패럴렉스 (Parallax) 효과와 함께 움직이며 시선을 사로잡습니다.
– Contact & Inquiry –
CBD Lab Japan 웹사이트의 컨택과 문의 페이지는 전체적인 사이트의 스타일가이드를 따르면서 좀 더 심플하고 모던하게 디자인 했습니다.
웹사이트 방문자가 문의폼 내용을 기입하여 전송 버튼을 클릭하면 담당자의 이메일로 서식화 된 문의 내용이 전달되도록 셋팅하였습니다.