본문 바로가기
포트폴리오[기업]

[(주)지엘] 성공적인 기업 홈페이지 구축을 위한 "매스티지"의 전략적 접근 -반응형리뉴얼 사례 분석

by (주)매스티지 2024. 7. 12.

안녕하세요!

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

 


오늘은 국내 최초 붙이는 핫팩을 생산한, 사람을 따뜻하게 하는 회사

주식회사 지엘 반응형 홈페이지 리뉴얼 사례를 소개해보겠습니다.


 


 
 

 

주식회사 지엘국내 최초 붙이는 핫팩을 생산하는 제조기업입니다.

건강한 사람, 회사 사회를 만들어 가는 비젼을 가진 사람들이 모여,

이웃과 사회에 봉사하겠다는 마음으로 설립되었습니다.

온열치료요법에 필요한 핫팩제품의 글로벌한 회사를 지향하며

새로운 기능의 제품을 개발하기 위해 끊임없이 노력하고 혁신하고 있습니다.

항상 새로운 목표에 도전하며 새로운 성장을 위해 연구하는 기업입니다.


메인페이지

 

 

 

지엘 메인 홈페이지입니다.

핫팩이 주식회사 지엘에 가장 큰 메인 사업상품이기 때문에

제품이 잘 표현되고 소개되어야 합니다.

핫팩을 주로 추운 겨울에 많이 사용하기 때문에

전체적인 백그라운드 이미지로 겨울, 눈, 화이트 계열

사진 및 소스를 활용하여 레이아웃을 제작했습니다.

핫팩, 손난로는 남녀노소 할 것 없이 모두가 알고 있고,

사용하기 때문에 제품에 대한 장대한 설명보다 제품의 비주얼 디자인이 명확하게

노출될 수 있도록 제품 이미지를 확대해서 콘텐츠로 제작했습니다.

홈페이지를 접속한 유저들이 첫 화면을 보자마자 추운 겨울이 생각나고

기업의 브랜드와 제품이 바로 머릿속으로 떠오르를 수 있도록

고객의 니즈에 맞춰 디자인했습니다.

 


컬러사용

 

 

무채색의 화이트 컬러를 사용하여 백그라운드로 제작해 추운 겨울,

눈의 이미지를 떠올릴 수 있게 만들었으며 춥고 차가운 느낌을 상징하는

블루 컬러를 사용해 마우스 오버효과나 콘텐츠내 디자인적 요소포인트 컬러로 활용했습니다.

 


메인비주얼

 
 

 

홈페이지 메인 비주얼입니다.

기업의 제품이 잘 홍보되도록 넓고 와이드한 비주얼 화면으로 규격을 잡았고

슬라이드 형식의 스크립트를 활용한 총 3Page의 비주얼 이미지로 구성했습니다.

웹표준을 준수하기 위해서 좌우 슬라이드 버튼과 하단 페이지탭을 만들었으며

클릭하여 직접 비주얼 페이지를 변경할 수 있습니다.

핫팩이 생각나는 추운 겨울 이미지 기업의 슬로건 문구를 중앙에 배치,

기업의 대표상품을 제품의 장점과 함께 소개하는 배너를 만들어 비주얼 이미지를 만들었습니다.

 


상단 GNB영역

 
 

 

상단 GNB입니다.

좌측부터 로고, 내비게이션 메뉴, 다국어 홈페이지로 구성했습니다.

페이지 이동, 마우스 스크롤에 상관없이 GNB 영역이 상단에 상시 고정되기 때문에

홈페이지를 이용하는 유저에게 높은 편의성을 제공합니다.

내비게이션 메뉴에 마우스를 올리면 홈페이지 전체메뉴가 드롭다운되어 펼쳐집니다.

서브메뉴에 마우스를 올리면 포인트 컬러의 바가 좌우로 길게 펼쳐지는

애니메이션 스크립트 효과유저가 쉽고 명확하게 인지할 수 있습니다.

하위뎁스의 메뉴에 마우스를 올리면 포인트 컬러베리에이션됩니다.

 


다국어 홈페이지 제작

 

 

주식회사 지엘핫팩 제품은 최신 전자동 설비로

