[디자인카타 4주차 화요일]리스트 컴포넌트 분리

리스트 컴포넌트 분리 어떤 유형을 선호하시나요? | 디자이너스

리스트 컴포넌트 분리 어떤 유형을 선호하시나요? | 디자이너스

 

왼쪽이 A 오른쪽이 B다

 

이번 디자인 카타 토픽은 리스트 컴포넌트 분리 중 구분선 유형과 여백유형 중 어떤 디자인을 선호하는지 토론하는 시간이다. A은 섹션마다 구분선을 넣어 분리했고 B같은 경우 여백을 활용한 컴포넌트 분리를 진행했다.

나는 B를 선호 하는데 다음과 같다.

오버플로우 차트인 경우 화면을 스크롤 하면서 볼 때 구분선이 시각적으로 방해요소가 되기 때문

근접성의 원리와 유사성의 원리를 잘 활용한다면 구분선이 없어도 충분이 구간을 나눠서 표현할 수 있다고 생각하기 때문이다

다른 조원들도 비슷한 생각으로 B를 골랐으며

리스트 안 요소들의 통일로 같은 내용이 들어 있다는 것을 바로 알 수 있을 때시각적으로 미니멀하게 표현하고 싶을 때

카드 UI 같이 이미 디바이더의 역할을 하는 UI이가 반복적인 리스트의 경우에  B를 쓴다는 조원분의 말씀이 인상깊었다. 

이번 투표율은 작성기준 A는 41%(575명), B는 58%(806명)으로 이전 디자인 카타와 달리 비등비등한 투표율을 보여주고있다. 두 디자인 모두 여러 UI에서 사용하고 있다 구글 플레이 앱스토어의 어플 리뷰에선 여백을 활용한 디자인을 쓰고 네이버 웹툰 댓글 창같은 경우 구분선을 이용해 리스트를 분리 하고 있었디. 이번 디자인 카타를 통해 내가 만들 UI의 사용목적에 맞게 디자인을 고려할 수 있는것 같다.