Products Solutions Samples Buy
✕
This site uses cookies. By continuing to browse the ConceptDraw site you are agreeing to our Use of Site Cookies.
Try ConceptDraw Free
This UI design example shows common icons of Android applications on the App Drawer screen of Google Nexus 6 smartphone.
The user interface design example "Android 5.0 - App drawer" was created using the ConceptDraw PRO diagramming and vector drawing software extended with the "Android user interface" solution from the "Software Development" area of ConceptDraw Solution Park.
App Drawer UI
App Drawer UI, vibration icon, status bar, signal wifi 4 bar icon, signal cellular 3 bar icon, page control, navigation bar, file upload icon, dimmed background, cards, bluetooth icon, battery 80 icon, app icon text label, Settings Google icon, Nexus 6, Maps icon, Keep icon, Hangouts icon, Google plus icon, Google icon , Gmail icon, Fit icon, Email icon, Earth icon, Drive icon, Downloads icon, Docs icon, Contacts icon, Clock icon, Chrome icon, Camera icon, Calendar icon, Calculator icon, Browser icon, Android wallpapers,
Used Solutions
This Android 5 UI design example shows Gmail screen of Google Nexus 6 smartphone.
The user interface design example "Android 5.0 - Gmail" was created using the ConceptDraw PRO diagramming and vector drawing software extended with the "Android user interface" solution from the "Software Development" area of ConceptDraw Solution Park.
Gmail screen
Gmail screen, status bar, signal wifi statusbar 3 bar, status bar icon, signal cellular 2 bar, send icon, navigation bar, menu icon, keyboard, full-width text field, character counter, full-width text field, closed contact chip, chevron right icon, battery, backspace, arrow back icon, app bar, Nexus 6,
Used Solutions

android ui design, android gui, android ui design tool, android user interface Android User Interface‏

android ui design, android gui, android ui design tool, android user interface
The Android User Interface solution allows ConceptDraw DIAGRAM act as an Android UI design tool. Libraries and templates contain a variety of Android GUI elements to help users create images based on Android UI design.

Android GUI

