PHOTOPEA, 포토샵 대체 사용법과 레이어·내보내기 기준

 

설치 없이 브라우저에서 바로 편집되는 툴을 찾다 보면 이 도구가 자꾸 등장해요. 처음엔 가벼운 뷰어인 줄 알았다가, 레이어·마스크·스마트 객체까지 되길래 깜짝 놀라셨을 거예요. 다만 메뉴 이름이 미묘하게 달라서 처음 접속하면 어디부터 눌러야 할지 막막하죠. 알고 보니 핵심 흐름만 익히면 금방 손에 붙어요. 새 파일 설정, 선택·보정 루틴, 내보내기 프리셋만 고정해두면 웬만한 작업은 무리 없이 끝나요. 지금부터 꼭 쓰는 기능만 간단명료하게 정리해볼게요.

---

🧭 첫 접속 루틴, 환경부터 가볍게 세팅

새 문서는 File→New에서 템플릿 크기를 고르고, 단위를 px로 맞춰요. 상단 우측 톱니에서 인터페이스 밝기와 단축키 레이아웃을 조정하면 익숙해져요. 여기서 PHOTOPEA 기본 설정을 저장해두면 브라우저를 닫아도 다음에 그대로 불러와서 편해요.

작업 파일은 PSD로 저장을 권해요. 레이어와 마스크가 그대로 남아 수정이 쉬워요. 임시 공유는 PXD도 무난해요. 브라우저 탭이 많으면 자동 저장을 켜고, 히스토리 스냅샷을 구간마다 남겨 되돌리기를 안전망처럼 써요.

이미지 불러오기는 드래그 앤드 드롭이 가장 빠르고, 스마트 객체로 배치하면 품질 유지에 유리해요. 캔버스 크기와 아트보드는 미리 정해두고, 가이드와 격자를 켜서 정렬 기준을 단단히 잡아두면 이후 작업이 한결 깔끔해져요.

---

✂️ 선택·마스크, 깔끔한 합성의 최소 동선

빠른 선택 후 Select→Refine Edge로 경계를 다듬어요. 머리카락 같은 영역은 Refine 툴로 한 번 쓸어주면 은근히 자연스러워요. 채널로 분리해 대비가 높은 채널에서 선택을 만드는 전통적인 방법도 여전히 유효해요.

마스크는 “거칠게 따기 → 가장자리 부드럽게 → 브러시로 미세 보정” 순서가 빠르더라고요. 검은 브러시는 숨기고, 흰 브러시는 드러내요. 레이어를 복제해 비교용을 남겨두면 과한 보정을 막기 쉬워요. 합성 끝엔 색·광량을 맞추기 위해 곱하기/화면 블렌딩을 가볍게 시험해요.

마무리는 레벨·커브로 톤을 통일하고, 레이어 스타일로 그림자 깊이만 살짝 얹어요. 기록은 히스토리에 북마크로 남겨 두세요. 다음 파일에서 같은 톤을 재현하기 쉬워요. 최종 검수표 하단에 PHOTOPEA 마스크 값과 톤 조정 수치를 메모하면 팀 공유가 빨라요.

---

🔤 타이포·도형, UI 제작에 필요한 것만

텍스트 패널에서 자간·행간을 수치로 맞추고, 문자 스타일을 만들어 재사용하세요. 버튼이나 배지 같은 UI 요소는 모양 레이어와 라운드 값으로 통일해 두면 픽셀 울렁임이 줄어요. 아이콘은 SVG를 임베드해 크기 변경에 유연하게 두는 게 좋아요.

모서리 정렬은 스마트 가이드에 크게 의존해요. Move 툴로 드래그할 때 보라색 스냅이 뜨면 정렬이 맞았다는 뜻이에요. UI 미세 정렬은 좌우 키보드 이동과 눈금 격자의 조합이 가장 빨라요. 마지막에 컴포넌트를 그룹으로 묶어 이름 규칙을 지키면 검색이 쉬워요. 중간 산출물 이름에 PHOTOPEA 버전과 해상도를 함께 적어 추적성을 확보해요.

효과는 과감히 줄이고 대비와 여백으로 정보 계층을 보여줘요. 라이트·다크 테마를 함께 놓고 보정하면 의외의 색 번짐을 빨리 잡을 수 있어요. 버튼 상태는 Normal/Hover/Pressed를 아트보드로 분리해 QA가 편하도록 해요.

---

🎨 보정 루틴, 색과 선명도만 단정하게

톤은 레벨로 검은점·흰점을 먼저 잡고, 커브로 중간톤을 살짝 건드려요. 색은 색상/채도에서 채도를 과하게 올리지 않도록 주의해요. 노이즈가 거슬리면 가벼운 노이즈 감소 후 언샤프 마스크로 선명도를 돌려줘요. 이렇게 정리해두면 PHOTOPEA에서도 인쇄와 웹 양쪽에 무난한 결과가 나와요.

