MockUp : http://iphonemockup.lkmc.ch/
Nov 16, 200977
http://iphoneized.com/2009/11/21-prototyping-mockup-wireframing-tools-iphone-app-development/
18 Mobile Frameworks and Development Tools for Creating iPhone Apps
 So
 you have a killer idea for an iPhone app, but when you describe it to 
people they just don’t get it. Maybe you have a client that is a visual 
thinker and needs you to draw it out for him. That’s when wireframes, 
mockups and stencils can be your saving grace.
So
 you have a killer idea for an iPhone app, but when you describe it to 
people they just don’t get it. Maybe you have a client that is a visual 
thinker and needs you to draw it out for him. That’s when wireframes, 
mockups and stencils can be your saving grace.There are many different types of tools available to developers, from low-tech stencil kits to high-tech collaborative software. So I’ve rounded up a few of the more popular ones people are using specifically for iPhone development. It’s far from being the definitive list, but it’s definitely a good place to start.
Low Tech Solutions
Notepod
	 Notepod is a notepad shaped like an iPhone. Each notepod is 100 pages 
of 60 x 110mm double sided paper. The front has 52mm x 77mm blank space 
(the iPhone screen), the back is a 6mm grid.
 Notepod is a notepad shaped like an iPhone. Each notepod is 100 pages 
of 60 x 110mm double sided paper. The front has 52mm x 77mm blank space 
(the iPhone screen), the back is a 6mm grid.
iPhone UI Stencil Kit
	 The iPhone ui stencil kit is a stainless steel, laser cut stencil kit 
for drawing quick mock-ups and wireframes for iPhone apps. It also comes
 with a Zebra mechanical pencil.
 The iPhone ui stencil kit is a stainless steel, laser cut stencil kit 
for drawing quick mock-ups and wireframes for iPhone apps. It also comes
 with a Zebra mechanical pencil.
iPhone Sketch Pad
	 The iPhone Sketchpad works precisely with the iPhone Stencil Kit, with 
one phone silhouette on the front side and three on the back.
 The iPhone Sketchpad works precisely with the iPhone Stencil Kit, with 
one phone silhouette on the front side and three on the back.
App Sketchbook
	 The App Sketchbook has 50 Double-sided, perforated pages each with 3 
actual sized iPhone templates. Each page also has has 20px ruler 
markings and a ruled section for notes.
 The App Sketchbook has 50 Double-sided, perforated pages each with 3 
actual sized iPhone templates. Each page also has has 20px ruler 
markings and a ruled section for notes.
Vector Images
MetaSpark’s Fireworks Vectors
	 A collection of vector iPhone UI elements for Fireworks CS3 and CS4.
 A collection of vector iPhone UI elements for Fireworks CS3 and CS4.
320480 Stencil PSD file
	 Most iPhone screen elements, sensible layer sets all contained within one PSD file.
 Most iPhone screen elements, sensible layer sets all contained within one PSD file.
Graffletopia Stencil Kit for Omnigraffle
	 Graffletopia’s stencil kit for Omnigraffle.
 It is for quick sketching of iPhone ideas. Use the outline for 
printouts so you can hand sketch as well. The symbols are meant as a 
check list for included features in your app development.
 Graffletopia’s stencil kit for Omnigraffle.
 It is for quick sketching of iPhone ideas. Use the outline for 
printouts so you can hand sketch as well. The symbols are meant as a 
check list for included features in your app development.
MockApp
	 MockApp is a set of iPhone ui templates and library files put together for use in Powerpoint or Keynote.
 MockApp is a set of iPhone ui templates and library files put together for use in Powerpoint or Keynote.
Firefox Plug-ins
iPhone Prototype
	 This is a plug-in to browser Mozilla FireFox for prototyping interface 
of iPhone applications for creating an iPhone mock-up. Currently Alpha –
 not compatible with FF 3.55.
 This is a plug-in to browser Mozilla FireFox for prototyping interface 
of iPhone applications for creating an iPhone mock-up. Currently Alpha –
 not compatible with FF 3.55.
Firefox Pencil
	 Pencil is a free and opensource tool for making diagrams and GUI 
prototyping. Pencil runs on the Mozilla Gecko engine, turning the 
Firefox browser into a sketching tool with just a 400-kilobyte 
installation package.
 Pencil is a free and opensource tool for making diagrams and GUI 
prototyping. Pencil runs on the Mozilla Gecko engine, turning the 
Firefox browser into a sketching tool with just a 400-kilobyte 
installation package.
Fireworks Plug-ins
Unitid
	 This plug-in combines Fireworks with some jQuery and PHP to give you a 
prototype you can not only view, but interact with, directly on your 
iPhone, just as if it’s a live app.
 This plug-in combines Fireworks with some jQuery and PHP to give you a 
prototype you can not only view, but interact with, directly on your 
iPhone, just as if it’s a live app.
iPhone Apps
LiveView
	 Liveview is an iPhone app that consists of two parts: the ScreenCaster 
and the Application itself.  ScreenCaster launches a simple iPhone skin 
on your Mac. From the same network, launch the LiveView app in your 
iPhone. Whatever the ScreenCaster is highlighting is now seen in the 
LiveView App. It also interprets touches as mouse clicks, turning it 
into a two way interactive prototype.
 Liveview is an iPhone app that consists of two parts: the ScreenCaster 
