본문 바로가기
UX 디자인/아이콘 디자인

ico 파일 포토샵에서 열기, ico 패키지 파일 만들기, ico 편집 프로그램 소개, ico 비트 수 설정하기

반응형

파비콘이나 윈도우 프로그램용 아이콘을 만들 때는 ICO 포맷의 파일 제작이 필요합니다. ICO 포맷의 경우 전용 에디팅 프로그램이 딱히 없는 실정인데요. 이를 포토샵에서 편집하고, 또 ICO파일의 특성인 패키징 파일(하나의 파일에 여러 개의 ICO 파일이 있는 경우)를 위해서는 별도의 프로그램 활용이 필요합니다.


포토샵으로 ICO파일 열기

1. ICO FORMAT(포토샵용 ico 파일 플러그인)을 텔레그래픽스 홈페이지에서 다운 받습니다.

* 다운로드 URL : http://www.telegraphics.com.au/sw/product/ICOFormat

* 32비트, 64비트 및 7 이상용을 잘 구분하여 자신에게 맞는 운영체제의 파일을 다운 받도록 합니다.


2. 포토샵이 설치된 디렉토리의 plug-ins 폴더에 해당 파일을 위치시킵니다.

* Files\Adobe\Adobe Photoshop CS4 (64 Bit)\Plug-ins



3. 포토샵을 실행합니다. ICO파일로 열고, 저장할 수 있음을 확인할 수 있습니다.


ICOBUNDL 프로그램으로 ICO 패키지 파일 만들기

1. icobundle 프로그램을 다운받아서 영어로만 된 경로에 위치 시킵니다. * 다운로드 URL : http://www.telegraphics.com.au/sw/product/ICOBundle#icobundle

2. '윈도우+R'로 CMD창 실행(윈도우 기준) 3. "cd 'icobundle 설치 경로'"를 입력해서 설치된 경로로 이동합니다. * cd : change directory (경로 변경) 4. icobundle 설치 장소에 합치려는 ico 파일들을 넣습니다. - 같은 타입의 ico만 사이즈 별로 다르게 있어야 합니다.

- 다른 종류의 여러 ico 파일을 합치려면 같은 타입 별로 따로따로 이동시켜서 합치기를 진행해야 합니다.


5. cmd 창에서 "icobundl -o combined.ico *.ico"를 입력합니다.

- 사용법 안내 URL : http://www.telegraphics.com.au/sw/product/ICOBundle#icobundle

*icocheck의 경우 ico파일이 몇 개의 파일로 구성되어 있는지 몇 비트컬러인지 확인할 때 사용 6. 합쳐졌다는 내용을 확인하고, 합쳐진 파일 또한 확인합니다.


웹컨버터를 활용해서 ICO 패키지 파일 만들기

위 프로그램을 활용하는 방법 외에 웹컨버터를 이용하는 방법이 있습니다. 빠르게 작업이 가능하지만 XP 호환성이 떨어질 염려가 있으니 작업에 참고하시기 바랍니다.



1. 아이코컨버트 웹사이트에 접속한다.

- 프로그램 URL : http://icoconvert.com/


2. 변환하고자 하는 PNG들을 업로드 후 변환한다.

* ICO패키지 제작 외에도, 단일 PNG파일의 ICO컨버팅도 가능하며 이 경우 세세한 호환성 조정 또한 가능합니다.(이 경우 XP호환 설정 가능)



※ 제품 제작사 및 다운로드 출처 1 : 텔레그래픽스, http://www.telegraphics.com.au

※ 제품 제작사 및 다운로드 출처 2 : 아이코컨버트, http://icoconvert.com/


[내용추가(161016)] 아이콘 편집 프로그램

가장 널리 사용되는 ICON 제작 프로그램으로는 Axialis 사의 IconWorkshop이 있다고 합니다. 정식 버전은 당연히 유료로 구매해야 합니다. 저는 트라이얼 버전으로 이용해 볼 예정입니다.