피부 보정은 힐·패치로 질감을 지키는 게 포인트예요. 과한 블러는 금방 티가 나요. 라이트룸 스타일의 컬러 룩을 입히고 싶다면 LUT를 임포트해 레이어 맨 위에 올려두면 일관성이 생겨요.

최종 체크는 100% 배율과 축소 보기 두 번이에요. 확대에서는 경계, 축소에서는 색 밸런스가 잘 보여요. 다크 모드에서도 대비가 충분한지 확인하면 모바일에서 컬러가 죽는 사고가 줄어요.

---

📤 내보내기, 목적별 프리셋만 기억해요

웹 이미지: PNG는 투명 배경, JPG는 사진, SVG는 아이콘. 품질은 JPG 70~85, PNG는 색 줄이기 옵션으로 용량을 낮춰요. 썸네일은 1x/2x 세트를 한 번에 뽑아 두면 등록이 빨라요. 메타데이터는 공개 배포 전 제거가 안전해요.

인쇄용은 PDF로 내보내고, 해상도 300dpi와 폰트 포함을 켜요. 색공간은 sRGB로 두면 대부분 안전하고, 브랜드 컬러가 까다로우면 별색 대신 정확한 CMYK 값으로 테스트 출력해요. GIF 애니메이션은 프레임 수를 줄이고, 반복 여부를 명확히 설정해요.

팀 배포는 PSD와 결과물을 함께 주는 게 좋아요. 폴더에 프리셋 설명을 텍스트로 넣고, 파일명 규칙을 날짜_프로젝트_사이즈로 고정해요. 마지막 줄에는 작업 메모에 PHOTOPEA 내보내기 값(형식/품질/색공간)을 남겨 동일 재현을 쉽게 만들어요.

---

🧯 막히는 오류, 빨리 좁혀 풀어봅시다

한글 폰트가 깨지면 웹 폰트 로드 문제일 때가 많아요. 대체 글꼴을 지정하거나, 텍스트를 윤곽선으로 잠깐 변환해요. 큰 파일이 버벅이면 레이어를 스마트 객체로 묶고, 필요 없는 히스토리를 정리하면 확 가벼워져요.

색이 탁해 보이면 색상 프로파일이 혼재했을 가능성이 높아요. 이미지→Assign/Convert Profile에서 sRGB로 통일하고, 내보내기에서 프로파일 포함을 켜요. 저장이 실패하면 브라우저 저장 권한 이슈일 수 있어요. 임시로 다른 탭에서 다시 저장하고, 캐시 정리 후 재시도해요. 문제 기록표 첫 줄에 PHOTOPEA 환경(브라우저/OS)을 남겨 두면 재현이 쉬워요.

GIF가 깨지면 캔버스 크기 불일치가 흔한 원인이에요. 프레임 크기를 동일하게 맞추고, 색 수를 단계적으로 줄여 보세요. PNG 투명 픽셀 경계가 거칠면 반투명 배경을 잠깐 깔아 확인한 뒤 가장자리를 소폭 블러 처리하면 자연스러워집니다.

---

결국 중요한 건 도구의 모든 기능이 아니라, 자주 쓰는 동선을 내 손에 익히는 일이더라고요. 오늘 정리한 루틴만 따라도 기본 합성, UI 내보내기, 간단 보정은 가볍게 끝나요. 템플릿과 프리셋을 한 번 만들어 두고, 다음 작업부터 그대로 복붙해보세요. 처음엔 낯설어도 몇 번만 반복하면 속도와 완성도가 동시에 올라가요.

---

💬 자주 듣는 질문을 모아봤어요

Q. 브라우저만으로도 대용량 편집이 가능할까요?
A. 가능은 하지만 탭을 적게 두고, 스마트 객체와 자동 저장을 활용해 주세요.

Q. 포토샵 단축키가 그대로 먹히나요?
A. 대부분 유사해요. 설정에서 커스텀 맵핑을 해두면 더 편해요.

Q. 폰트 라이선스는 어떻게 관리할까요?
A. 웹 임베딩 허용 범위를 확인하고, 외부 배포 전엔 윤곽선 변환을 고려해요.

Q. 색이 다르게 보일 때 대처법이 있나요?
A. sRGB로 통일하고, 내보내기 시 프로파일 포함을 켜면 안정적이에요.

Q. 팀 협업에서 파일이 자꾸 꼬여요.
A. 폴더 규칙과 파일명 규칙을 고정하고, PSD와 결과물을 함께 배포하세요.

---