제조/기계/금속/소재
하이윈
  • #모션컨트롤 #시스템테크놀로지
CLIENTS.
하이윈
DATE.
2024.10.08
TYPE.
Responsive Web
제작중

제조/기계/금속/소재

하이윈 #모션컨트롤 #시스템테크놀로지
제조/기계/금속/소재
하이윈
  • #모션컨트롤 #시스템테크놀로지
CLIENTS.
하이윈
DATE.
2024.10.08
TYPE.
Responsive Web
Device.

디스플레이 종류에 따라 화면의 크기가 자동으로 최적화되도록 조절되는 반응형 웹으로 제작되었습니다.

Design Concept.

하이윈의 시그니처 컬러인 그린 컬러와
그에 어울리는 컬러를 바리에이션하여
기업의 아이덴티티를 부각시켰으며,
기업의 기술력과 전문성을 강조하기 위해
깔끔하고 심플한 룩앤필로 작업하였습니다.

Proposal Design.

A타입은 고객사의 니즈를 적극적으로 반영하여 작업한 타입으로
비주얼에는 사업의 정체성을 대표할 수 있는 영상을 풀영역으로 배치하여 신뢰감과 전문성을 돋보이게 하였으며
제품군은 한눈에 보일 수 있는 레이아웃을 선정하였습니다.
또한 퍼스널 컬러를 활용하여 아이덴티티를 심어주었으며
하단 문의하기에는 배경에 고퀄리티 영상을 활용하여 전문성을 부각시켜보았습니다.
B타입은 최신 웹 트렌드를 반영하여 제안하는 타입으로
곳곳에 인터렉티브한 모션을 구현하여 전체적으로 역동감을 주었습니다.
인트로 영역과 비주얼 영역에 제품을 바로 노출시켜 기업의 정체성과 신뢰감을 부각시켰으며
콘텐츠에 기울기를 활용한 레이아웃 기법과 모션 기법을 적용함과 동시에
얇은 라인 요소를 활용하여 디자인 디테일을 주어 기업의 전문성과 기술력을 돋보이게 하였습니다.

  • A Type
  • B Type
Confirm Design.
Motion.

스크롤 시 하이윈의 제품 이미지가 자연스럽게 플립되도록 구현하였으며,
영역이 고정된 채로 이미지와 텍스트가 변경되는 모션을 구현하여 사용자의 몰입감을 더해주었습니다.

관련 프로젝트.