완벽한 품질을 자랑해 국내 최대 생산량을 가지고 있습니다.

국내뿐만 아니라 해외시장에서도 각광을 받고 있기 때문에

해외사업을 위해 다국어 홈페이지로 제작했습니다.

GNB 우측 KOR/ENG 버튼을 클릭해 국문/영문 홈페이지로 이동이 가능합니다.

 


 

 

 

기업 제품의 차별성을 소개하는 콘텐츠입니다.

하얀 눈으로 뒤덮인 배경의 이미지를 백그라운드로 활용해 배치시켰고

기업의 핫팩의 장점과 차별성을 심플한 레이아웃과 아이콘으로 구성해 제작했습니다.

포인트 컬러를 활용해 아이콘에 포인트를 적용시켰으며

하단 Snow 버튼을 클릭하면 기업 브랜드에 대한 자세한

소개내용을 파악할 수 있는 상세페이지로 이동합니다.

 


기업제품

 

 

 

 

기업제품 소개 섹션입니다.

기업이 만들고 판매하는 상품이 잘 보여지도록 심플한 그레이색을 활용해

백그라운드를 구성했고 위에 상품들을 슬라이드 형식의 레이아웃으로 제작해 노출시켰습니다.

좌우 버튼을 클릭하거나 콘텐츠에 마우스 드래그를 통해 제품들을 살펴볼 수 있습니다.

제품을 클릭하면 자세한 정보를 확인할 수 있는 상세페이지로 이동합니다.

 


서브페이지

 

 

회사소개 브랜드 서브페이지입니다.

상단에 서브페이지 비주얼 이미지를 제작했고 하단에 하위 메뉴 탭을 만들어

페이지내 이동을 빠르게 할 수 있도록 구성했습니다.

기업의 브랜드, 비전, 가치의 내용들이 고객들에게 잘 전달될 수 있도록

심플하고 간결한 레이아웃을 사용해 제작했습니다.

포인트 컬러를 활용해 블릿, 텍스트 강조 등에 사용했습니다.

설명과 잘 어울리는 고화질의 이미지를 사용해 유저가 쉽게 이해할 수 있도록 만들었습니다.

 


 

 
 

 

 

제품소개 서브페이지입니다.

주식회사 지엘이 만드는 다양한 온열제품을 살펴볼 수 있는 페이지로 각 제품의 용도를 카테고리별로 나누어 하위 메뉴로 만들었습니다.카테고리 페이지를 클릭해 원하는 제품을 빠르게 찾아볼 수 있습니다.

제품을 클릭하면 자세한 내용을 확인할 수 있는 상세페이지로 이동합니다. 해당 제품의 구성요소, 재질, 기능, 효과 등 자세한 정보를 전달해야 하기 때문에 온라인 쇼핑몰과 같이 긴 상세페이지의 레이아웃으로 제작했습니다.

 


반응형 리뉴얼

 

 

 

주식회사 지엘 제품을 언제 어디서든 살펴보고 구매할 수 있도록

모바일에 최적화된 반응형 홈페이지로 제작했습니다.

제조기업의 마케팅은 홈페이지를 제작을 통해 하는 것이 가장 효율적이고

높은 효과를 만들어낼 수 있는데, 홈페이지에 많은 고객 유입과 접근성을 위해

기업의 반응형웹 제작은 선택이 아닌 필수 요소입니다.

기업의 브랜드와 아이덴티티를 부각시키면서

클라이언트와의 끊임없는 커뮤니케이션과 피드백을 통해 제작된

매스티지반응형 홈페이지높은 웹접근성과 웹표준을 준수한

완성도 높은 홈페이지로 만들어집니다.

데스크탑 뿐만 아니라 노트북, 태블릿, 스마트폰 등

다양한 디바이스 화면에서 각 해상도에 맞는 쾌적하고 가독성 높은 화면 구현으로

유저들이 사용친화적인 인터페이스를 경험할 수 있습니다.

 

20년의 노하우로 고객의 니즈를 정확하게 파악하고,
먼저 제시하는 기획중심 홈페이지 제작 매스티지가 귀하와 함께 하겠습니다.



홈페이지 제작 및 문의