Android GUI *
Android is an operating system based on the Linux kernel and developed by Google for smartphones, tablet computers, electronic books, netbooks, smartbooks, digital players, watches, game consoles, TV and other devices.
ConceptDraw DIAGRAM extended with Android User Interface Solution from the Software Development Area is a powerful software with extensive drawing tools which can help you to build the intelligible, attractive and easy for perception Android GUI for your application.
This Android 7 user interface sample illustrates implementation of Android Material Design contact chips.
"Chips represent complex entities in small blocks, such as a contact.
A chip may contain entities such as a photo, text, rules, an icon, or a contact.
Contact chips may represent contact information in a compact way. ...
A chip may contain a photo, short title, and brief information. ...
Chips can be used for various types of entities, including free form text, predefined text, rules, or contacts. Chips may also contain icons." [material.io/ guidelines/ components/ chips.html]
The Android 7 UI design example "Contact chips" was created using the ConceptDraw PRO diagramming and vector drawing software extended with the "Android user interface" solution from the "Software Development" area of ConceptDraw Solution Park.
Contact chips
Contact chips, ui element shadow, text description, status bar, signal wifi statusbar 3 bar, status bar icon, signal cellular 2 bar, send icon, screen, open contact chip, navigation bar, app bar, navigation bar, list item, chips, list item, full-width text field, full-width inline auto-complete text field, drawing shapes, close icon, battery, arrow back icon, activated list item, chips, activated list item, Android chips, contact chip, Android chips,
Used Solutions
This Android 5 UI design example shows Gmail screen of Google Nexus 6 smartphone.
The user interface design example "Android 5.0 - Gmail" was created using the ConceptDraw PRO diagramming and vector drawing software extended with the "Android user interface" solution from the "Software Development" area of ConceptDraw Solution Park.
Gmail screen
Gmail screen, status bar, signal wifi statusbar 3 bar, status bar icon, signal cellular 2 bar, send icon, navigation bar, menu icon, keyboard, full-width text field, character counter, full-width text field, closed contact chip, chevron right icon, battery, backspace, arrow back icon, app bar, Nexus 6,
Used Solutions
"Smaller mobile devices such as PDAs and smartphones typically use the WIMP elements with different unifying metaphors, due to constraints in space and available input devices. Applications for which WIMP is not well suited may use newer interaction techniques, collectively named as post-WIMP user interfaces.
As of 2011, some touch-screen-based operating systems such as Apple's iOS (iPhone) and Android use the class of GUIs named post-WIMP. These support styles of interaction using more than one finger in contact with a display, which allows actions such as pinching and rotating, which are unsupported by one pointer and mouse." [Graphical user interface. Wikipedia]
"In computing post-WIMP comprises work on user interfaces, mostly graphical user interfaces, which attempt to go beyond the paradigm of windows, icons, menus and a pointing device, i.e. WIMP interfaces. ...
However WIMP interfaces are not optimal for working with complex tasks such as computer-aided design, working on large amounts of data simultaneously, or interactive games. WIMPs are usually pixel-hungry, so given limited screen real estate they can distract attention from the task at hand. Thus, custom interfaces can better encapsulate workspaces, actions, and objects for specific complex tasks. Applications for which WIMP is not well suited include those requiring continuous input signals, showing 3D models, or simply portraying an interaction for which there is no defined standard widget.
Interfaces based on these considerations, now called "post-WIMP", have made their way to the general public. Examples include the interface of the classic MP3 player iPod and a bank's automated teller machine screen." [Post-WIMP. Wikipedia]
The example "iPhone OS (iOS) graphic user interface (GUI) - Activity indicator view" was created using the ConceptDraw PRO diagramming and vector drawing software extended with the Graphic User Interface solution from the Software Development area of ConceptDraw Solution Park.
iPhone GUI
iPhone GUI, toolbar, status bar, activity indicator, status bar, simple list, navigation bar, controls, activity indicator,
Used Solutions
The vector stencils library "Android system icons - device" contains 86 device pictograms.
Use this icon set to design user interface of your Android application.
The icons example "Design elements - Android system icons (device)" was created using the ConceptDraw PRO diagramming and vector drawing software extended with the "Android user interface" solution from the "Software Development" area of ConceptDraw Solution Park.
Device system icons
Device system icons, wifi tethering icon, wifi lock icon, usb icon, storage icon, signal wifi statusbar null icon, signal wifi statusbar not connected icon, signal wifi statusbar connected no internet icon, signal wifi statusbar connected no internet 4 icon, signal wifi statusbar connected no internet 3 icon, signal wifi statusbar connected no internet 2 icon, signal wifi statusbar connected no internet 1 icon, signal wifi statusbar 4 bar icon, signal wifi statusbar 3 bar icon, signal wifi statusbar 2 bar icon, signal wifi statusbar 1 bar icon, signal wifi off icon, signal wifi 4 bar icon, signal wifi 3 bar icon, signal wifi 2 bar icon, signal wifi 1 bar icon, signal wifi 0 bar icon, signal cellular off icon, signal cellular null icon, signal cellular no sim icon, signal cellular connected no internet 4 bar icon, signal cellular connected no internet 3 bar icon, signal cellular connected no internet 2 bar icon, signal cellular connected no internet 1 bar icon, signal cellular connected no internet 0 bar icon, signal cellular 4 bar icon, signal cellular 3 bar icon, signal cellular 2 bar icon, signal cellular 1 bar icon, signal cellular 0 bar icon, settings system daydream icon, sd storage icon, screen rotation icon, screen lock rotation icon, screen lock portrait icon, screen lock landscape icon, now widgets icon, now wallpaper icon, nfc icon, network wifi icon, network cell icon, multitrack audio icon, location searching icon, location disabled icon, gps off icon, gps not fixed icon, gps fixed icon, dvr icon, devices icon, developer mode icon, data usage icon, brightness medium icon, brightness low icon, brightness high icon, brightness auto icon, bluetooth searching icon, bluetooth icon, bluetooth disabled icon, bluetooth connected icon, battery unknown icon, battery std icon, battery full icon, battery charging full icon, battery charging 90 icon, battery charging 80 icon, battery charging 60, battery charging 50 icon, battery charging 30 icon, battery charging 20 icon, battery alert icon, battery 90 icon, battery 80 icon, battery 60 icon, battery 50 icon, battery 30 icon, battery 20 icon, airplanemode on icon, airplanemode off icon, add alarm icon, access time icon, access alarms icon, access alarm icon,
Used Solutions
The vector stencils library "Android system icons - places" contains 19 system icons.
Use it to design user interface of your software applications for Android OS with ConceptDraw PRO software.
"Material icons use geometric shapes to visually represent core ideas, capabilities, or topics. ...
System icons represent a command, file, device, directory, or common actions. ...
A system icon, or UI icon, symbolizes a command, file, device, or directory. System icons are also used to represent common actions like trash, print, and save.
The design of system icons is simple, modern, friendly, and sometimes quirky. Each icon is reduced to its minimal form, with every idea edited to its essence. The designs ensure readability and clarity even at small sizes." [material.io/ guidelines/ style/ icons.html]
The system icons example "Design elements - Android system icons (places)" is included in the "Android user interface" solution from the "Software Development" area of ConceptDraw Solution Park.
Places system icons
Places system icons, spa icon, smoking rooms icon, smoke free icon, rv hookup icon, room service icon, pool icon, kitchen icon, hot tub icon, golf course icon, free breakfast icon, fitness center icon, child friendly icon, child care icon, casino icon, business center icon, beach access icon, all inclusive icon, airport shuttle icon, ac unit icon,
Used Solutions
This Android 5 UI design example shows notifications on Lock screen of Google Nexus 6 smartphone.
The user interface design example "Android 5.0 - Lock screen notifications" was created using the ConceptDraw PRO diagramming and vector drawing software extended with the "Android user interface" solution from the "Software Development" area of ConceptDraw Solution Park.
Lock screen notifications UI
Lock screen notifications UI, warning icon, timestamp, signal wifi statusbar 4 bar icon, signal cellular null icon, shop two icon, photo camera icon, notifications, notification title, notification message, lock open icon, dimmed background, contracted notification, time-sensitive notification, call icon, battery full icon, avatar, photo, account circle icon, Nexus 6, Android wallpapers,
Used Solutions
The vector stencils library "Android UI" contains 28 UI elements: screen, status bar, app bar, divider, navigation bar, page control, tab, search bar, flexible space, keyboard, cursor tooltip, touch UI tooltip, index scroller, Google Nexus 6 smartphone, Google Nexus 9 tablet.
Use it to design user interface of your Android 5 application.
The shapes example "Design elements - Android UI" was created using the ConceptDraw PRO diagramming and vector drawing software extended with the "Android user interface" solution from the "Software Development" area of ConceptDraw Solution Park.
User interface elements
User interface elements, ui element shadow, touch ui tooltip, tab bar, search bar, status bar, signal wifi statusbar 3 bar, status bar icon, signal cellular 2 bar, scrollbar, screen, page control, navigation bar, app bar, navigation bar, menu icon, keyboard, index scroller, scrollbar, index scroller notification, flexible space, divider, cursor tooltip, keyboard tooltip, battery, backspace, app bar, Nexus 9, Nexus 6,
Used Solutions
This Android 5 UI design example shows New chat screen of Google Nexus 6 smartphone.
The user interface design example "Android 5.0 - Single-line list" was created using the ConceptDraw PRO diagramming and vector drawing software extended with the "Android user interface" solution from the "Software Development" area of ConceptDraw Solution Park.
Single-line list UI
Single-line list UI, status bar, single-line list, signal wifi statusbar 3 bar, status bar icon, signal cellular 2 bar, search icon, navigation bar, messenger icon, menu icon, list subheader, list divider, icon square, floating action button, battery, avatar, app bar, add icon, Nexus 6,
Used Solutions

