EC 이용시의 디바이스는 스마트폰이 약 8할 정도이므로 스마트폰의 UI에 대해 고찰한다

배경

올해 입사해 처음 안건을 안고도 디자이너와의 협의로 자신이 스마트폰으로 콘텐츠를 볼 기회가 너무 적다는 것을 안다. (9:1에서 PC를 사용하고 있습니다)

할 일

당사는 패션 EC 전문입니다.
그래서 패션 EC를 스마트 폰의 브라우저에서 오로지 열람하고 생각한 것을 씁니다.

주시할 점

이번은 이 2개에 한정합니다.

콘텐츠를 정확하게 탭할 수 있습니까?

htps : //에서 ゔぇぺぺr. 아 ぇ. 이 m/jp/데시 gn/치 ps/


실제로 업무에서도 탭의 영역이 분명히 부족한 곳이 있어 개선해 보았습니다.
엔지니어와 디자이너 사이에 디자인의 공통 인식이 있으면 커뮤니케이션도 원활해집니다.

브랜드 이미지

이번에는 주로 색채에 주목합니다.

이번에 고찰한 패션 EC 사이트

브랜드 이미지를 적게 알고있는 것이 좋기 때문에 평소 자신이 좋아하는 브랜드에서 선택했습니다. 1

YOHJI YAMAMOTO

h tps : /// ぇ 쇼삐 h지야마모토. jp/

Bshop

htps : ///s. b 쇼 p인 c. 코m/

좋았던 곳

햄버거 메뉴의 콘텐츠

햄버거 메뉴를 열면, YOHJI YAMAMOTO에서는 브랜드 일람이, Bshop에서는 WOMEN의 카테고리가 미리 전개하고 있었습니다.
이 브랜드는 어디를 가장 보고 싶은지 한눈에 알 수 있는 것이 좋습니다.

바닥글 콘텐츠가 크게 표시됩니다.

괜찮습니다. PC와 같은 표시 그대로의 사이트.
이번 고찰한 2사이트는 44px 이상 있어 밀기 쉬운 😆

색채

여기에서 꽤 주관이 들어가지만,
필자가 생각하는 YOHJI YAMAMOTO 의 이미지는 黒 , 袴 등입니다.
사이트 자체도 흑백으로 통일되어 있어 배너 등으로 흑백 이외의 색을 사용했다고 해도 채도를 떨어뜨리고 있습니다.

계속해서, Bshop의 이미지는 シンプル , ベーシック , 単色 등입니다.
이쪽도 이미지대로, 전체적으로 흑백으로 통일되고 있어 세련된 이미지를 줍니다.

고찰이 업무에 미치는 영향

디자이너와의 커뮤니케이션

필자가 아닙니다만, 디자인을 일으키는 단계부터 페어 프로와 같은 형태로 하고 있는 엔지니어와 디자이너도 있습니다. 실장시의 코스트 다운도 기대할 수 있을 것 같다.

특히 색에 대해서는 彩度, 明度

계측에 흥미가 솟아온다

하고 싶은 것은 많이 있습니다만 시간은 유한이네요..유효한 대책은 박는 곳에 꽂으면! 😏

정직, 나쁜 곳도 많이 찾아 버린다..

개선안도 포함해 필자는 팀의 slack에 コントラスト 라고 칭해 투고하고 있습니다. 팀의 누군가가 주워 주기도 하고, 가르쳐 주거나 논의가 깊어지는 일도 있으므로 추천입니다.

참고문헌

필자는 미니멀리스트를 자칭하고 옷은 거의 사지 않습니다. ↩