brunch

You can make anything
by writing

C.S.Lewis

by 김예린 Sep 11. 2023

아이콘 디자인의 7가지 원칙

명확성, 가독성, 정렬, 간결성, 일관성, 개성, 사용의 용이성

*다음 아티클을 번역 및 요약한 내용입니다.


명확성(Clarity)

아이콘의 주요 목표는 개념을 빠르게 전달하는 것입니다. 아이콘이 가장 가장 성공적일 때는 특정 그룹의 사람들이 이해하기 쉬울 뿐만 아니라 문화, 연령, 배경 전반에 걸쳐 보편적일 경우입니다. 청중을 고려하고 그들과 공감하는 은유와 색상을 사용하세요.



가독성(Readability)

이해할 수 있는 상징을 정했다면 그것을 읽을 수 있는지 확인하세요. 여러 도형으로 작업할 때는 도형 사이에 충분한 공간을 두세요. 획이 가늘고 많을수록 아이콘이 더 복잡해지고 읽기가 더 어려워집니다.



정렬(Alignment)

각 아이콘의 균형이 잘 맞는지 확인하려면 해당 요소를 시각적으로 정렬하세요. 단순히 숫자를 신뢰하지 말고, 눈으로 작업을 확인하세요.



간결성(Brevity)

단 몇 단어로 잘 표현된 아이디어는 효율적이고 우아하게 느껴집니다. 우리는 작은 캔버스에서 작업하는 경우가 많기 때문에 아이콘 디자인에는 간결함이 적합합니다. 아이콘에 적절한 양의 디테일을 넣고 필요한 것 이상을 사용하지 마세요.



일관성(Consistency)

아이콘 패밀리의 조화를 위해 전체적으로 동일한 스타일 규칙을 유지하세요. 아이콘에는 채우기, 획 두께, 크기 및 모양과 같은 매개변수에 따라 결정되는 특정 시각적 무게(weight)가 있습니다. 세트 전체에서 이러한 매개변수를 동일하게 유지하면 일관성을 구축할 수 있습니다.



개성(Personality)

모든 아이콘 세트에는 고유한 특징이 있습니다. 무엇이 그것을 독특하게 만드나요? 브랜드에 대해 무엇을 말합니까? 어떤 분위기를 조성하나요?


Twitter의 아이콘은 부드럽고, 가볍고, 선명합니다.

Sketch의 아이콘은 섬세하고 경쾌합니다.

Freemoji는 귀엽고 사랑스럽습니다.



사용의 용이성(Ease of Use)

아이콘 세트는 완벽하게 그렸다고 완성되는 것이 아닙니다. 새로운 아이콘을 쉽게 만들고, 디자이너가 이를 디자인(스크린, 인쇄 등)에 사용하고, 엔지니어가 프로덕션에 코딩하는 것이 쉽도록 추가 테스트와 준비가 필요합니다.


정리(Organized) : 마스터 파일을 깨끗하게 유지하고 자산의 이름을 잘 지정하고 쉽게 찾을 수 있도록 배치하세요. 알파벳순, 크기별, 유형별 등 분류하는 가장 좋은 방법을 고려하세요.

기록(Well-Documented) : 아이콘 계열의 주요 원칙을 명확히 설명하고 기술적인 규칙을 나열해보세요.

테스트(Tested) : 일관성을 확인하세요. 아이콘이 상황에 맞게 적절한 크기로 작동하는지 확인하세요. 더 큰 시각적 시스템과 조화롭게 작용하는지 확인하세요. 아이콘을 서로 옆에 배치하는 것은 위의 원칙(명확성, 가독성, 정렬, 간결성, 일관성 및 개성)을 입증하는 데 도움이 됩니다.

맞춤형 도구(Custom Tools) : 아이콘 생성, 제작 및 사용을 용이하게 하는 도구를 구축해보세요.






작가의 이전글 소셜 네트워크의 피드를 설계하는 더 좋은 방법
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari