반려동물에게 줄 수 있는 최고의 선물 "꼬띠샵"

 

안녕하세요. 알씨타운 입니다.

혹시 반려동물과 함께 생활하고 계시는가요?

맥스 본, 펫 소 시크, 밀크 앤 페퍼 3개 브랜드의 한국 공식 수입사인 꼬띠샵을 아시나요.

마스코트 꼬띠가 홍보하고 있는 애견 전문 몰입니다.

맥스 본은 비욘세, 기네스 펠트로 등의 할리우드 스타의 사랑을 받고 있고,

펫 소 시크의 경우는 명품 브랜드 출신 디자이너가 상품 제작에 참여했다고 해요.

​

반려동물의 시각에서 바라본 좋은 디자인을 더 많은 반려인과 나누고 싶어 탄생하게 되었다고 합니다.

​

귀여운 마스코트 꼬띠가 있는 꼬띠 숍 둘러볼까요?

​

​

https://cotieshop.co.kr/

 

​

사용 폰트와 색상

 

사용 폰트는 3가지이며 주력 색상들은 블랙 흰색 회색 베이지 차분한 계열의 색상을 사용하였고

포인트 컬러로 밝은 노란색을 사용하였습니다.

사이트가 전체적으로 고급스러움을 추구하는 느낌을 받았는데

차분한 색상과 잘 어울리는 느낌이었습니다.

​

​

접속화면

메인 접속 화면입니다.

처음 접속 시에 메인 이미지를 회전시키면서 나타나는 애니메이션을 주었고

이미지 자체는 번갈아 가면서 바꾸는 것이 아닌 webm으로 보여주고 있습니다.

**WebM 비디오 파일입니다. MKV 파일 확장자를 사용하는 동일한 비디오 형식을 기반으로 합니다.

​

보통 슬라이더를 넣어 상품을 노출하는데 꼬띠는 귀여운 캐릭터가 반겨 주었습니다.

사이트를 접속하자마자 귀여움이 넘쳐났습니다.

 

​

내비게이션

여유 있는 배치를 보여주고 있습니다. 쇼핑몰치고는 매우 간결한 내용을 가지고 있습니다.

하위 메뉴도 Brands, Outdoor, Indoor 세 가지 메뉴만 가지고 있습니다.

각 메뉴는 호버 될 때 메뉴 글자 상위에 점이 찍히는 애니메이션을 보여주었습니다.

간단한 점 하나만 보여주는 애니메이션인데 이것도 귀여워 보였답니다.

사이트가 주는 전체적인 느낌 때문인 듯합니다.

​

아래쪽으로 스크롤이 되면 상위 내비게이션을 숨기고

위로 스크롤이 되면 내비게이션을 보여주는 형식으로 구성되어 있습니다.

​

보이는 이미지에 신경을 쓴 사이트답게 최대한 넓은 화면으로 사이트를 보여주려고 하고 있습니다.

 

​

브랜드 페이지

브랜드 페이지에서 쓰인 강아지는 gif 파일을 사용하였습니다.

애니메이션과 실제 제품을 혼합하여 평범하지 않은 느낌을 내고 있습니다.

버튼 클릭으로 상세페이지 이동이 가능합니다.

​

하단의 보이는 풀 이미지는 특이하게도 브랜드 섹션이 아닌 다음 섹션에 있는 이미지를

강제로 위로 올려서 보여주었네요

​

​

메인 브랜드

메인 브랜드의 첫 번째입니다.

제품 디자인과 제작 과정을 동영상으로 담고 있습니다.

​

동영상 부분에 마우스가 호버 되면 플러스 버튼이 활성화돼 화면을 눌러야 한다는 점을 보여주고 있습니다.

동영상을 클릭하면 동영상 플레이 화면이 모달 팝업 형식으로 떠서 보기 쉽게 만들었습니다.

강아지가 매우 귀엽습니다.

​

​

​

메인 브랜드의 두 번째 페이지입니다.

여기도 역시 gif를 이용하여 움직이는 듯한 표현을 했습니다.

​

버튼 클릭으로 상세페이지 이동이 가능합니다.

​

이하 하위 페이지도 모두 같은 형식으로 이루어져 있습니다.

​

신상품

신상품 메뉴입니다.

슬라이더 형식으로 만들어졌고 이미지에 호버 시 제품 이미지를 상세하게 보여주고 있습니다.

섹션을 크게 배치해 상품의 집중도를 높였습니다.

​

일반 쇼핑몰 같은 경우는 상품이 워낙 많기 때문에 상품을 보기 좀 어렵다는 느낌을 받을 수 있는데.

꼬디샵의 경우는 상품을 보여주는 것보다 브랜드 이미지에 집중한다고 느꼈습니다.

​

상세페이지로 넘어가면 상품 노출을 합니다.

상세페이지에서도 여유 있는 레이아웃을 볼 수 있습니다.

​

​

로딩 페이지

로딩 페이지입니다.

사이트가 느리거나 로딩이 오래 걸리는 건 아니지만, 로딩 페이지를 넣었습니다.

잠깐잠깐 클릭하면서 넘어가는데도 귀여움이 보였습니다.

​

이미지 처리, 로딩 페이지 등을 보셔도 이미 아시겠지만

사이트가 전체적으로 재미 요소와 귀여운 요소를 많이 담아냈습니다.

​

​

마우스 커서들입니다. 실제로 들어가서 보시면 이것보다 더 많은 커서를 보실 수 있습니다.

클릭할 때마다 다른 커서를 보는 재미도 있었습니다.

​

​

​

​

​

꼬띠샵의 경우는 상품을 노출하기보단 브랜드 가치와 왜 꼬띠여야 하는가에 대한 것에

집중한 모습을 보여줍니다. 물론 상품 페이지가 없는 건 아닙니다.

네이버 스마트 스토어를 따로 사용하고 있습니다.

: )

​

​

다른 페이지들도 메인 페이지와 다르지 않은 구성으로 만들어졌습니다.

개발자 도구를 눌렀을 때 콘솔 창에 강아지 이미지가 뜨는 것도 매우 재미있었습니다.

​

꼬띠샵 어떠셨나요.

매우 귀여운 사이트죠?

귀여운 꼬띠 보러 한 번쯤 방문해 보시는 건 어떠신가요?

​

​

​

여기까지 알씨타운이었습니다.

긴 글 읽어주셔서 감사합니다

: )

​