brunch

매거진 UI UX 소식

You can make anything
by writing

C.S.Lewis

by UX 컨설턴트 전민수 Oct 07. 2024

[UX#25] 아이콘 설계 UX 가이드라인 9가지

Anthony의 9 Guidelines for Clear and Intuitive Icons 소개하고자 합니다.


아이콘 설계 UX 가이드라인 9가지
(요약문)


아이콘 디자인에서의 주요 원칙들은 사용자 경험을 극대화하고, 명확하고 직관적인 인터페이스를 제공하는 데 필수적입니다.


원칙 1. 공간이 제한되지 않았다면 아이콘에 레이블을 붙인다.
사용자가 아이콘의 기능을 즉시 이해할 수 있도록 레이블을 추가하면 직관성과 사용자 경험이 향상됩니다. 레이블은 오작동을 줄이고 접근성을 높이며, 일관성을 유지하는 데도 도움이 됩니다. 그러나 공간이 제한된 경우에는 레이블 사용이 어려우며, 모바일 환경에서는 툴팁을 사용할 수 없다는 점을 고려해야 합니다.


원칙 2. 아이콘은 행동과 대상을 모두 보여준다.
아이콘이 명확한 행동과 대상을 포함하면 사용자가 그 기능을 쉽게 이해할 수 있습니다. 이는 직관적인 경험을 제공하고, 일관성을 높이며, 다양한 사용자에게 접근성을 제공합니다.


원칙 3. 비슷한 아이콘끼리 묶는다.
유사한 기능을 가진 아이콘을 그룹화하면 사용자가 필요한 옵션을 쉽게 찾을 수 있으며, 각 그룹에 레이블을 붙이면 기능 이해가 더욱 명확해집니다. 이는 정보의 구조화와 시각적 정리를 통해 사용자 경험을 향상시킵니다.


원칙 4. 아이콘 순서와 배치에 일관성을 지킨다.
아이콘의 위치와 배치는 사용자가 기능을 이해하는 데 중요한 요소입니다. 연구에 따르면 아이콘의 위치 변화는 사용자를 혼란스럽게 할 수 있으며, 일관된 위치를 유지하는 것이 중요합니다.


원칙 5.
아이콘에는 일반적인 비주얼 모티프를 사용한다. 공통된 비주얼 모티프는 사용자에게 기능 간의 관계를 명확하게 전달하고, 브랜드 아이덴티티를 강화하는 데 기여합니다. 일관된 디자인은 사용자가 탐색할 때 인지적 부담을 줄입니다.


원칙 6: 일반적인 비주얼 모티프를 공유하는 아이콘은 느낌과 모양이 더 비슷하게 느껴진다. 명확한 액션을 사용하는 것이 중요하며, 추상적인 액션은 사용자가 혼란스러워할 수 있습니다. 이를 피하기 위해 아이콘에 명확한 대상과 행동을 결합하는 것이 좋습니다.


원칙 7. 지나치게 비유적인 아이콘 이미지 사용은 피한다.
비유적 이미지는 사용자가 이해하기 어려울 수 있으며, 다양한 해석을 초래할 수 있습니다. 이는 아이콘의 기능을 잘못 인식하게 만들어 사용자 경험을 저하시킬 수 있습니다.


원칙 8. 아이콘에 너무 많은 디테일을 주는 것은 피한다.
과도한 디테일은 아이콘의 직관성을 저하시킬 수 있으며, 사용자에게 혼란을 초래합니다. 간결한 디자인은 사용자가 아이콘을 쉽게 인식하고 기억할 수 있도록 돕습니다.


원칙 9. 작은 아이콘에서는 3D 모양은 피한다.
작은 아이콘에 3D 효과를 주면 흐릿하고 헷갈려 보일 수 있습니다. 대신 평평한 디자인을 사용하여 아이콘이 명확하게 인식되도록 해야 합니다.



결론적으로, 아이콘은 사용자 인터페이스에서 중요한 역할을 하며, 명확하고 직관적이지 않으면 사용자에게 혼란을 초래할 수 있습니다. 위의 9가지 원칙을 따르면 효과적인 아이콘 디자인을 할 수 있습니다. 그러나 이러한 가이드라인에 국한되지 않고, 필요에 따라 유연하게 적용하는 것이 중요합니다.




위글은 요약문입니다.


이 글에 대한 전체 번역 원문(구체적인 사례 등)은 아래 링크를 클릭해주세요~

https://maily.so/uiux/posts/c15fc036


매거진의 이전글 [UX#24]드롭다운 메뉴와 세그먼티드 버튼 UX 원칙
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari