본문 바로가기

할인정보

[일시무료] 맥에서 제작한 이미지를 iOS에 바로 올릴 수 있는 프로토타입 제작도구 'Prototypr'


Prototypr (14.99불 → 무료)

'프로토타입', 즉 앱의 설계 화면을 iOS 기기에 띄워 볼 수 있는 'Prototypr'가 맥 앱스토어와 아이튠즈에서 무료 세일 중입니다. 개발자가 iOS 앱을 실제로 제작하기 전에 이미지 파일로 스토리보드를 만들고, iOS 화면에 어떻게 표시될 지 미리 살펴볼 수 있는 독특한 기능을 가진 앱입니다.

본격적으로 프로토타입을 만들어볼까요?

앱을 처음 실행하면 어떤 iOS 기기를 대상으로 하는 프로토타입을 만들지 선택하는 창이 나타납니다. 아이폰4에서부터 아이폰5s, 아이패드도 지원하며, 창 아래 있는 Learn How 버튼을 누르면 포토샵에서 작업 중인 이미지도 실시간으로 가져올 수 있도록 스크립트를 설치해줍니다. ▼

우선 파인더에서 IOS 화면 규격에 맞는 PNG, JPEG, 또는 PSD 파일을 드래그하여 앱에 추가해주어야 합니다. 가로로 긴 이미지를 넣으면 작업 영영 안에 있는 '가상'의 아이폰이 알아서 회전합니다. ▼

이렇게 추가한 이미지를 선택하면 아이폰에 곧바로 나타나는데, 드래드&드롭으로 이미지의 특정 구역을 '탭 영역'을 설정할 수 있습니다. ▼

탭 영역 위에 있는 번개 모양의 아이콘은 해당 영역을 클릭했을 때 다른 이미지를 띄워주는 일종의 '링크'입니다. ▼

아래 있는 화살표 아이콘은 이전 이미지로 돌아가는 기능을 담당합니다. ▼

이런식으로 필요한 만큼 탭 영역을 만들어주기만 하면 끝! 마치 Xcode에 포함된 인터페이스 빌더와 비슷하죠? ▼

모든 작업을 마치면 본격적으로 프토로타입을 시험해 볼 차례입니다. 창 우측 상단에 두 개의 버튼이 마련되어 있는데요, 왼쪽에 있는 재생 버튼은... ▼

마치 키노트를 재생하는 것처럼 화면이 어둡게 변하고 프로토타입이 화면 한 가운데 표시됩니다. ▼

오른쪽 버튼을 누르면 Prototypr 뷰어 앱을 설치한 iOS 기기에 데모 화면이 나타납니다. 혼자 감상하느냐, 아니면 클라이언트나 동료에게 프로토타입을 보여주느냐에 따라 두 모드 중에 필요한 기능을 사용하시면 될 듯합니다. ▼

참고로 iOS 기기에서 미리보기 기능을 사용하려면 iOS 기기가 맥과 같은 네트워크에 연결되어 있어야 하며, 연결 가능한 기기(Available Devices...) 메뉴에 들어가 기기를 미리 선택해야 합니다. ▼

코멘트 & 다운로드

Prototypr는 사용 방법이 무척 간단하면서도 군더더기 없이 딱 필요한 기능만 갖추고 있어 누구나 쉽게 사용할 수 있습니다. 전반적으로 코딩이 서툰 디자이너나 성격이 급한 앱 개발자를 위한 툴이라고 할까요.

Prototypr와 비슷한 용도로 사용할 수 있는 'Skala Preview(MaciOS)'도 디자이너와 개발자들에게 많은 인기를 끌고 있는데요, 이미지를 한장 한장 감상할 때는 Skala Preview가 편리하지만 전체적인 흐름을 살펴보고 싶은 분들에게는 Prototypr가 조금 더 효과적인 도구가 될 것 같습니다.

15불 상당의 고가의 프로그램인데 무료로 받을 수 있는 좋은 기회이니 개발자분들이라면 이번 기회에 꼭 받아두시기 바랍니다.

Download Prototypr (for Mac) $0.00

Download Prototypr Viewer (for iOS) $0.00



참조
Prototypr 공식 홈페이지

관련 글
iStat 개발사에서 앱 디자이너를 위해 만든 'Skala Preview'... 5불 가격표 떼고 앞으로 무료 제공
OS X 색상 패널에 추가할 수 있는 새로운 컬러피커 플러그인 'Skala Color'
맥용 디자인 보조도구 'xScope 4' 출시
맥, 아이폰, 아이패드 아트워크 이미지를 한방에 쉽게 만들 수 있는 'Promotee'