GUIDE · 목업
클로드 화면을 완성본처럼 보이게 하는 밤티 탈출 무료 목업 사이트 모음
읽는 데 5분2026-09-25 공개
하루 6시간 만에AI 기초부터 나만의
서비스까지 완성
클로드로 잘 만든 화면도 캡처를 그대로 포트폴리오나 상세페이지에 붙이면 어딘가 미완성처럼 보입니다. 이 자료는 화면을 폰·노트북 목업에 넣어 주는 무료 사이트 다섯 곳의 무료 범위와, 목업에 넣기 좋은 캡처를 클로드에게 만들게 하는 프롬프트를 담았습니다.
Quick Start
평면 캡처는 화면 가장자리와 배경이 구분되지 않아 결과물이 덜 완성돼 보입니다. 같은 화면을 기기 틀 안에 넣고 배경과 그림자를 더하면 실제 서비스를 쓰는 장면처럼 보입니다. 아래 다섯 곳은 모두 무료로 시작할 수 있고, 가입 없이 둘러볼 수 있는 곳도 있습니다.
- STEP 1에서 클로드에게 목업에 넣기 좋은 크기로 화면을 정리하게 하고 캡처합니다.
- STEP 2에서 쓰임새에 맞는 목업 사이트를 고릅니다.
- STEP 3에서 캡처를 넣고 내보낸 뒤, 필요하면 클로드로 상세페이지에 배치합니다.
STEP 1 · 5분목업에 넣을 캡처를 만든다
목업의 기기 화면 비율과 캡처 비율이 다르면 위아래가 잘리거나 빈 공간이 생깁니다. 캡처하기 전에 화면 크기를 기기에 맞춰 달라고 합니다.
이 화면을 아이폰 화면 크기(390×844)에 맞춰 한 화면 안에 들어오게 정리해줘. 상단 상태 표시줄 자리 44px는 비워 두고, 스크롤 없이 첫 화면에서 핵심 내용이 다 보이게 해줘. 내용과 색은 바꾸지 마.
브라우저 개발자 도구의 기기 모드에서 같은 크기로 열고 캡처합니다. 웹페이지라면 1440×900처럼 노트북 비율로 한 장 더 캡처해 둡니다.
STEP 2 · 3분쓰임새에 맞는 사이트를 고른다
아래 내용은 2026년 9월 25일 각 공식 페이지를 직접 열어 확인한 것입니다.
| 사이트 | 이럴 때 | 무료로 확인한 범위 |
|---|---|---|
| Shots | 캡처 한 장을 빠르게 기기 틀+배경으로 | 무료 목업 제공(Free Mockups), 캡처를 넣으면 배경을 골라 주는 Magic Backgrounds |
| Mockuuups Studio | 손에 든 폰, 책상 위 노트북 같은 실사 사진 | 목업 5,300개 이상. 무료 모음은 수가 제한되고 출처 표기가 필요하며 개인 작업용 |
| Canva | 이미 캔바로 상세페이지·SNS를 만들 때 | 폰·웹사이트 목업 템플릿. 일부 AI 편집 기능은 Pro 표기 |
| Artboard Studio | 폰 말고 포스터·박스·티셔츠까지 | 무료로 시작 가능(공식 FAQ), 목업 5,000개 이상, 브라우저에서 편집 |
| Previewed | 앱스토어·구글 플레이 스크린샷 | LITE $0: 한 개 앱·프로젝트, 2D 내보내기 무제한(720p), CC 출처 표기 라이선스 |
STEP 3 · 5분캡처를 넣고 상세페이지에 배치한다
사이트에서 기기를 고르고 STEP 1의 캡처를 올린 뒤 PNG로 내보냅니다. 내보낸 목업 이미지는 다시 클로드에게 넘겨 페이지에 배치할 수 있습니다.
첨부한 목업 이미지를 이 랜딩 페이지 첫 화면 오른쪽에 넣어줘. 왼쪽에는 서비스 이름과 한 줄 설명, 버튼 하나만 두고, 목업 이미지 뒤에는 옅은 그림자만 줘. 다른 섹션은 그대로 둬.
첨부한 앱 캡처를 HTML/CSS로 그린 아이폰 틀 안에 넣은 이미지를 만들어줘. 둥근 모서리의 검은 테두리와 상단 카메라 자리만 그리고, 배경은 주황에서 보라로 가는 부드러운 그라데이션으로 해줘. 실제 기기 사진처럼 보이게 꾸미지는 마.
성공하면 같은 화면이 기기 안에 들어가 배경과 분리되어 보이고, 포트폴리오 썸네일이나 상세페이지 첫 화면에 바로 쓸 수 있습니다.
알아 둘 한계
- 무료 범위는 사이트마다 다릅니다. Mockuuups Studio 무료 모음과 Previewed LITE는 출처 표기가 필요하고, Mockuuups Studio의 무료 체험 내보내기는 고객 작업·상업용이 아닌 평가·개인 미리보기용이라고 안내합니다. Previewed LITE는 720p이고 상업용 라이선스는 유료 요금제(PLUS 이상)에 포함됩니다.
- Canva 목업 페이지의 Magic Eraser·Background Remover·Magic Expand·Brand Kit은 Pro로 표기되어 있습니다. 무료 계정에서 쓸 수 있는 템플릿 범위는 계정 화면에서 확인합니다.
- Shots는 편집을 시작할 때 개인정보 처리방침과 이용 약관 동의 안내가 나옵니다. 이 글은 시작 전 소개 화면까지만 확인했고, 무료 내보내기의 세부 조건은 확인하지 못했습니다.
- 캡처를 올리는 사이트는 이미지를 서버에서 처리할 수 있습니다. 공개 전 화면이나 고객 정보가 담긴 화면은 올리기 전에 가립니다.
- 이 글은 2026년 9월 25일 각 공식 페이지를 직접 열어 본 내용 기준입니다. 요금과 무료 범위는 바뀔 수 있습니다.