브라우저 목업 및 스크린샷 꾸미기

웹페이지 스크린샷을 그대로 발표 자료나 SNS 게시물에 넣으면 밋밋해 보이고, 웹사이트 화면이라는 느낌도 잘 나지 않습니다. 이 도구는 스크린샷을 macOS 스타일의 브라우저 창으로 감싸 왼쪽 위의 빨강·노랑·초록 버튼, 주소창, 둥근 모서리, 부드러운 그림자를 더한 뒤 그라데이션 배경 위에 올려 줍니다. 몇 초 만에 프레젠테이션, 제품 소개 페이지, 포트폴리오, X 게시물에 어울리는 깔끔한 이미지를 만들 수 있습니다.

사용법은 간단합니다. 업로드 영역을 클릭하거나 이미지를 끌어다 놓으면 되고, PNG와 JPG를 지원하며 한 번에 한 장씩 처리합니다. '스타일 설정'에서 네 가지 그라데이션 배경 중 하나를 고르거나, 그라데이션 없이 어두운 단색 배경을 선택할 수 있습니다. 배경 여백은 S, M, L 세 단계로 스크린샷 주변의 여백 크기를 정합니다. 프레임 테마는 다크와 라이트 두 가지로, 스크린샷의 색감에 맞춰 고르면 됩니다. 모든 변경 사항은 오른쪽 실시간 프리뷰에 바로 반영됩니다.

'브라우저 주소'에는 제품 도메인이나 특정 페이지 경로처럼 표시하고 싶은 주소나 문구를 자유롭게 입력할 수 있습니다. 너무 길면 말줄임표로 잘려 주소창 밖으로 넘치지 않습니다. '목업 이미지(PNG) 다운로드'를 누르면 브라우저 안의 Canvas에서 전체 이미지를 다시 그려 너비가 항상 1600픽셀인 선명한 PNG로 내보냅니다. 높이는 스크린샷의 가로세로 비율에 맞춰 정해지므로 세로로 긴 전체 페이지 캡처도 그대로 담깁니다.

모든 합성은 사용자의 컴퓨터에서 이루어지며 스크린샷은 AlpaKit 서버로 업로드되지 않으므로, 공개 전 제품 화면이나 사내 시스템 화면에도 안심하고 쓸 수 있습니다. 현재 프레임은 macOS 스타일 한 가지뿐이며 배경을 투명하게 만들 수는 없습니다. 원본 스크린샷의 너비가 1600픽셀보다 훨씬 작으면 내보낼 때 확대되어 글자가 흐려질 수 있으니, 고해상도 화면이나 큰 창에서 캡처하는 것을 권합니다.