※ MAC 코리아 홈페이지 리뉴얼
※ 리뉴얼 주소 : http://beehoyoung.dothome.co.kr/mac_2
※ 원래 사이트 : https://www.maccosmetics.co.kr/
사용 스킬
DESIGN : Photoshop
CODING : HTML, HTML5, CSS, CSS3, JavaScript, JQuery
※ 제작 동기
MAC이라는 화장품 브랜드는 전 세계적으로 유명한 화장품 브랜드입니다.
우리나라에서는 모든 백화점의 1층에 자리잡고있는 외국 화장브랜드이며 특히 색조화장이 유명한 곳입니다.
가격대가 있는 화장품 브랜드이지만
처음 홈페이지를 들어갔을 때 어수선한 분위기에 배너와 제품 모든 것이 눈에 보이지않고
전체적으로 정신없다는 느낌을 받았습니다.
그래서 깔끔하게 변경해보고싶어 리뉴얼 해보게 되었습니다.
※ 문제점
배너들이 어수선하게 나열되어있었고,
탭 메뉴로 이동되는 섹션에서는, 아이템의 배열이 부족하다는 느낌을 받았습니다.
그리고 네비게이션 메뉴의 순서가 효율적이지 않다는 생각이 들었습니다.
※ 문제점 보완
전체적으로 어두운 느낌을 주어 고급스러움을 나타내었고,
메뉴는 서브메뉴를 한번에 볼 수있는 형식으로 변경하였습니다.
※ 홈페이지 설명
포토샵을 이용해 와이어프레임과 시안작업을 한후,
HTML로 레이아웃을 구성하였습니다.
메뉴는 제이쿼리를 이용하여 mouseover시 slideDown 되게 만들었고,
메인 매너는 bxslider Plug in을 통해 좌우 슬라이드가 될 수있게 하였습니다.
가운데 부분은 background를 fixed로 설정하여,
스크롤 되었을 때 고정시켜 전체적으로 어두운 분위기에 재미요소를 더해보았습니다.
'HOMEPAGE > PC WEB' 카테고리의 다른 글
인천도시공사 메인디자인 (0) | 2019.10.23 |
---|---|
SK wyverns 홈페이지 리뉴얼 (1) | 2018.10.05 |