[제이씨코리아] 매스티지와 함께한 혁신적인 반응형 홈페이지 리뉴얼!

---

안녕하세요~!

20년 노하우, 국내 최다 홈페이지 제작 매스티지입니다^^

 

이번 포스팅에서는 매스티지가 제이씨코리아와 함께한

반응형 홈페이지 리뉴얼 프로젝트에 대해 자세히 알아보겠습니다^^

 

 

제이씨코리아(JCKOREA)는 새로운 패러다임의 네일 제품을 개발함으로써,

더 아름답고 편리하고 안전한 네일 문화를 이끌어가는 뷰티기업입니다.

R&D 중앙연구소와 디자인 연구소를 갖춰 최고의 전문가들이

연구를 거듭하며 글로벌 네일 문화 혁신을 선도하고 있습니다.

 

---

메인페이지

 

 

홈페이지를 처음 접속했을 때 기업의 이미지가

고객들에게 바로 각인될 수 있게 네일 이미지가

돋보일 수 있도록 레이아웃을 구성하여 제작했답니다.

와이드 형태로 꽉찬 백그라운드 레이아웃에 제품을 확대한 이미지를 사용하여

기업이 소개하고 판매하는 제품들이 명확하게 잘 보이도록 제작되었어요^^

 

---

 

 

 

 

전체적인 컬러 사용은 기업의 CI를 참고해 활용했으며

기본 블랙, 화이트 계열의 무채색과 레드 컬러를 포인트로 사용했답니다.

레드는 강렬한 인상을 남기며

자신을 쉽게 뽐낼 수 있게 도와주는 컬러입니다.

혁신적인 네일 기술로 국내는 물론 글로벌한 시장에서

브랜드 인식이 잘 전달되도록 기업과 잘 어울리는 레드 컬러를 사용했습니다^^

 

---

메인비주얼

 

 

 

3Page의 메인 비주얼로 구성하여

슬라이드 형식의 스크립트 레이아웃으로 제작했답니다^^

기업의 비전, 가치를 잘 보여주는 문구를 중앙에 배치시키고

기업의 네일 제품이 돋보일 수 있도록 고해상도에

이미지를 확대하여 비주얼로 만들었습니다:)

메인 배너가 일정 시간이 지나면 자동으로 변경되고

좌우 화살표 버튼과 하단 페이지탭을 통해 배너 변경이 가능하기 때문에

웹접근성을 높였고 웹표준을 준수하여 제작되었어요.

 

---

상단 GNB영역

 

 

 

GNB 영역의 내비게이션을 중앙정렬로 배치시킴으로써

메인 비주얼 레이아웃과의 통일성 유지를 할 수 있었어요.

마우스 스크롤에 상관없이 상단에 상시 고정되어

유저에 편의성을 생각하며 구성했답니다^^

또, 백그라운드 컬러 분위기에 맞춰서 GNB 레이아웃이 변형되는데요.

메뉴에 마우스를 올리면 GNB 백그라운드 영역이 생기면서

서브 하위메뉴들이 드롭다운된답니다.

포인트 컬러의 채도를 낮춰 마우스 오버효과를 자연스럽게 만들었습니다.

 

 

---

다국어홈페이지제작

 

 

 

 

 

 

글로벌 네일 문화를 선도하고 있는 기업에 걸맞는

다국어 홈페이지로 제작되었으며

GNB 우측 KOR/ENG 버튼을 클릭해

국문/영문 홈페이지를 자유롭게 이용할 수 있답니다^^

 

---

기업의 비즈니스 소개

 

 

 

디자인, 편의성, 혁신 등 기업 제품의 장점 요소를 소개하는 콘텐츠로

각 요소에 마우스를 올리면 투명도가 있는

검은 막의 레이아웃과 함께 자세한 내용이 나타나는데요.

클릭하면 상세페이지로 이동하게됩니다^^

 

---

 

 

 

박스형태의 레이아웃으로 2단 그리드를 적용시켜 제작했고

view more 버튼을 클릭하여 자세한 내용을

확인할 수 있는 상세페이지로 이동하게된답니다.

 

---

서브페이지

 

 

중앙연구소와 디자인연구소 2곳이 있기 때문에

하위 탭메뉴를 만들어 2page로 구성했답니다.

기업의 기술력을 잘 소개되도록 간결한

레이아웃과 가독성 높은 폰트 크기로 제작했으며

연구 활동의 내용이 명확하게 이해되도록 잘 어울리는 이미지를 사용했습니다^^

 

---

글로벌 네트워크

 

 

 

기업이 운영하는 글로벌한 생산 공장,

오피스 위치를 소개하는 콘텐츠인데요!

지도 일러스트를 활용하여 백그라운드 이미지를 만들었으며

각 지점을 클릭하면 상세내용이 팝업창 형식으로 나타나게됩니다,

 

---

 

 

 

브랜드 네임, 슬로건, 페르소나를 소개하는 콘텐츠로

네일 제품을 활용한 백그라운드와

각 요소에 맞는 문구를 강조시켜 제작했는데요.

마우스 스크롤을 내릴 때마다 펼쳐지는 듯한 모션 스크립트를 사용해

홈페이지를 이용하는 유저에게 몰입감과 집중도를 높였답니다.

 

---

반응형 리뉴얼

 

 

 

제이씨코리아 홈페이지는 모바일에 최적화된 반응형 홈페이지로 제작되어

홈페이지가 PC뿐만 아니라 노트북, 태블릿, 스마트폰 등

다양한 디바이스에서 접속해 기기에 맞는 해상도에 잘 구현되는

반응형웹으로 언제 어디서든 사이트를 쾌적하고 손쉽게 이용할 수 있답니다^^

 

제이씨코리아 의 반응형 홈페이지를 소개해 드린
오늘 포스팅은 여기서 마무리하겠습니다^^

 

매스티지는 국내 최다 홈페이지 제작 경험과

20년간 쌓은 노하우를 바탕으로

최상의 서비스를 제공할 준비가 되어있습니다^^

또, 매스티지는 고객의 비즈니스 목표를 이해하고,

그에 맞춘 전략적인 접근으로

최고의 결과물을 제공하는데 집중하고 있습니다^^

 

▼ 홈페이지 제작 및 문의▼