While conceptualizing your App, the first things you need to create is a flow chart of how your App will behave and some reference templates and images that will show you how each screen will look in your App.
The first step to doing this is to get hold of a pencil and paper and make some rough sketches. Start by making a list of all the possible screens your app will have and then actually listing the functionality each screen will have. Once you have that, you can proceed to make some dummy mockup sketches. At this point you should focus on the “placement” elements of each screen… that is decide, what goes where. Next you can start to imagine the design elements and look and feel of each screen – and how they will all look similar and connect to one another. A flow chart showing how the connect up – will help. I suggest you get hold of a spiral bound sketch book and not lose sheets of paper, that can easily get misplaced. Any writing pad will also do.
To help you make your hard copy and soft copy drawings, these downloadable documents and plans will help you. They will be useful when you are brainstorming or trying to find the perfect flow for your app and putting the visual elements together.
- Mock App – Templates for Keynote and Powerpoint
- OmniGraffle Software for Mac – Need a diagram, process chart, quick page-layout, website wireframe or graphic design?
- iPhone Stencils for OmniGraffle
- iPhone Wire Frames for OmniGraffle
- iPhone GUI Elements – Layered image files of iPhone GUI in .PSD format for Photoshop
- More iPhone Interface Elements – more .PSD files for Photoshop
- iPhone UI Vector Elements – Vector format of visual elements and icons in Adobe Illustrator format.
- Yahoo Design Stencils – Yahoo! Design Stencil Kit version 1.0 is available for OmniGraffle, Visio (XML), Adobe Illustrator (PDF and SVG), and Adobe Photoshop (PNG)
Download each of the above packs and files as they are all must have tools when you or your graphic artist are planning the User Interface or graphic design of your Apps.
Dapp does code generation too apart from the ‘mocking’ of the functions
I’ve been greatly disappointed in the iPad-specific mockup apps. For me, only OmniGraffle with stencils fills the bill for creating realistic designs.