게임 아이콘은 손톱만 한 공간에 아이템이나 스킬의 정체를 담아야 합니다. 플레이어는 인벤토리를 훑거나 전투 중 스킬을 누를 때 아이콘을 아주 짧게 보고 판단합니다. 그래서 아이콘은 예쁜 그림이기 전에 빨리 읽히는 신호여야 합니다. 이 글에서는 좋은 아이콘의 조건과 실제 제작 순서를 정리합니다.
좋은 아이콘의 조건
- 작게 줄여도 무엇인지 알아볼 수 있습니다.
- 실루엣이 분명하고 배경과 대비가 있습니다.
- 같은 세트 안에서 스타일, 시점, 광원 방향이 일정합니다.
- 비슷한 기능의 아이콘끼리는 공통점이, 다른 기능끼리는 차이가 있습니다.
아이콘 작업은 큰 캔버스에서 하지만 판단은 항상 실제 크기에서 합니다. 작업 중 실제 게임 화면 크기로 줄여 보는 미리보기 창을 따로 띄워 두는 것이 일반적입니다.
아이템 아이콘과 스킬 아이콘의 차이
| 구분 | 아이템 아이콘 | 스킬 아이콘 |
|---|---|---|
| 표현 대상 | 검, 물약, 재료처럼 실제 물건 | 불꽃, 보호막, 돌진처럼 효과나 행동 |
| 핵심 | 물건의 형태와 재질을 정확히 보여주기 | 효과의 성격과 속성을 상징적으로 보여주기 |
| 구성 | 물건 하나를 비스듬한 각도로 크게 배치 | 상징 형태와 빛, 색으로 구성 |
| 구분 요소 | 등급별 테두리, 배경색, 광택 | 속성별 색, 쿨타임 표시와의 조화 |
스킬 아이콘은 구체적인 그림보다 상징이 중요합니다. 방어 스킬은 방패 형태, 이동 스킬은 방향을 가리키는 선, 회복 스킬은 부드러운 빛처럼 기능을 떠올리게 하는 형태를 찾습니다.
작은 크기에서 읽히게 만드는 요령
아이콘을 작게 줄이면 가는 선과 미세한 디테일은 사라지고 큰 형태와 명도 대비만 남습니다. 그래서 처음부터 큰 형태 위주로 디자인하고, 디테일은 크게 볼 때 보너스로 보이는 정도로만 넣습니다.
- 물건을 칸 안에 넉넉하게 크게 채워 빈 공간을 줄입니다.
- 외곽에 어두운 테두리나 밝은 림라이트를 넣어 배경과 분리합니다.
- 물건을 대각선 방향으로 놓으면 같은 칸 안에서 더 크게 보입니다.
- 가장 중요한 부분(검이라면 칼날)에 가장 밝은 하이라이트를 둡니다.
얼마나 크게 채울지, 테두리를 얼마나 두껍게 할지는 게임 UI 프레임 모양과 슬롯 크기에 따라 달라집니다. 먼저 실제 슬롯 이미지 위에 놓고 테스트하며 정하는 것이 좋습니다.
명도 대비도 다시 확인합니다. 아이콘을 흑백으로 바꿨을 때 물건과 배경이 한 덩어리로 보인다면 작은 크기에서는 더 알아보기 어렵습니다. 물건이 밝으면 배경을 어둡게, 물건이 어두우면 배경을 밝게 두는 단순한 원칙만 지켜도 가독성이 크게 좋아집니다.
등급과 세트 표현
많은 게임이 아이템 등급을 색으로 구분합니다. 일반 등급은 무채색, 높은 등급으로 갈수록 화려한 색과 빛 효과를 쓰는 식입니다. 등급 색은 아이콘 그림 자체보다 테두리나 배경에 넣는 경우가 많아 같은 그림을 여러 등급에 재사용할 수 있습니다.
세트 아이템은 공통 문양이나 색을 반복해 같은 묶음이라는 것을 알려줍니다. 수십, 수백 개의 아이콘을 만들어야 하므로 처음에 시점, 광원, 테두리 두께, 배경 처리 같은 규칙을 문서로 정리해 두면 여러 사람이 나눠 작업해도 일관성이 유지됩니다.
아이콘 제작 순서
- 기획 문서에서 아이템의 이름, 기능, 등급을 확인합니다.
- 작은 크기로 실루엣 썸네일을 여러 개 그려 가장 잘 읽히는 형태를 고릅니다.
- 세트 규칙에 맞춰 시점과 광원을 정하고 형태를 다듬습니다.
- 고유색과 명암을 칠하고 재질을 표현합니다.
- 실제 크기로 줄여 가독성을 점검하고 필요하면 대비를 더 올립니다.
- 게임 UI 프레임에 넣어 다른 아이콘과 나란히 비교합니다.
아이콘과 UI 디자인의 관계
아이콘은 단독으로 보이지 않고 항상 버튼, 슬롯, 툴팁 같은 UI 안에 들어갑니다. 그래서 아이콘 디자이너는 UI 전체의 색과 분위기를 함께 고려해야 합니다. 게임UIUX 과정에서는 기존 게임 UI 분석, 모작, 창작 UI 제작을 거치며 아이콘이 포함된 화면 구성을 연습할 수 있습니다.
자주 묻는 질문
아이콘은 어떤 툴로 만드나요?
대부분 포토샵 같은 2D 그래픽 툴로 그립니다. 경우에 따라 3D 모델을 렌더링한 뒤 그 위에 덧그리기도 합니다.
아이콘 포트폴리오는 어떻게 구성하나요?
한 세트를 같은 규칙으로 여러 개 만들어 나란히 보여주는 것이 좋습니다. 실제 크기로 줄인 모습과 UI에 넣은 모습을 함께 보여주면 실무 감각이 드러납니다.
