모든 디자이너가 알아야 할 최고의 UI/UX 디자인 팁과 요령 4

 

1. 크기와 시각적 단서를 사용하여 정보 차별화하기

UI 디자인에서 흔히 저지르는 실수는 모든 정보를 명확한 구분 없이 표시하여 단조로운 시각적 경험을 제공하는 것입니다. 이러한 경우 사용자는 정보를 구분하거나 우선순위를 정하는 데 어려움을 겪을 수 있습니다.

 

왼쪽의 디자인은 레이블:값 필드에 의존하고 있습니다. 이 방식이 효율적일 수 있지만 페이지의 모든 정보를 동일한 방식으로 표시하면 시각적 계층 구조가 부족해집니다. 따라서 사용자가 페이지를 스캔하여 중요한 정보를 식별하기가 어렵습니다.

글꼴 굵기, 글꼴 크기, 색상과 같은 서식 옵션과 아이콘과 같은 시각적 단서를 활용하면 사용자의 주의를 진정으로 중요한 정보로 유도할 수 있습니다.

 

 

2.아이콘의 일관성 유지

UI 디자인에서 흔히 발생하는 또 다른 오류는 아이콘의 일관성을 유지하지 않는 것입니다. 즉, 크기나 유형이 다른 아이콘이 섞여 있을 수 있습니다. 예를 들어, 한 아이콘은 단순하고 다른 아이콘은 매우 상세하거나, 한 화면에 윤곽선이 있는 아이콘과 채워진 아이콘이 있을 수 있습니다.

 

 

 

가장 좋은 방법은 미리 아이콘 스타일을 결정하고 모든 UI 화면에서 그 스타일을 고수하는 것입니다. 예를 들어 윤곽선이 있는 아이콘을 사용한다면 디자인 전체에 윤곽선이 있는 아이콘을 사용해야 합니다.

그렇다고 해서 규칙이 정해진 것은 아닙니다. 서로 다른 상태를 표시하는 등 다양한 아이콘 스타일을 혼합하는 것이 유리한 경우도 있습니다. 예를 들어 하단 탐색에서 선택한 탭에는 채워진 아이콘을 사용하고 다른 탭에는 윤곽선이 있는 아이콘을 사용할 수 있습니다. 이러한 미묘한 스타일의 변화는 사용자가 앱 내에서 자신의 현재 위치를 빠르게 파악할 수 있도록 도와주는 기능적인 목적에 부합합니다.

 

 

 

사용자 지정 아이콘 세트를 사용하는 것도 일관성을 유지하는 한 가지 방법입니다. 그러나 일관된 모양을 유지하기 위해 오픈 소스 아이콘을 UI에 사용하는 것도 충분히 허용됩니다. 다만 아이콘 세트가 전체 브랜드 이미지와 일치하는지, 속성이 다른 두 가지 아이콘 세트를 혼합하지 않는지 확인해야 합니다.

 

 

3. 카드 길이 일관성 유지하기

카드가 3개 이상인 레이아웃을 다룰 때는 모든 카드의 높이가 같은지 확인하세요. 이렇게 하면 보기에도 좋을 뿐만 아니라 사용자가 더 쉽고 간단하게 작업할 수 있습니다.

 

 

 

또한 제목과 설명의 길이도 같은 길이로 만드세요. 이렇게 하면 모든 카드의 높이를 동일하게 유지하여 디자인이 더욱 균형 있게 보입니다. UX 카피에 영향을 줄 수 있다면 모든 카드의 줄 수를 동일하게 유지하세요.

 

 

 

UX 카피를 제어할 수 없고 콘텐츠의 양이 다양하다면 어떻게 해야 할까요? 모든 카드의 높이를 동일하게 하되, 각 카드의 하단에 CTA 버튼을 정렬하고 가운데에 여분의 공간을 남겨두세요. 이렇게 하면 콘텐츠의 길이가 다양하더라도 균일한 느낌을 줄 수 있습니다.

 

 

 

출처:

https://medium.com/@uxpeak.com/top-ui-ux-design-tips-tricks-every-designer-should-know-part-6-bonus-2f36b80be192