목업 제작은 저와 같이 기획업무를 하거나 디자인 업무를 하는 분들에게는 꼭 필요한 서비스이기에! 다시 한 번 목업 제작 툴을 들고 오게 되었습니다.
스크린샷을 목업 형태로 쉽게 바꿀 수 있다면? ‘SCREELY’
5초만에 ‘모바일 앱 목업, 모바일 목업’ 제작이 가능한 서비스
위의 두 서비스가 최근 소개드린 ‘목업 제작 툴’이었는데요! 오늘은 조금 더 ‘구체적’인 목업을 제작할 수 있는 ‘Shotsnapp’을 소개하려고 합니다.
‘Shotsnapp’의 기본 구성은 위의 이미지와 같이 이뤄져 있습니다. 별도의 데스크탑 애플리케이션을 다운로드 받지 않고, 웹상에서 사용이 가능하죠. 베타버전으로 먼저 공개가 되었는데 기본 기능을 간략하게 먼저 확인해보겠습니다.
- 디바이스 종류 선택(현재 폰,데스크탑 지원)
- 이미지 업로드(PNG, JPG, SVG, GIF 지원)
- 목업 캔버스 사이즈 지정
- 백그라운드 컬러 지정(Opacity 설정 가능)
- 디바이스 별 상세 종류 선택(아이폰 SE, 8, X, 삼성 갤럭시 S8, 구글 픽셀 2)
- 디바이스 별 컬러 선택
- 디바이스 위치 설정
- 설정한 이미지 다운로드 등
서비스 화면 윗쪽 가운데를 보면 디바이스 종류를 선택, 변경할 수 있습니다. 현재는 폰과 브라우저(데스크탑)만 지원을 하는데 추후 랩탑, 태블릿, 웨어러블(스마트 워치 등) 디바이스를 지원할 예정이라고 하네요. 저는 우선 폰을 선택해 서비스를 이용해봤습니다.
화면 우측을 통해 다양한 ‘설정 옵션’을 확인하고 실제 선택, 변경이 가능한데요! 디바이스를 선택한 후, 바로 시작해볼 수 있었습니다. 가장 윗쪽에는 이미지를 불러올 수 있는 기능이 있으며, 이는 가장 먼저 활용할 기능이기도 합니다.
차례대로 이어서 확인을 해보자면, 캔버스 옵션이 자리잡고 있는데 이는 디바이스가 포함된 전체 이미지의 ‘사이즈’를 설정할 수 있는 옵션입니다. 기본은 1000x1000px로 설정이 되어 있죠. 목업 활용 목적에 따라 사이즈를 선택, 활용할 수 있도록 구성되어 있는 모습입니다.
이어서 백그라운드 컬러를 선택, 변경할 수 있는데요. 위의 이미지 가운데를 보면 백그라운드 컬러를 선택했을 때의 모습을 상세히 확인할 수 있습니다. 컬러 선택 후, 투명도를 별도로 설정할 수 있죠.
이어서 폰 옵션이 있는데요! 이는 폰 모델, 디바이스 상세 모델을 설정할 수 있는 기능입니다. 위의 이미지 가장 오른쪽을 확인해보시면 상세 모델을 알 수 있죠. 모델 하단에는 캔버스 내 목업 위치를 변경할 수 있는 옵션이 있는데 왼쪽/오른쪽/가운데 정렬 뿐만 아니라 화면의 어느 부분을 강조할 것인지를 함께 설정할 수 있었습니다. 마지막으로 디바이스 목업 사이즈와 컬러를 지정할 수 있고요 🙂
디바이스 위치를 왼쪽으로 정렬한 모습
디바이스의 아랫쪽을 강조한 모습
서비스에서 제공하는 다양한 기능, 옵션을 활용해 제작한 목업은 우측 하단 ‘Download image’ 버튼을 통해 바로 내려받을 수 있습니다.
위의 이미지가 바로 그 주인공! 별도의 ‘디자인 툴’을 실행하지 않고도, 필요한 이미지를 불러와 어렵지 않게 목업을 제작할 수 있는 ‘Shotsnapp’. 베타로 시작해 앞으로 더 많은 디바이스와 기능이 추가될 예정이라고 하니! 종종 들러 목업들을 제작할 수 있을 것 같습니다 🙂 앞서 소개드린 서비스들과 함께 목업 제작을 빠르게 해야 하는 상황에 한 번씩 활용해보시면 좋을 것 같네요!
한성규님의 ‘지금 써보러 갑니다‘에 게재된 글을 모비인사이드가 한번 더 소개합니다.
[fbcomments url=” http://ec2-13-125-22-250.ap-northeast-2.compute.amazonaws.com/2018/07/31/servicereview-shotsnapp/ ” width=”100%” count=”off” num=”5″ countmsg=”wonderful comments!”]
