Photoshop 없이 PSD 파일의 레이어 추출하기

안녕하세요. Windows Azure MVP 남정현입니다.



오늘 소개하려는 내용은 개발자분들께 매우 유용한 팁이 될 것 같습니다. 요즈음에도 디자이너와 개발자 사이에는 협업을 하기 쉽지 않은 점들이 매우 많습니다. 특히 디자이너가 공들여 작업한 PSD 파일은 막상 개발자의 손에 떨어지면 아무 의미 없는 바이너리 파일이 되기 쉽습니다. 종국에는 개발자가 디자이너의 따가운 눈초리를 애써 무시하면서 레이어 파일들을 일일이 잘라달라고 부탁하지 않으면 안되는 상황이 되곤 하지요. 🙂


그러나 이러한 수고스러운 작업을 디자이너에게 요구하지 않고 개발자 스스로 PSD 파일을 레이어 별로 낱개의 투명 PNG 파일로 만들 수 있는 일련의 방법을 찾았습니다. 이를 위하여 Photoshop을 설치하거나 별도의 상용 유틸리티를 써야 하는 것은 더더욱 아니며 온전히 인터넷 상에서 구할 수 있는 도구와 플러그인, 그리고 Paint.net의 힘으로 도달할 수 있는 방법이므로 나름 추천해드릴만 하다고 생각합니다.


1단계: Paint.net 설치하기


Paint.net은 Rick Brewster가 개발한 프리웨어 기반의 Raster Graphic Editor 소프트웨어로 초창기에는 오픈 소스였지만 현재는 프리웨어로 전환한, C#으로 만든 멋진 그래픽 도구입니다. GIMP나 Photoshop을 대체하면서 Windows 환경에서 빠르고 가볍게 사용할 수 있는 그래픽 도구로 널리 알려져 있고 국내에서도 인지도가 제법 높은 편입니다.


Paint.NET은 http://www.getpaint.net/ 에서 최신 버전을 설치할 수 있습니다.


2단계: Paint.net PSD 플러그인 설치하기


Paint.net은 훌륭한 그래픽 편집 도구이지만 PSD를 직접 지원하지는 못합니다. 대신 PDN이라는 자체 파일 형식을 사용하기 때문에 Paint.net만 설치해서는 PSD 파일을 다룰 수 없습니다. 이를 극복하기 위하여 Paint.net PSD 플러그인을 http://psdplugin.codeplex.com/ 에서 최신 버전을 다운로드하고 설치해야합니다. 플러그인 ZIP 파일을 다운로드하면 PhotoShop.dll 파일을 확인할 수 있으며 이 파일을 아래와 같이 설치합니다.



  • 실행 중인 Paint.net 프로그램을 모두 종료합니다.

  • PhotoShop.dll 파일을 %PROGRAMFILES%Paint.NETFileTypes 폴더 아래에 복사합니다.

  • 다시 Paint.net을 실행하고 파일 열기 대화 상자에서 파일 유형을 선택할 때 아래와 같이 PSD 파일에 대한 필터가 등록되어있으면 정상적으로 설치된 것입니다.


3단계: PSD 파일을 PDN 파일로 저장하기


변환하려고 하는 PSD 파일을 PDN 파일로 저장해야 합니다. 일단 PSD 파일을 Paint.net에서 열었을 때 원본 PSD 파일과 차이점이 없는지 한 번 확인은 해야 합니다. 디자이너나 아트워크에 관여하는 다른 사람과 내용을 검토해본 다음 내용에 이상이 없으면 PDN 파일로 저장하여 4단계로 진행합니다.


4단계: PDN2PNG 명령줄 유틸리티로 레이어 별로 투명 PNG로 저장하기


PSD 파일을 PDN 파일로 변환한 다음 실제로 하려는 일은 각각의 레이어를 투명 PNG로 나누어 저장하는 일이 되겠지요. 이 작업 역시 Paint.net에서 직접 수행하는 것은 현재 매우 손이 많이 가고 번거로운 작업이기 때문에 자동화를 위하여 반드시 도구가 필요한데 Paint.net 없이 이를 처리해주는 도구가 PDN2PNG 입니다. http://forums.comsquare.ch/viewforum.php?title=pdn2png 에서 다운로드할 수 있으며, 별도로 제품화된 소프트웨어가 아닌 관계로 사이트에 접속되지 않을 가능성을 염두에 두어 제 SkyDrive에 파일 사본을 올려두었습니다. (문제가 될 경우 삭제하겠습니다.)


