제조/기계/금속/소재
알파엔지니어링
  • #컴파운드 생산 시스템 설계 #연구개발
CLIENTS.
알파엔지니어링
DATE.
2022. 12. 19.
TYPE.
Responsive Web

제조/기계/금속/소재

알파엔지니어링 #컴파운드 생산 시스템 설계 #연구개발
제조/기계/금속/소재
알파엔지니어링
  • #컴파운드 생산 시스템 설계 #연구개발
CLIENTS.
알파엔지니어링
DATE.
2022. 12. 19.
TYPE.
Responsive Web
Device.

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

기획의도.

공장의 생산설비를 제조하는 전문 기업 알파엔지니어링의 제품을 강조하기위해
3D쇼룸을 메인에 배치한 후 해당 영역의 제품을 설명하는 컨텐츠를 기획하였습니다.

Design Concept.

사업영역의 큰 타이포만 노출시킨 후 마우스를 올렸을 때 효과를 구현하여
사용자의 궁금증과 흥미를 돋구어 지루하지 않도록 디자인하였습니다.
또한, 3D쇼룸에서는 각각의 제품들에 위치해있는 점(DOTS)들 가까이 마우스를
올리게 되면 제품의 아웃라인이 그려지면서 제품이 나타나도록 하였습니다.

Colors.
Typo.
Proposal Design.

두 타입 모두 곳곳에 알파엔지니어링의 로고 심볼을 활용하여 기업의 아이덴티티를 부각시켰습니다.
A시안은 톤다운된 컬러와 블루 색상을 활용하여 조금 더 깔끔하고 깨끗한 느낌이 나도록 하였으며,
B시안은 3D 쇼룸을 강조하고자 블루 색상을 백그라운드 컬러로 활용하였습니다.

  • A Type
  • B Type
Confirm Design.
Go Website
Sub Design.
Motion.

3D쇼룸의 영역을 설정하고 영역 하버 시 해당 제품만 강조되도록 모션을 구현하였으며,
서브페이지에서는 각 제품 클릭 시 해당 페이지로 이동되도록 모션을 구현하였습니다.

관련 프로젝트.
List