Graphical User Interface Examples

Graphical User Interface Examples
ConceptDraw DIAGRAM extended with Windows 8 User Interface solution from the Software Development area is the best gui software. Using the drawing tools, libraries of vector objects, graphical user interface examples that offers Windows 8 User Interface solution, you will easily design the Windows 8 user interfaces and Windows 8 UI design patterns of any complexity.
This Android 5 UI design example shows New chat screen of Google Nexus 6 smartphone.
The user interface design example "Android 5.0 - Single-line list" was created using the ConceptDraw PRO diagramming and vector drawing software extended with the "Android user interface" solution from the "Software Development" area of ConceptDraw Solution Park.
Single-line list UI
Single-line list UI, status bar, single-line list, signal wifi statusbar 3 bar, status bar icon, signal cellular 2 bar, search icon, navigation bar, messenger icon, menu icon, list subheader, list divider, icon square, floating action button, battery, avatar, app bar, add icon, Nexus 6,
Used Solutions
"The interface is based around the home screen, a graphical list of available applications. iPhone applications normally run one at a time. Starting with the iPhone 4, a primitive version of multitasking came into play. Users could double click the home button to select recently opened. However, the apps never ran in the background. Starting with iOS 7, though, apps can truly multitask, and each open application runs in the background when not in use, although most functionality is still available when making a call or listening to music. The home screen can be accessed at any time by a hardware button below the screen, closing the open application in the process.
By default, the Home screen contains the following icons: Messages (SMS and MMS messaging), Calendar, Photos, Camera, YouTube, Stocks, Maps (Google Maps), Weather, Voice Memos, Notes, Clock, Calculator, Settings, iTunes (store), App Store, (on the iPhone 3GS and iPhone 4) Compass, FaceTime and GameCenter were added in iOS 4.0 and 4.1 respectively. In iOS 5, Reminders and Newsstand were added, as well as the iPod application split into separate Music and Videos applications. iOS 6 added Passbook as well as an updated version of Maps that relies on data provided by TomTom as well as other sources. iOS 6 also added a Clock application onto the iPad's homescreen. However, it also no longer support YouTube. Docked at the base of the screen, four icons for Phone, Mail, Safari (Internet), and Music delineate the iPhone's main purposes. On January 15, 2008, Apple released software update 1.1.3, allowing users to create "Web Clips", home screen icons that resemble apps that open a user-defined page in Safari. After the update, iPhone users can rearrange and place icons on up to nine other adjacent home screens, accessed by a horizontal swipe." [iPhone. Wikipedia]
The example "iPhone OS (iOS) graphic user interface (GUI) - Alarm setting" was created using the ConceptDraw PRO diagramming and vector drawing software extended with the Graphic User Interface solution from the Software Development area of ConceptDraw Solution Park.
iPhone GUI
iPhone GUI, switch control, status bar, screen, navigation bar, iPhone, grouped list, list, date and time picker, control button,
Used Solutions
This example shows iPhone 6 Notification Center screen.
"Notification Center is a feature in iOS and OS X that provides an overview of alerts from applications. It displays notifications until the user completes an associated action, rather than requiring instant resolution. Users may choose what applications appear in Notification Center, and how they are handled. Initially released with iOS 5 in October 2011... Notification Center was released in iOS 5 to replace the previous system for dealing with push and local notifications. Instead of interrupting the user with an alert, Notification Center instead displays a banner at the top of the screen. This allows the user to continue using their device, and disappears after a set period of time. All previous notifications are collated into the Notification Center panel, which can be displayed in iOS by dragging down from the status bar... Notification Center on iPhone and iPod Touch also includes Weather and Stocks widgets, displaying information on the weather at the user's current location, and any stocks that the user has selected in the Stocks application." [Notification Center. Wikipedia]
The sample "Notification Center" was created using the ConceptDraw PRO diagramming and vector drawing software extended with the iPhone User Interface solution from the Software Development area of ConceptDraw Solution Park.
iPhone screen - Notification Center
iPhone screen - Notification Center, wifi icon, table view cell, table view, switch on, switch off, status bar, navigation bar, menu bar, label, iPhone 6, button text label, bluetooth icon, back button,
Used Solutions
The vector stencils library "iPhone interface" contains 119 iPhone UI design elements.
Use it for development of graphic user interface (GUI) for iPhone software applications in the ConceptDraw PRO diagramming and vector drawing software extended with the Graphic User Interface solution from the Software Development area of ConceptDraw Solution Park.
iPhone case
iPhone case, iPhone case,
iPhone case, horizontal
iPhone case, horizontal, iPhone case,
Display
Display, display,
Screen
Screen, screen,
Home screen
Home screen, home screen,
Keypad control
Keypad control, keypad, keypad control,
Status bar
Status bar, status bar,
Navigation bar
Navigation bar, navigation bar,
Navigation bar with buttons
Navigation bar with buttons, navigation bar,
Navigation bar with controls
Navigation bar with controls, navigation bar,
Navigation bar with controls
Navigation bar with controls, navigation bar,
Navigation bar with buttons, horizontal
Navigation bar with buttons, horizontal, navigation bar,
Navigation bar with controls, horizontal
Navigation bar with controls, horizontal, navigation bar,
Modal view
Modal view, modal view,
Search bar
Search bar, search bar,
Text field 1
Text field 1, text field,
Text field 2
Text field 2, text field,
Text field, varying
Text field, varying, text field,
Table row
Table row, table view row,
Table view row
Table view row, table view row,
Table view (simple list)
Table view (simple list), table view, list,
Table view (with header)
Table view (with header), table view with header, indexed list,
Action list
Action list, action list, grouped list, table,
Control button
Control button, control button,
Navigational control button
Navigational control button, navigational control button,
Add button
Add button, add button, plus button,
Navigation toolbar
Navigation toolbar, navigation toolbar, toolbar,
Tab bar
Tab bar, tab bar,
Action sheet
Action sheet, action sheet,
Choice button
Choice button, choice button,
Rounded rectangle button
Rounded rectangle button, rounded rectangle button,
Keyboard control
Keyboard control, keyboard,
Keyboard literal button
Keyboard literal button, keyboard literal button,
Keyboard button, pressed
Keyboard button, pressed, keyboard button pressed,
Keyboard label button
Keyboard label button, keyboard label button,
Selection frame 1
Selection frame 1, selection frame,
Selection frame 2
Selection frame 2, selection frame,
Loupe
Loupe, loupe,
Message box 1
Message box 1, message box,
Message box 2
Message box 2, message box,
Progress view
Progress view, progress view,
Progress view
Progress view, progress view,
Progress view
Progress view, progress view,
Player control
Player control, player,
Label button
Label button, label button,
Back button
Back button, back button,
Forward button
Forward button, forward button,
Option button
Option button, option button,
Checkbox
Checkbox, checkbox,
Radio button
Radio button, radio button,
Alert
Alert, alert,
Two-button alert
Two-button alert, alert,
Two-button alert (v 3.0)
Two-button alert (v 3.0), alert,
Up-Down control
Up-Down control, up-down, stepper,
Segmented control
Segmented control, segmented control,
Segmented control
Segmented control, segmented control,
Segmented control
Segmented control, segmented control,
Segmented control
Segmented control, segmented control,
Pop-up menu button
Pop-up menu button, pop-up menu button,
Popup menu
Popup menu, pop-up menu, segmented control,
Clock, white
Clock, white, clock,
Clock, black
Clock, black, clock,
Clock application table
Clock application table,
Date and time picker (1/2 parts)
Date and time picker (1/2 parts), date and time picker,
Date and time picker (3 parts)
Date and time picker (3 parts), date and time picker,
Date and time picker (4 parts)
Date and time picker (4 parts), date and time picker,
Date and time picker (v 3.0)
Date and time picker (v 3.0), date and time picker,
Switch control
Switch control, switch,
System button
System button, system button,
Reply button
Reply button, reply button,
Organize button
Organize button, organize,
Remove button
Remove button, remove,
Refresh button
Refresh button, refresh,
Play button
Play button, play,
FastForward button
FastForward button, fastforward,
Pause button
Pause button, pause,
Rewind button
Rewind button, rewind,
Backward icon
Backward icon, backward,
Forward icon
Forward icon, forward,
Share button
Share button, share,
Camera button
Camera button, camera,
Compose button
Compose button, compose,
Bookmarks button
Bookmarks button, bookmarks,
Search button
Search button, search,
Add button
Add button, add,
Trash button
Trash button, trash,
Bookmarks tab icon
Bookmarks tab icon, bookmarks tab icon,
Contacts tab icon
Contacts tab icon, contacts tab icon,
Downloads tab icon
Downloads tab icon, downloads tab icon,
Favorites tab icon
Favorites tab icon, favorites tab icon, featured, top rated ,
Featured tab icon
Featured tab icon, featured tab icon,
History tab icon
History tab icon, history tab icon,
MostRecent tab icon
MostRecent tab icon, most recent tab icon,
MostViewed tab icon
MostViewed tab icon, most viewed tab icon,
Search tab icon
Search tab icon, search tab icon,
More tab icon
More tab icon, more tab icon,
SMS tab icon
SMS tab icon, sms tab icon,
Mail tab icon
Mail tab icon, mail tab icon,
Charts tab icon
Charts tab icon, charts tab icon,
World clock tab icon
World clock tab icon, world clock tab icon,
Alarm tab icon
Alarm tab icon, alarm tab icon,
Stopwatch tab icon
Stopwatch tab icon, stopwatch tab icon,
Timer tab icon
Timer tab icon, timer tab icon,
Badge
Badge, badge,
Delete button control
Delete button control , delete,
Checkmark
Checkmark, checkmark badge,
Delete button
Delete button, delete button,
Insert
Insert, row insert, plus, add,
Disclosure indicator
Disclosure indicator, disclosure indicator,
Clear button
Clear button, clear, delete badge,
Bookmarks badge
Bookmarks badge, bookmarks,
Badge with varying width 1
Badge with varying width 1, badge,
Badge with varying width 2
Badge with varying width 2, badge,
Badge with varying width 3
Badge with varying width 3,
Activity indicator
Activity indicator, activity indicator,
Network activity indicator
Network activity indicator, network activity indicator,
Page control
Page control, page control, page indicator,
Search badge
Search badge, search,
Slider
Slider, slider,
Used Solutions
The vector stencils library "Bars" contains 16 iOS apps GUI views: menu bar, navigation bar, search bar, status bar, tab bar, toolbar, wifi icon, bluetooth icon, power icon, plus button, back button.
Use the library "Bars" to draw bar views in your design of iPhone software applications user interface sketches, mockups and prototypes.
The iOS GUI views sample "Design elements - Bars" was created using the ConceptDraw PRO diagramming and vector drawing software extended with the iPhone User Interface solution from the Software Development area of ConceptDraw Solution Park.
iOS GUI views: Bars
iOS GUI views: Bars, wifi icon, toolbar, tab bar, search bar, power icon, battery, plus, add, navigation bar, menu bar, navigation bar, bluetooth icon, back button,
Used Solutions
This Android 7 user interface example illustrates usage of Android Material Design single-line grid list.
"Grid lists are an alternative to standard list views.
A grid list consists of a repeated pattern of cells arrayed in a vertical and horizontal layout.
Grid lists are best used on similar data types. They help improve the visual comprehension of the content they contain. ...
A grid list is best suited to presenting homogenous data, typically images, and is optimized for visual comprehension and differentiating between similar data types. ...
A grid list consists of a repeated pattern of cells arrayed vertically and horizontally within the grid list.
Tiles hold content and can span one or more cells vertically or horizontally." [material.io/ guidelines/ components/ grid-lists.html]
The Android 7 UI design example "Single-line grid list" was created using the ConceptDraw PRO diagramming and vector drawing software extended with the "Android user interface" solution from the "Software Development" area of ConceptDraw Solution Park.
Single-line grid list
Single-line grid list, status bar, single-line header, single-line footer, signal cellular 4 bar icon, search icon, screen, network wifi icon, navigation bar, grid list element, battery full icon, arrow back icon, app bar, toolbar, Nexus 6,
Used Solutions

GUI Prototyping with ConceptDraw DIAGRAM

GUI Prototyping with ConceptDraw DIAGRAM *
All about prototyping. GUI Prototyping with ConceptDraw. Download prototyping software.
Download ConceptDraw PRO
Free 21 Trial for Mac and PC
Buy Now