PDN2PNG 및 PSD Load Plugin 다운로드: http://sdrv.ms/VQfZyE


이 프로그램을 명령줄 도구로 찾기 쉬운 위치에 파일을 압축 해제하여 복사하거나 PATH 환경 변수 등으로 검색할 수 있도록 설치합니다.


PDN 파일이 정상적으로 렌더링되었을 때의 전체 모습을 PNG 파일로 바꾸려면 다른 스위치 없이 아래와 같이 명령어를 지정하면 됩니다.


pdn2png “PDN 파일 경로”


PDN 파일 안에 들어있는 각각의 레이어들을 모두 낱개의 PNG 파일로 바꾸려면 아래와 같이 /split 스위치를 사용하여 명령어를 지정하면 현재 작업 중인 디렉터리 앞으로 낱개의 PNG 파일들이 레이어의 이름을 사용하여 만들어집니다.


pdn2png /split “PDN 파일 경로”


전체 레이어 대신 특정 레이어 인덱스를 PNG 파일로 바꾸려면 아래와 같이 스위치를 지정합니다.


pdn2png /index=”인덱스 번호” “PDN 파일 경로”


5단계: 그림 자르기



pdn2png 명령의 /split 스위치를 사용하여 모든 PNG 파일들을 만들고 난 다음에 각 PNG 파일들을 살펴보면 분할은 되어있지만 여전히 프로그램에서 원하는 조각 그림의 형태에는 조금 거리가 있습니다. 디자인 아트워크 기준으로 정확히 제 자리에 아트워크가 변환되어있긴 하지만 불필요하게 여백이 많이 남는 것을 볼 수 있습니다. 이를 깔끔하게 제거할 수 있는 방법은 약간의 노동(?)을 요구합니다. 5단계의 작업을 위해서는 Paint.net 또는 다른 적절한 도구를 사용하면 되지만 여기서는 Paint.net으로 작업하는 요령을 소개하고자 합니다.



  • Paint.net으로 나누어진 PNG 파일을 엽니다.

  • Magic Wand 툴을 도구 모음에서 왼쪽 그림과 같이 선택합니다.

  • Magic Wand 툴의 경계선 감지 유연성을 아래 그림과 같이 0%로 설정합니다. 어차피 투명한 배경과 투명하지 않은 Object로 경계가 극명하게 구분된 상태의 이미지이기 때문에 정확히 이미지를 자를 것에만 신경쓰면 됩니다.

  • 이제 아래 그림과 같이 투명 배경을 Magic Wand로 선택합니다. 이렇게 선택하여 투명한 영역과 투명하지 않은 영역을 집합 관계로 봤을 때 차집합 관계로 설정할 수 있습니다.



  • 키보드 단축키 Ctrl+I 키를 눌러 영역을 반전시킵니다. 투명한 영역 선택에 대한 나머지 반전이므로 투명하지 않은 영역 모두를 선택하는 셈이 됩니다.



  • 이제 여기서 키보드 단축키 Ctrl+Shift+X키를 눌러 선택된 영역에 맞추어 캔버스의 크기를 아래 그림과 같이 줄입니다. 크기는 자동으로 산출되므로 이미지가 잘릴 걱정은 하지 않아도 됩니다.

    주의 사항: SnagIt의 경우 단축키로 Ctrl+Shift+X를 이미 전역적으로 바인딩하고 있기 때문에 이 동작이 Paint.net으로 전달되지 않고 무시될 수 있습니다. SnagIt 혹은 이 단축 키 조합에 의존하는 다른 프로그램이 있을 경우 작업하는 동안 잠시 프로그램을 종료해야 합니다.



  • 키보드의 Esc 키를 눌러 선택 영역을 해제하고 단축키 Ctrl+S 키를 눌러 아래 그림과 같이 최적의 이미지 옵션을 선택하여 저장합니다. 나머지 파일들도 같은 방법으로 계속 작업하면 됩니다.



이렇게 해서 디자이너가 개발자에게 가져다준 PSD 파일을 개발자가 원하는 PNG 파일로 성공적으로 변환할 수 있습니다. 디자이너와 개발자 모두 서로에게 도움이 될 수 있을 것입니다. 오늘 한 번 시험삼아 활용해보시는것은 어떨까요? 🙂

댓글 남기기