and the Application itself.  ScreenCaster launches a simple iPhone skin 
on your Mac. From the same network, launch the LiveView app in your 
iPhone. Whatever the ScreenCaster is highlighting is now seen in the 
LiveView App. It also interprets touches as mouse clicks, turning it 
into a two way interactive prototype.
Web Based Tools
Mockingbird
	 Mockingbird is a web based mockup/wireframe tool built using the 
Cappucino framework, so there’s no flash to wrestle with. While you 
can’t actually design your mockups from an iPhone (who’d want to?), the 
tool does have some very handy features. You can drag elements onto the 
screen, create multiple pages, link to other pages and share directly 
from the web.
 Mockingbird is a web based mockup/wireframe tool built using the 
Cappucino framework, so there’s no flash to wrestle with. While you 
can’t actually design your mockups from an iPhone (who’d want to?), the 
tool does have some very handy features. You can drag elements onto the 
screen, create multiple pages, link to other pages and share directly 
from the web.
Pidoco
	 Pidoco is a web-based tool that lets you create clickable wireframes 
via drag & drop ui and then collaborate with remote users on each 
project. The tool also includes iPhone stencils.
 Pidoco is a web-based tool that lets you create clickable wireframes 
via drag & drop ui and then collaborate with remote users on each 
project. The tool also includes iPhone stencils.
iPhone Mockup
	 iPhone mockup is a web based tool that is currently in Alpha release 
only. You can design your mockup as a hand sketch or illustration, and 
mockups can contain user-uploaded images and user-entered text. Your 
mockups will be accessible via url so they are unsecured.
 iPhone mockup is a web based tool that is currently in Alpha release 
only. You can design your mockup as a hand sketch or illustration, and 
mockups can contain user-uploaded images and user-entered text. Your 
mockups will be accessible via url so they are unsecured.
The developer makes this perfectly clear and warns that he could discontinue hosting mockups at anytime, thereby deleting any work. That makes this a handy tool for quick and dirty mockups you want to print or share with someone on the fly, but not for much more.
Protoshare
	 Protoshare is a collaborative, web-based prototyping tool that helps 
teams visualize requirements for interactive projects and work together 
in real-time. It has an iPhone component that can be seen here.
 Protoshare is a collaborative, web-based prototyping tool that helps 
teams visualize requirements for interactive projects and work together 
in real-time. It has an iPhone component that can be seen here.
iPlotz
	 With iPlotz you can create clickable, navigable wireframes to create 
the experience of a real website or software application. You can also 
invite others to comment on the designs, and once ready, you can then 
manage the tasks for developers and designers to build the project.
 With iPlotz you can create clickable, navigable wireframes to create 
the experience of a real website or software application. You can also 
invite others to comment on the designs, and once ready, you can then 
manage the tasks for developers and designers to build the project.
Installed Software
CogTool
	 CogTool is a general purpose UI prototyping tool simply using a 
storyboard of your design idea with sketches, images or on a canvas. 
Demonstrate tasks on that storyboard, then press a button to produce a 
valid cognitive model predicting how long it will take a skilled user to
 complete those tasks.
 CogTool is a general purpose UI prototyping tool simply using a 
storyboard of your design idea with sketches, images or on a canvas. 
Demonstrate tasks on that storyboard, then press a button to produce a 
valid cognitive model predicting how long it will take a skilled user to
 complete those tasks.
Balsamiq
	 Balsamiq mockups is desktop software that is designed to help teams or 
clients collaborate on wireframes and mockups. There are iPhone specific
 controls included.
 Balsamiq mockups is desktop software that is designed to help teams or 
clients collaborate on wireframes and mockups. There are iPhone specific
 controls included.
OmniGraffle
OmniGraffle is award winning diagraming mockup or graphic design software. Combined with Graffletopia’s iPhone stencil kit, this software is a great addition to any app developers toolbox.
Justinmind Prototyper
	 Justinmind prototyper allows you to create fully functional wireframes 
for mobile applications and generate your HTML high-fidelity wireframes.
 Justinmind prototyper allows you to create fully functional wireframes 
for mobile applications and generate your HTML high-fidelity wireframes.
iRise
	 iRise for iPhones gives developers a way to quickly prototype the look,
 feel and behavior of Apple iPhone applications through pre-defined 
visualization widgets and templates that can be quickly assembled into a
 high definition mobile applications.
 iRise for iPhones gives developers a way to quickly prototype the look,
 feel and behavior of Apple iPhone applications through pre-defined 
visualization widgets and templates that can be quickly assembled into a
 high definition mobile applications.
'프로그래밍 > Script' 카테고리의 다른 글
| [javascript] Sencha-touch 개발환경 (0) | 2011.04.14 | 
|---|---|
| [javascript] 실무 웹앱 개발을 위한 jQuery Mobile 과 Sencha Touch 비교 (0) | 2011.04.13 | 
| [javascript] javascript Event.keycode 표 (0) | 2011.04.13 | 
| [도서구매] HTML CSS JAVASCRIPT로 IPHONE APPS 개발하기, 테스트 주도 개발 (1) | 2011.03.29 | 
| [도서구매] 나는 미처 몰랐네 그대가 나였다는 것을, 산색-죽창수필 선역, 실전JQUERY 쿡북 (2) | 2011.03.24 | 