가장 널리 쓰이는 아이콘 편집 프로그램으로 Icon Workshop이 있습니다.



[내용추가(161016)] 윈도우 아이콘 표준 사이즈/표준 색상

윈도우 표준 아이콘 사이즈 for ICO포맷 (윈도우7)

  • 256x256 pixels - 32bit (24bit color, 8bit trasnparency)
  • 48x48 pixels - 32bit (24bit color, 8bit trasnparency)
  • 32x32 pixels - 32bit (24bit color, 8bit trasnparency)
  • 16x16 pixels - 32bit (24bit color, 8bit trasnparency)
윈도우 7 이전 시스템에서의 호환성을 맞추기 위해서는 위 사이즈의 아이콘들을 8bit (256 color, 1bit transparency)로도 저장할 것을 권장합니다. 이보다 더욱 안전한 호환성을 보장받기 위해서는 4bit (16 color, 1bit transparency)로도 저장하는 것을 권장합니다. 

추가적으로 자주 사용되는 윈도우 아이콘 사이즈

  • 128x128
  • 96x96
  • 180x180
  • 72x72
  • 64x64
  • 24x24
  • 16x16
위 리스트 중 가장 사용 빈도가 높은 사이즈는 24x24을 들 수 있을 것 같습니다. 

아이콘이 적절히 랜더되는지 테스트하는 방법

윈도우 탐색기나 Icon Workshop을 통해서 각 사이즈 별 랜더가 적절히 이루어지는지 확인할 수 있습니다.
윈도우에서 표시되는 아이콘들의 크기 별 사용용도는 다음과 같습니다.

Icon Workshop이 표시하는 표준 윈도우 아이콘 사이즈 
(Standard Windows Icon Sizes shown in Axialis Icon Workshop)
(이미지 출처 : www.creativefreedom.co.uk)

  • Extra Large Icons - 256x256 pixels
  • Large Icons - 96x96 pixels (자동으로 256버전으로 랜더됩니다.)
  • Medium Icons - 48x48 pixels
  • Small Icons - 16x16 pixels
  • List - 16x16pixels
  • Details - 16x16 pixels
  • Tiles - 48x48 pixels
  • Content - 32x32 pixels
이 외에 아이콘 위에 오버레이되어 표시되는 오버레이 아이콘에 대한 제작 또한 가능합니다.
더 자세한 정보는 영문으로 작성된 관련 아티클 및 윈도우 공식 UI가이드라인을 참고하시기 바랍니다.

[내용추가(161016)] 무료로 GIMP 활용하기

GIMP를 활용하여 ico 파일 저장 시 비트 수 설정이 가능합니다.

ICO 관리에 있어서 위에 기재된 포토샵 플러그인은 다소 제공 기능이 부족(8비트 저장 기능 미제공)하며, Icon Workshop은 유료입니다. 이러한 문제를 극보할 수 있는 방법으로 오픈소스 비트맵 에디팅 프로그램인 GIMP를 활용하는 방법이 있습니다. GIMP를 활용하면 윈도우 표준 아이콘 포맷에 대응할 수 있는 bit 별로 나누어서 ico 파일을 저장할 수 있습니다. ico 패키징이 GIMP에서 가능할지는 모르겠지만, 일단 GIMP에서 ico exporting을 한 이후, icobundle과 같이 위에서 기재한 ico 패키징 프로그램을 통해서 패키지화된 ico 파일 제작이 가능할 것으로 보입니다.

혜자 비트맵 그래픽 에디팅 프로그램 GIMP(오픈소스 응원합니다...)


위와 같이 bit 수를 설정하여 ico 파일 exporting이 가능합니다.


* 8비트 ico 파일을 만들 때 주의사항 : 8비트 png 파일을 제작한 이후에 8비트 ico파일로 exporting해야 fuzzy(경계선이 거칠게 나오는 현상)한 경계선 그래픽을 줄일 수 있습니다. 



반응형
외주/과외 문의