알씨타운
'위드 뮤' 모바일 웹 리뷰 본문
안녕하세요 :) 알씨타운입니다.
요즘에 k-culture라는 단어를 많이들 들어보셨으리라 생각합니다.
kpop의 세계적인 대중성을 가지게 되면서
kpop 굿즈상품 md상품이 선풍적인 인기를 가지게 되었습니다.
그래서 오늘 준비한 리뷰는
사이트 컨셉
메인페이지
메인페이지를 보시면 세 가지의
버전의 화면을 볼 수가 있습니다.
pc / 1280px / 768px 버전의
반응형 처리를 했습니다. 저희는 모바일 웹을 분석하기 앞서
pc와 모바일의 차이점을 짚어보고 가려고 합니다.
pc버전에는 scroll 이벤트가 중요한 포인트 입니다.
스크롤 되면서
1. 모바일 로고로 변경
2. 왼쪽 하단 패밀리 사이트 버튼 작아짐
3. 번역 버튼 사라짐
4. 오른쪽 하단 sns버튼 사라짐
이 특징적으로 보입니다.
모바일에서는 nav 버튼이 하단으로
내려오게 되고
왼쪽에 있던 카테고리들이 사라져
햄버거 메뉴 안에서 선택할 수 있도록 변경되었습니다.
아이콘의 통일성을 위해서
아이콘을 디자인한 것도 돋보이네요!
검색
검색 버튼을 누르면
페이지 이동이 아닌 검색 말풍선 디자인 효과가
적용되어있습니다.
border-radius로 부드러운 느낌을
강조한 디자인으로 보입니다.
햄버거메뉴
pc에서도 노출이 되지만, 모바일 상태에서는
왼쪽에 카테고리가 노출되지 않기 때문에
햄버거 메뉴 버튼을 반드시 사용해야 합니다.
highlight를 적절히 사용하여
활성화된 페이지를 강조하는 디자인 통일성이 보입니다.
상품목록
pc 버전에서는 왼쪽에 카테고리가 노출되고
필터는 fixed되어 오른쪽에 노출되어 있는데
모바일 버전에서는 반응형 처리가 되어
필터가 상단 왼쪽에 노출되는 모습을 볼 수 있습니다.
모바일 버전 상품 목록의
font-size는 가장 큰 폰트가 15px
가장 작은 폰트가 13px로
큰 차이가 도드라지지 않지만,
포인트 컬러를 적절히 사용하여 시각적인 차이를 주어
가지런히 정렬되어있는 모습으로 보입니다.
이용안내 페이지
버튼 활성화를 포인트 컬러로 적절히 표현하여
해당 버튼을 클릭했을 때,
상단의 이미지처럼
contents의 상단선을 기준으로 scroll-top으로 이동하게되어
바로 contents를 볼 수 있는 형태로 되어있습니다.
적절하게 포인트 색상을 사용하고,
통일성 있는 디자인으로
다소, 산만할 수 있는 색감에도
조화로운 느낌을 주는 홈페이지로 느껴졌습니다.
이상 알씨타운이었습니다. :)
'RCTOWN 리뷰 > 웹 리뷰' 카테고리의 다른 글
| '샌드박스' 모바일 웹 리뷰 (0) | 2022.08.02 |
|---|---|
| 반려동물에게 줄 수 있는 최고의 선물 "꼬띠샵" (0) | 2022.07.21 |
| '롯데 ON' 모바일 웹 리뷰 (0) | 2022.07.07 |
| 교원 투어, 여행 전문 브랜드 '여행이지' (0) | 2022.06.23 |
| 컴퓨터와 게임의 역사 속으로 ‘넥슨 컴퓨터 박물관’ (0) | 2022.05.16 |
