iPhone User Interface

The iPhone User Interface solution for ConceptDraw PRO v10 is now extended with a range of new samples, templates, and vector stencils libraries that support iPhone 6 UI diagrams. These new additions to ConceptDraw Solution Park provide users with graphical user interface elements, UI patterns, and App icons that greatly simplify GUI interface prototyping of new iOS applications.


There are 9 stencil libraries containing 153 vector shapes from iPhone graphical user interface.

Design Elements — iPhone Graphical User Interface

Design Elements — iPhone Graphical User Interface

Design Elements — iPhone 6 Mockup

Design Elements — iPhone 6 Mockup

Design Elements — Controls

Design Elements — iPhone Controls

Design Elements — iMessage

Design Elements — iPhone iMessage

Design Elements — Tab Bar Icons

Design Elements — iPhone Tab Bar Icons

Design Elements — Toolbar and Navigation Bar Buttons

Design Elements — iPhone Toolbar and Navigation Bar Buttons

Design Elements — Bars

Design Elements — iPhone Bars

Examples

The samples you see on this page were created in ConceptDraw PRO using the ConceptDraw iPhone Interface Solution; they demonstrate a portion of the solution's capabilities and the professional results you can achieve.

All source documents are vector graphic documents. They are available for reviewing, modifying, or converting to a variety of formats (PDF file, MS PowerPoint, MS Visio, and many other graphic formats) from the ConceptDraw Solution Park. The iPhone Interface Solution is available for all ConceptDraw PRO v10 users.

Example 1: iPhone Graphical User Interface — Contact Card

This diagram was created in ConceptDraw PRO using the iPhone 6 Mockup and Bars libraries from the iPhone User Interface solution. An experienced user spent 10 minutes creating this sample.

The iPhone is a popular line of smartphone, designed and marketed by Apple Inc. This success takes place thanks to project managers, software engineers, GUI interface designers, GUI developers, workers of advertising companies, and many other people that have every day design needs for various GUI interfaces and iPhone iOS applications.

GUI interface — Contact Card

Example 2: Graphical User Interface — iPhone 6 Home Screen

This diagram was created in ConceptDraw PRO using the iPhone 6 Mockup, Apps Icons, and Bars libraries from the iPhone User Interface solution. An experienced user spent 10 minutes creating this sample.

This sample shows the iPhone 6 graphical user interface. It is based on the Home Screen that represents a list of available applications. All graphical elements of applications that you see on this sample are available from the Apps Icons library from iPhone User Interface solution.

Graphical user interface — iPhone 6 Home Screen

Example 3: iPhone Graphical User Interface — Messages

This diagram was created in ConceptDraw PRO using the iPhone 6 Mockup, iMessage, and Bars libraries from the iPhone User Interface Solution. An experienced user spent 10 minutes creating this sample.

What is a user interface (UI)? The user interface is the point of access into an information device for the user; it is the screen you are looking at, the icons you are clicking. People need a UI that is clear and convenient, it’s very important.

What is user interface (UI)?

Example 4: iPhone Graphical User Interface — Settings Included Apps

TThis diagram was created in ConceptDraw PRO using the iPhone 6 Mockup, App Icons, Content Views, and Bars libraries from the iPhone User Interface solution. An experienced user spent 10 minutes creating this sample.

The iPhone runs Apple's iOS mobile operating system. By default, an iPhone contains a variety of installed iOS applications for main user purposes, the icons for which can be found on the home screen. An overview of alerts from applications is available from iPhone Settings Notification Center that is illustrated in this sample.

 iPhone Graphical User Interface

Example 5: iPhone Graphical User Interface — Reminders

This diagram was created in ConceptDraw PRO using the iPhone 6 Mockup, Content Views, Controls, and Bars libraries from the iPhone User Interface Solution. An experienced user spent 10 minutes creating this sample.

This sample shows the interface of the iPhone Reminders application. It is one of the applications for Apple iOS. Quickly outline existing iPhone interfaces, or design your own interface for a new application using the pre-designed vector graphical user interface elements.

UI patterns

Inside

iPhone User Interface Solution for Macintosh

iPhone User Interface Solution for Windows

What I Need to Get Started

ConceptDraw PRO v10 and the “iPhone User Interface” solution, found in the Software Development area of ConceptDraw Solution Park, are all you need to get started. Make sure both are installed on your computer.

How to install

Download and install ConceptDraw Solution Browser and ConceptDraw PRO. Next, install the “iPhone User Interface” solution using Solution Browser.

iPhone User Interface Solution — Install

Start using

iPhone User Interface Solution — Start using

iPhone User Interface

Since Apple Computer, Inc. became Apple Inc. at the start of 2007, they have led the field in mobile device technology, acquiring a devoted following amongst a general public that happily purchases each new updated version of the iPhone, iPad or iPod. They are noted innovators, popularizing many interface standards within the industry including touchscreen elements and app technologies.

The operating system used to power their devices was created and developed by Apple Inc. exclusively for their hardware, giving a sense of hegemony across the various platforms, and encouraging users to purchase multiple Apple products. Named iOS, it works on the basis of direct manipulation, where pre-defined multi-touch gestures are used to navigate through the operating system — a combination of swipes, taps and pinches allow users to zoom in and out, switch screens and select menu buttons.

UI patterns

ConceptDraw PRO was used to create this sample template of an iPhone reminders page

The key to effective and efficient navigation, for best cohesion with operating system logic, is a well designed graphical user interface (GUI). A GUI aims to offer a consistent visual language to display app windows, system information, menus and icons in an intuitive fashion, with the expectation that those unfamiliar with the technology can pick up a device and immediately access the software they need.

The iPhone GUI has become something of a standard for smartphones, and tablets and mobile devices in general. It starts with a 'Home' screen, and a list of commonly used applications represented by graphical icons. These tend to include messaging, time and date, camera, weather and maps apps, and a number of affiliate applications such as YouTube, iTunes and the App Store. Adjacent home screens can hold further apps, and can be accessed by swiping the screen left or right. Anchored to the bottom of the screen are the four apps that represent the iPhone's main purposes — phone, mail, internet and music.

Graphical user interface — iPhone 6 Home Screen

A diagram view of an iPhone home screen, created using ConceptDraw PRO

A successful GUI requires a planning stage, to determine the suitability and efficiency of certain arrangements. Much like with website planning, a GUI wireframe diagram can be employed to give a skeletal view of the device's screen, upon which elements can be placed and re-arranged as necessary. For GUI developers, designers, or graphic artists working on advertising or infographics, iPhone UI prototype diagrams can help illustrate certain points, and convey messages about usability.

By extending the functionality of ConceptDraw PRO with the iPhone User Interface solution, users have access to a wide range of icon libraries, samples, templates and help materials to help them create professional looking GUI diagrams that showcase iPhone 6 applications and technology.

The app icon library from the iPhone User Interface solution for ConceptDraw PRO

Within the vector stencil libraries are graphic icons depicting all the necessary elements of an iPhone 6 UI, including menu controls, tab bar icons, toolbars, navigation buttons, and of course icons for all the apps you might expect to find on your iPhone home screen. To make the design process even easier, there a number of ready made templates featuring some of the more popular screens and features users come across during everyday use. As with all ConceptDraw solutions, dedicated help materials are available from the website, to provide designers and artists with the tips and tricks necessary to replicate the iPhone 6 UI with the best possible results.