디자인 목업 멀티스크린 프레젠테이션
앱이나 웹 디자인의 여러 화면을 하나의 파노라마 이미지로 합쳐 리뷰와 포트폴리오에 활용합니다.
클라이언트에게 디자인 플로우를 발표할 때든 Dribbble이나 Behance에 올릴 커버 이미지를 만들 때든, Figma나 Sketch에서 내보낸 여러 화면을 하나로 합치는 작업은 디자이너의 흔한 업무입니다.
문제
디자이너는 리뷰 미팅에서 앱의 전체 플로우나 웹사이트의 전체 흐름을 한 번에 보여줘야 할 때가 많지만, Figma와 Sketch는 화면마다 별도 파일로 내보내집니다. 흩어진 이미지를 클라이언트나 팀원이 넘겨보며 화면 전환 로직을 이해하기는 어렵고, Photoshop으로 직접 합치면 시간이 걸리며 화면 크기가 다를 경우 비율이 어긋나거나 흐릿해지기도 합니다.
해결책
Auto Merge Images를 사용하면 내보낸 화면을 몇 개든 브라우저에 바로 드래그해서 합칠 수 있습니다. Photoshop 같은 디자인 소프트웨어가 필요 없고, 서버에 업로드되지도 않습니다. 드롭한 순서대로 자동 배치되며 원본 해상도를 그대로 유지한 채, 화면 간 간격, 배경색, 배치 방향(가로 또는 세로)을 자유롭게 조정할 수 있어 몇 초 만에 클라이언트 리뷰나 포트폴리오용 완성도 높은 이미지를 만들 수 있습니다.
사용 방법
- 1Figma나 Sketch에서 모든 화면 내보내기
- 2플로우 순서대로 드래그
- 3간격, 배경색, 배치 방향 조정
- 4미리보기 후 고해상도 이미지 다운로드
- 5클라이언트 리뷰, 팀 발표, 포트폴리오에 활용
이 도구를 사용하는 이유
- ✓디자인 소프트웨어 없이 브라우저에서 바로 작업
- ✓원본 해상도 유지로 확대해도 디테일이 살아있음
- ✓화면 수 제한 없이 몇 개든 합치기 가능
- ✓로컬에서 처리되어 서버에 업로드되지 않음
- ✓완전 무료, 워터마크 없음, 사용 횟수 제한 없음
자주 묻는 질문
목업 사이의 간격을 조절할 수 있나요?
네, 각 화면 사이의 간격과 배경색을 자유롭게 조정할 수 있어 섹션을 구분하거나 포트폴리오 스타일에 맞출 수 있습니다.
클라이언트 발표용으로 어떤 형식으로 내보내는 게 좋나요?
텍스트와 윤곽선을 선명하게 유지하려면 PNG가 좋습니다. 이메일로 보낼 때 파일 크기가 걱정되면 JPG도 충분합니다.
모바일과 웹처럼 크기가 다른 목업도 함께 합칠 수 있나요?
가능합니다. 기본적으로 비율에 맞춰 배치되며, 개별 이미지 크기를 직접 조정해 모바일과 웹 화면을 맞출 수도 있습니다.
Behance나 Dribbble에 올릴 이미지 제작에도 쓸 수 있나요?
네, 많은 디자이너가 여러 화면을 하나의 커버 이미지나 케이스 스터디 이미지로 합쳐서 Behance와 Dribbble에 업로드합니다.