BY:

JENHIL J ISSAC
22-UVC-012
 What is Graphical User Interface?
 How does a Graphical User Interface
works?
 Elements of the Graphical User Interface.
 Advantages and Disadvantages
WHAT IS GRAPHICAL USER
INTERFACE?
 HOW DOES A GRAPHICAL
USER INTERFACE WORKS?
 ELEMENTS OF THE GRAPHICAL USER
INTERFACE

To make a GUI as user-friendly as possible, there are different elements and objects that the
user use to interact with the software. Below is a list of each of these with a brief description.
• Button - A graphical representation of a button that performs an action in a program when
pressed
• Dialog box - A type of window that displays additional information, and asks a user for input.
• Icon - Small graphical representation of a program, feature, or file.
• Menu - List of commands or choices offered to the user through the menu bar.
• Menu bar - Thin, horizontal bar containing the labels of menus.
• Ribbon - Replacement for the file menu and toolbar that groups programs activities together.
• Tab - Clickable area at the top of a window that shows another page or area.
• Toolbar - Row of buttons, often near the top of an application window, that controls software
functions.
• Scroll bar – used in computer applications and websites to enable scrolling through content
that extends beyond the visible portion of a window or a container.
• Window - Rectangular section of the computer's display that shows the program currently
being used.
 BUTTON
A button is an interactive element in a GUI that allows a user to directly
communicate with the digital product and send the necessary commands to
achieve a particular goal. When you click a button with your mouse (or activate
some other item in a GUI), it creates an object known as an event and sends the
object to another object (or objects) known as the listener. This is called firing
the event. The listener then performs some action.

Home Rate Music Music Share Next Previous Image

Button Button Mute On Button Button Button Button
Button Button
 Camera Pause Stats Zoom
Button Button Button Button

No Yes Shop Settings Download Sound Mute

Button Button Button Button Button Button Button

Replay Delete Menu Remove Pause Help Stop

Button Button Button Ad Button Button Button
Button
 DIALOG BOX
A dialog box is a common type of window in the GUI of an operating
system. It is a graphical control element in the form of a small window
that communicates information to the user and prompts them for a
response. The dialog box displays additional information and asks a
user for input.

DIALOG
BOX
 ICONS
Icons are small graphical representations of a program, feature, or
file. They are used in graphical user interfaces (GUI) to represent files,
programs, web pages, etc. Icons are a fast way to open documents,
run programs, etc. because clicking on them yields instant access.

ICONS
 MENU
A menu is essentially a graphical control element that accesses
various elements on a GUI. It provides users with options and built-in
commands to access the features or functionalities of an application
or program, whether it's web-based or on the user's system.

Menu
 MENU BAR
A menu bar is a thin, horizontal bar
containing the labels of menus in a
GUI. It provides the user with a place in
a window to find program’s essential
functions, such as opening and
closing files, editing text, and quitting
the program. Menus are pull-down lists
of options that provide convenient
access to your application’s options. A
menu flyout shows a single, inline, top-
Menu Bar level menu that can have menu items
and sub-menus,
 RIBBON
A ribbon is a graphical control element in the form of a set of toolbars placed on
several tabs. The typical structure of a ribbon includes large, tabbed toolbars,
filled with graphical buttons and other graphical control elements, grouped by
functionality. Such ribbons use tabs to expose different sets of controls,
eliminating the need for numerous parallel toolbars.

Ribbon
 TAB
A tab in GUI is a graphical user interface object that allows multiple documents or
panels to be contained within a single window, using tabs as a navigational
widget for switching between sets of documents. It is commonly used in web
browsers, web applications, text editors, and preference panes. It is modeled after
traditional card tabs inserted in paper files or card indexes.

Tab
 TOOL BAR
A toolbar is a graphical user interface (GUI) widget on which on-screen buttons,
icons, menus, or other input or output elements are placed. It is a graphical user
interface (GUI) with buttons that allow users to execute software
commands. Toolbars are seen in many types of applications such as office suites,
graphics editors and web browsers.

Tool Bar
 SCROLL BAR
A scrollbar is a GUI component that allows us to see an invisible number of rows and columns.
It can be added to a top-level container like Frame or a component like Panel. The Scrollbar
class extends the Component class. It is used to display countless numbers of hidden rows and
columns in the window frame. Scrolling of the Scrollbar takes place in a range of integer
values. Users can move the scroll box to show hidden rows and columns on the window
frame.

Scroll Bar
 WINDOW
A window is a graphical control element. It consists of a visual area
containing some of the graphical user interface of the program it
belongs to and is framed by a window decoration. It usually has a
rectangular shape that can overlap with the area of other windows. It
displays the output of and may allow input to one or more processes.

Window
 ADVANTAGES
Graphical User Interfaces (GUIs) have many advantages. These
include:
• Simple to use and understand
• Convenient
• Don’t require prior computer knowledge to operate
• Allow for multitasking operations on the system
• Have instant results
• Enable an easy exchange of information between software using
cut and paste, or 'drag and drop'
• Are visually impactful and attractive
• Can be recognized faster than textual forms
• Have shortcut keys
 DISADVANTAGES
Disadvantages of GUI
• Implementation. Implementing a graphical user interface is not an
easy process as it seems while using it. ...
• Cost. The design of graphical user interface makes it more difficult
and costly to develop. It cannot be created by ordinary people.
• Speed. A graphical user interface involves lots of moving parts.
Hence, compared to command line interface a GUI is much slower.
• Time Consumption. Even though a graphical user interface is easy to
use, it is not the same when creating them. ...
• Memory Usage. Due to the usage of all graphical representations, a
graphical user interface typically uses more power and computer
memory than other types of interfaces.
 CONCLUSION
Graphical User Interface (GUI) is a visual interface that allows users
to interact with electronic devices through graphical icons and visual
indicators such as secondary notation, instead of text-based user
interfaces, typed command labels or text navigation. It is the result
of processed user input and usually the main interface for human-
machine interaction. Every operating system has its own Graphical
User Interface. Often different GUIs are layered inside one another.
Software applications even use their own GUI in addition to the
already provided GUI. Every internet browser allows users to
navigate through websites having their own Graphical User
Interface.
 Reference

1. What is a GUI (Graphical User Interface)? (computerhope.com)

2. Graphical user interface – Wikipedia
3. www.conceptdraw.com/examples/windows-gui
4. What Is a Graphical User Interface (GUI)? | Built In