럭셔리 스킨 케어 화장품 브랜드
디 아트셀
Art:Cell
- WordPress
- Responsive Web
- Server Setting
- Maintenance
럭셔리 스킨 케어 화장품 ‘디 아트셀(Art:Cell)’ 브랜드 웹사이트 제작.
진귀한 성분과 진보적인 피부과학의 고급 브랜드를 지향하는 ‘디 아트셀(Art:Cell)’ 브랜드 웹사이트는 워드프레스를 기반으로 원 페이지(One Page) 스타일의 네비게이션 메뉴 커스터마이징과 풍부한 애니메이션 및 인터랙션을 가미하여 화려하고 고급스러운 디자인의 웹사이트를 목표로 제작 하였습니다.
– Full Screen Landing Page –
원 페이지(One Page) 스타일은 제품 품목이 많지 않은 브랜드에 적합한 트렌디한 웹사이트 스타일 입니다. ‘디 아트셀(Art:Cell)’ 브랜드 웹사이트는 그러한 원 페이지 방식으로 구현되었으며, 사이트 전반에 다양한 애니메이션과 인터랙션을 적용하였습니다.
특히 인트로에 해당하는 랜딩페이지에는 배경의 그라데이션 컬러 변화 효과와 인터랙티브한 움직임의 파티클 효과를 적용하여 화려하고 고급스러운 브랜드 아이덴티티를 구현하는데에 주력하였습니다.
– Brand Page –
랜딩페이지에서 ‘디 아트셀(Art:Cell)’ 브랜드의 아이덴티티는 입자들을 모티브로 하는 애니메이션 요소들을 통해 표현하였으며, 이 모티브는 브랜드 단락에서도 디자인 및 애니메이션과 호버(Hover) 인터랙션 요소들에 적용하여 웹사이트 전체적으로 통일감 있는 아이덴티티를 구축하는 디자인을 의도했습니다.
또한, 브랜드 단락에서는 타이틀, 서브 카피, B.I 등의 구성 요소들이 페이지 스크롤시 순차적으로 나타나는 애니메이션을 적용하여 내용을 강조하는 효과를 의도했습니다.
– Products –
‘디 아트셀(Art:Cell)’ 브랜드 웹사이트는 전반적으로 어두운 톤의 그라디언트 배경을 기반으로 자연스러운 배경 컬러 변화 애니메이션과 호버(Hover) 효과로 강조되는 컬러 변화 효과를 사이트의 아이덴티티로 구성하였습니다.
랜딩페이지에 비해 간결하게 디자인된 제품 단락에서도 마찬가지로 호버(Hover)시 컬러 변화 효과를 적용하였으며, 마우스의 움직임에 따라 홀로그램 느낌을 주는 배경 이미지로 디테일을 살리고자 했습니다.
또한, ‘상세 보기’ 버튼 클릭시 오버랩 되어 나타나는 제품 상세페이지로 간결하고 감각적인 스타일의 원 페이지(One Page) 스타일 웹사이트를 구현하고자 했습니다.