iMockups: Effortless Mobile App UI Design - InformationWeek
IoT
IoT
Government // Mobile & Wireless
News
2/10/2012
05:20 PM
Connect Directly
Twitter
Google+
RSS
E-Mail
50%
50%
RELATED EVENTS
Ransomware: Latest Developments & How to Defend Against Them
Nov 01, 2017
Ransomware is one of the fastest growing types of malware, and new breeds that escalate quickly ar ...Read More>>

iMockups: Effortless Mobile App UI Design

Use your iPad to quickly assemble user interfaces for mobile apps with no programming skill required.

Designing--or redesigning--a mobile app or Web page often starts with a pen and paper or whiteboard. Those with photo editing skills might use Adobe PhotoShop to mock up a design. Now, if you have an iPad, iMockups for iPad will let you quickly create these design mockups with input from co-workers or clients anywhere--as you stand in the hallway or sit in a coffeeshop.

There's an added bonus to using IMockups. This tool can also create interactive wireframe models for building visual elements which, for example, link to another app screen or Web page.

iMockups starts with a blank sheet for your iPhone app, iPad app, or Web page. The left and right sidebars seen below can be pushed away to dedicate the width of the display to your design work. The left sidebar displays the screens and Web pages associated with the current project; the right sidebar shows available mockup design elements.

First step: place the main design target on the sheet to create a visual frame of reference. You can see an iPhone template below.

Some of the design elements available for Web, iPhone, and iPad mockups are shown below. You can use any of these elements at any time. For instance, you can use an iPhone map element in your Web page template.

Tapping one of the design elements in the right side bar places it on the template. Elements can be dragged into position after that. Tapping on an element brings up an option bar like the one seen below.

Tapping the Info tab on a visual element's option bar brings up a configuration window specific to the element. The Tab Bar Info window seen below, for example, lets you change the number of tabs and the text label for each tab. It also lets you change font size and color; link to a different screen view; and tweak other other aspects of the tab bar.

Previous
1 of 2
Next
Comment  | 
Print  | 
More Insights
Comments
Newest First  |  Oldest First  |  Threaded View
How Enterprises Are Attacking the IT Security Enterprise
How Enterprises Are Attacking the IT Security Enterprise
To learn more about what organizations are doing to tackle attacks and threats we surveyed a group of 300 IT and infosec professionals to find out what their biggest IT security challenges are and what they're doing to defend against today's threats. Download the report to see what they're saying.
Register for InformationWeek Newsletters
White Papers
Current Issue
2017 State of IT Report
In today's technology-driven world, "innovation" has become a basic expectation. IT leaders are tasked with making technical magic, improving customer experience, and boosting the bottom line -- yet often without any increase to the IT budget. How are organizations striking the balance between new initiatives and cost control? Download our report to learn about the biggest challenges and how savvy IT executives are overcoming them.
Video
Slideshows
Twitter Feed
Sponsored Live Streaming Video
Everything You've Been Told About Mobility Is Wrong
Attend this video symposium with Sean Wisdom, Global Director of Mobility Solutions, and learn about how you can harness powerful new products to mobilize your business potential.
Flash Poll