SlideShare una empresa de Scribd logo
1 de 14
BIRLA INSTITUTE OF TECHNOLOGY
MESRA ,JAIPUR CAMPUS
TOPIC : ICONS, IMAGES & MULTIMEDIA
PRESENTED BY :
MEGHAJ KUMAR MALLICK
(MCA/25017/18)
2ND YEAR ,4TH SEMESTER
FACULTY:
DR. ARCHANA BHATNAGAR
ICONS IN GUI
• In a computer's graphical user interface (GUI),
an icon (pronounced EYE-kahn ) is an image that represents
an application, a capability, or some other concept or specific
entity with meaning for the user.
INTRODUCTION OF ICONS
• An icon is a pictogram or ideogram displayed on a computer screen in
order to help the user navigate a computer system.
• The icon itself is a quickly comprehensible symbol of a software tool,
function, or a data file, accessible on the system.
• The user can activate an icon using a mouse, pointer, finger, or
recently voice commands.
ADVANTAGES OF ICONS
• It provides clarity, adds visual interest, and
reinforces a company’s brand.
• The benefit of providing labels with icons is
that you can introduce new features and be
reassured that your users will know what to
expect when they interact with it.
DISADVANTAGE OF ICONS
• Using icons-only should be reserved for specific conditions where screen
space is limited and the feature is common and familiar to the user.
• The problem with using icons by themselves is that their meaning can be
vague, especially when introducing a new feature.
• Many users won’t start clicking buttons to find what they need if it isn’t
immediately obvious. The uncertainty of an icon’s function puts the user
in a state of doubt.
• It requires them to think about the icon instead of focusing on their task.
Worst case scenario is the user accidentally clicks on something and the
result is undesirable and potentially irreversible.
USE OF IMAGES
• Simple fact, people perceive images faster than words.
• In other words, if you want to deliver a statement or an important
message, use an image to support it.
• In this case, it will be an illustration, which can easily clarify what words
cannot. Keep in mind, that when the user lands on a website or opens the
app, they don't start reading right away, they scan.
• If a screen is boring and full of text, the user will most probably leave.
• Simple illustrations with supporting text can easily explain the most crucial
functionalities and interactions. Illustrations have both explanatory and
eye-catching effect.
USE OF IMAGE IN WEBPAGE
ADVANTAGE OF IMAGE
• Attention of users:
• Illustrations are not only creating visual hierarchy and can support visual
division on screen, but they also draw attention to the most important
parts of the screen.
• Designers have the power to create a focus of user to certain text or action, just by
adding the right illustration directly to the screen.
• Aesthetics:
• Functional websites can work, but if you combine function with aesthetics, you will
push your product to another level.
• People are simple and if you want to sell, you have to create a visually appealing
website that represents your product. Illustrations are definitely an option to add
style to your interface.
MULTIMEDIA IN GUI
• The graphical flexibility of the Web permits inclusion of other media
on a screen, including, images, photographs, video, diagrams,
drawings, and spoken audio.
• Multimedia can hold the user’s attention, add interest to a screen,
entertain, and quickly convey information that is more difficult to
present textually.
• It can also make the Web much more accessible to people with
disabilities.
• Today, consequently, good interface design employs
• multimedia in a conservative and appropriate manner.
• In the future, experts say, multimedia elements will be
• much better integrated with browsers, alleviating many of today’s
usability problems.
• References:
Galitz, Wilbert (2002). The Essential Guide to User
Interface Design, 2ndEdition. John Wiley & Sons, Inc. ,
Canada
Galitz, Wilbert (2007). The Essential Guide to User
Interface Design, 3rd Edition. John Wiley & Sons, Inc. ,
Canada
http://www.google.com.ph/
http://www.wikipedia.com/
REFERENCES
Icons, Image & Multimedia

Más contenido relacionado

La actualidad más candente

La actualidad más candente (20)

Introduction to iPads for Learning
Introduction to iPads for LearningIntroduction to iPads for Learning
Introduction to iPads for Learning
 
UI vs UX workshop
UI vs UX workshopUI vs UX workshop
UI vs UX workshop
 
Using Apps to Support Learning & Teaching - Nov 2014
Using Apps to Support Learning & Teaching - Nov 2014Using Apps to Support Learning & Teaching - Nov 2014
Using Apps to Support Learning & Teaching - Nov 2014
 
Understanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun BabajideUnderstanding UI/UX Design by Aroyewun Babajide
Understanding UI/UX Design by Aroyewun Babajide
 
UI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin MalekiUI and UX Design for Startups - Matin Maleki
UI and UX Design for Startups - Matin Maleki
 
UX/UI Design 101
UX/UI Design 101UX/UI Design 101
UX/UI Design 101
 
Mobile App Design & Tools
Mobile App Design & ToolsMobile App Design & Tools
Mobile App Design & Tools
 
Mobile is all about touch
Mobile is all about touchMobile is all about touch
Mobile is all about touch
 
By the Book: Examining the Art of Building Great User Experiences in Software
By the Book: Examining the Art of Building Great User Experiences in SoftwareBy the Book: Examining the Art of Building Great User Experiences in Software
By the Book: Examining the Art of Building Great User Experiences in Software
 
Mobile App Design course (iOS & Android)
Mobile App Design course (iOS & Android)Mobile App Design course (iOS & Android)
Mobile App Design course (iOS & Android)
 
What Makes an App Great?
What Makes an App Great?What Makes an App Great?
What Makes an App Great?
 
[TechTalks] Effects of UI/ UX Designs on Customer Satisfaction & Loyalty
[TechTalks] Effects of UI/ UX Designs on Customer Satisfaction & Loyalty[TechTalks] Effects of UI/ UX Designs on Customer Satisfaction & Loyalty
[TechTalks] Effects of UI/ UX Designs on Customer Satisfaction & Loyalty
 
UX & UI Design behind SDL’s Customer Experience Cloud
UX & UI Design behind SDL’s Customer Experience CloudUX & UI Design behind SDL’s Customer Experience Cloud
UX & UI Design behind SDL’s Customer Experience Cloud
 
2014 Web Design Trends by @SynecoreTech
2014 Web Design Trends by @SynecoreTech2014 Web Design Trends by @SynecoreTech
2014 Web Design Trends by @SynecoreTech
 
Designing for Multiple Devices - Sarit Arora
 Designing for Multiple Devices - Sarit Arora Designing for Multiple Devices - Sarit Arora
Designing for Multiple Devices - Sarit Arora
 
Mobile first: A future friendly approach to UX design
Mobile first: A future friendly approach to UX designMobile first: A future friendly approach to UX design
Mobile first: A future friendly approach to UX design
 
Mobile UI / UX Trends
Mobile UI / UX TrendsMobile UI / UX Trends
Mobile UI / UX Trends
 
PHP Indonesia - Understanding UI UX from Developer Side
PHP Indonesia - Understanding UI UX from Developer SidePHP Indonesia - Understanding UI UX from Developer Side
PHP Indonesia - Understanding UI UX from Developer Side
 
UX/UI Design : Methodology . Artifacts . Acumen
UX/UI Design : Methodology . Artifacts . AcumenUX/UI Design : Methodology . Artifacts . Acumen
UX/UI Design : Methodology . Artifacts . Acumen
 
Intelligent Design - Transitioning UX into UI
Intelligent Design - Transitioning UX into UI Intelligent Design - Transitioning UX into UI
Intelligent Design - Transitioning UX into UI
 

Similar a Icons, Image & Multimedia

An introduction to user experience design
An introduction to user experience designAn introduction to user experience design
An introduction to user experience design
Elena Donets
 
Ux ui presentation2
Ux ui presentation2Ux ui presentation2
Ux ui presentation2
GeneXus
 
Lesson-7-Web-page-design-using-templates-and-online-WYSIWYG.pdf
Lesson-7-Web-page-design-using-templates-and-online-WYSIWYG.pdfLesson-7-Web-page-design-using-templates-and-online-WYSIWYG.pdf
Lesson-7-Web-page-design-using-templates-and-online-WYSIWYG.pdf
erzascarlet3998
 

Similar a Icons, Image & Multimedia (20)

Dev fest ile ife 2014-ux, material design and trends
Dev fest ile ife 2014-ux, material design and trendsDev fest ile ife 2014-ux, material design and trends
Dev fest ile ife 2014-ux, material design and trends
 
Iconography - The unsung hero
Iconography - The unsung heroIconography - The unsung hero
Iconography - The unsung hero
 
The Challenge of Touchscreen Clutter - v2 - 9.26.2012
The Challenge of Touchscreen Clutter - v2 - 9.26.2012The Challenge of Touchscreen Clutter - v2 - 9.26.2012
The Challenge of Touchscreen Clutter - v2 - 9.26.2012
 
Using animation to enhance ux
Using animation to enhance ux Using animation to enhance ux
Using animation to enhance ux
 
Workflow diagramming and information architecture
Workflow diagramming and information architectureWorkflow diagramming and information architecture
Workflow diagramming and information architecture
 
UX Process | Collaborating with Engineering
UX Process | Collaborating with EngineeringUX Process | Collaborating with Engineering
UX Process | Collaborating with Engineering
 
Module 1
Module 1Module 1
Module 1
 
iOS Human Interface Guidelines (HCI)
iOS Human Interface Guidelines (HCI)iOS Human Interface Guidelines (HCI)
iOS Human Interface Guidelines (HCI)
 
why I called " interaction design " is not "IXD" but "InD" Ind course
why I called " interaction design " is not "IXD" but "InD"  Ind coursewhy I called " interaction design " is not "IXD" but "InD"  Ind course
why I called " interaction design " is not "IXD" but "InD" Ind course
 
What are the Key Features of UI UX Technology? - Croma Campus
What are the Key Features of UI UX Technology? - Croma CampusWhat are the Key Features of UI UX Technology? - Croma Campus
What are the Key Features of UI UX Technology? - Croma Campus
 
An introduction to user experience design
An introduction to user experience designAn introduction to user experience design
An introduction to user experience design
 
Intro to UIUX.pptx
Intro to UIUX.pptxIntro to UIUX.pptx
Intro to UIUX.pptx
 
The Essential UIUX Designing Principles to Follow for Maintain Customer Engag...
The Essential UIUX Designing Principles to Follow for Maintain Customer Engag...The Essential UIUX Designing Principles to Follow for Maintain Customer Engag...
The Essential UIUX Designing Principles to Follow for Maintain Customer Engag...
 
Ux ui presentation2
Ux ui presentation2Ux ui presentation2
Ux ui presentation2
 
Lesson-7-Web-page-design-using-templates-and-online-WYSIWYG.pdf
Lesson-7-Web-page-design-using-templates-and-online-WYSIWYG.pdfLesson-7-Web-page-design-using-templates-and-online-WYSIWYG.pdf
Lesson-7-Web-page-design-using-templates-and-online-WYSIWYG.pdf
 
USER INTERFACE DESIGN.pptx
USER INTERFACE DESIGN.pptxUSER INTERFACE DESIGN.pptx
USER INTERFACE DESIGN.pptx
 
Bank Chris - Web UI Design Patterns - 2014
Bank Chris - Web UI Design Patterns - 2014Bank Chris - Web UI Design Patterns - 2014
Bank Chris - Web UI Design Patterns - 2014
 
Vijayabaskar-Resume
Vijayabaskar-ResumeVijayabaskar-Resume
Vijayabaskar-Resume
 
Specialization for Web & Graphic Designer
Specialization for Web & Graphic DesignerSpecialization for Web & Graphic Designer
Specialization for Web & Graphic Designer
 
Case Study - Design an Art History App for an Art Gallery.pptx
Case Study - Design an Art History App for an Art Gallery.pptxCase Study - Design an Art History App for an Art Gallery.pptx
Case Study - Design an Art History App for an Art Gallery.pptx
 

Más de Meghaj Mallick

Más de Meghaj Mallick (20)

24 partial-orderings
24 partial-orderings24 partial-orderings
24 partial-orderings
 
PORTFOLIO BY USING HTML & CSS
PORTFOLIO BY USING HTML & CSSPORTFOLIO BY USING HTML & CSS
PORTFOLIO BY USING HTML & CSS
 
Introduction to Software Testing
Introduction to Software TestingIntroduction to Software Testing
Introduction to Software Testing
 
Introduction to System Programming
Introduction to System ProgrammingIntroduction to System Programming
Introduction to System Programming
 
MACRO ASSEBLER
MACRO ASSEBLERMACRO ASSEBLER
MACRO ASSEBLER
 
Project Tracking & SPC
Project Tracking & SPCProject Tracking & SPC
Project Tracking & SPC
 
Peephole Optimization
Peephole OptimizationPeephole Optimization
Peephole Optimization
 
Routing in MANET
Routing in MANETRouting in MANET
Routing in MANET
 
Macro assembler
 Macro assembler Macro assembler
Macro assembler
 
Architecture and security in Vanet PPT
Architecture and security in Vanet PPTArchitecture and security in Vanet PPT
Architecture and security in Vanet PPT
 
Design Model & User Interface Design in Software Engineering
Design Model & User Interface Design in Software EngineeringDesign Model & User Interface Design in Software Engineering
Design Model & User Interface Design in Software Engineering
 
Text Mining of Twitter in Data Mining
Text Mining of Twitter in Data MiningText Mining of Twitter in Data Mining
Text Mining of Twitter in Data Mining
 
DFS & BFS in Computer Algorithm
DFS & BFS in Computer AlgorithmDFS & BFS in Computer Algorithm
DFS & BFS in Computer Algorithm
 
Software Development Method
Software Development MethodSoftware Development Method
Software Development Method
 
Secant method in Numerical & Statistical Method
Secant method in Numerical & Statistical MethodSecant method in Numerical & Statistical Method
Secant method in Numerical & Statistical Method
 
Motivation in Organization
Motivation in OrganizationMotivation in Organization
Motivation in Organization
 
Communication Skill
Communication SkillCommunication Skill
Communication Skill
 
Partial-Orderings in Discrete Mathematics
 Partial-Orderings in Discrete Mathematics Partial-Orderings in Discrete Mathematics
Partial-Orderings in Discrete Mathematics
 
Hashing In Data Structure
Hashing In Data Structure Hashing In Data Structure
Hashing In Data Structure
 
Complexity Analysis of Recursive Function
Complexity Analysis of Recursive FunctionComplexity Analysis of Recursive Function
Complexity Analysis of Recursive Function
 

Último

The basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptxThe basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptx
heathfieldcps1
 
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
ZurliaSoop
 
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 -  Danh muc Sach Giao Khoa 10 . pdf1029 -  Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
QucHHunhnh
 

Último (20)

Mixin Classes in Odoo 17 How to Extend Models Using Mixin Classes
Mixin Classes in Odoo 17  How to Extend Models Using Mixin ClassesMixin Classes in Odoo 17  How to Extend Models Using Mixin Classes
Mixin Classes in Odoo 17 How to Extend Models Using Mixin Classes
 
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptxHMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
HMCS Max Bernays Pre-Deployment Brief (May 2024).pptx
 
ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.ICT role in 21st century education and it's challenges.
ICT role in 21st century education and it's challenges.
 
Towards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxTowards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptx
 
The basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptxThe basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptx
 
On National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan FellowsOn National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan Fellows
 
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
Jual Obat Aborsi Hongkong ( Asli No.1 ) 085657271886 Obat Penggugur Kandungan...
 
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptxSKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
 
How to Give a Domain for a Field in Odoo 17
How to Give a Domain for a Field in Odoo 17How to Give a Domain for a Field in Odoo 17
How to Give a Domain for a Field in Odoo 17
 
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
 
Sociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning ExhibitSociology 101 Demonstration of Learning Exhibit
Sociology 101 Demonstration of Learning Exhibit
 
Micro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfMicro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdf
 
Graduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - EnglishGraduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - English
 
Application orientated numerical on hev.ppt
Application orientated numerical on hev.pptApplication orientated numerical on hev.ppt
Application orientated numerical on hev.ppt
 
Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...Making communications land - Are they received and understood as intended? we...
Making communications land - Are they received and understood as intended? we...
 
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptxBasic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
 
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdfUGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdf
 
1029 - Danh muc Sach Giao Khoa 10 . pdf
1029 -  Danh muc Sach Giao Khoa 10 . pdf1029 -  Danh muc Sach Giao Khoa 10 . pdf
1029 - Danh muc Sach Giao Khoa 10 . pdf
 
How to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POSHow to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POS
 

Icons, Image & Multimedia

  • 1. BIRLA INSTITUTE OF TECHNOLOGY MESRA ,JAIPUR CAMPUS TOPIC : ICONS, IMAGES & MULTIMEDIA PRESENTED BY : MEGHAJ KUMAR MALLICK (MCA/25017/18) 2ND YEAR ,4TH SEMESTER FACULTY: DR. ARCHANA BHATNAGAR
  • 2. ICONS IN GUI • In a computer's graphical user interface (GUI), an icon (pronounced EYE-kahn ) is an image that represents an application, a capability, or some other concept or specific entity with meaning for the user.
  • 3. INTRODUCTION OF ICONS • An icon is a pictogram or ideogram displayed on a computer screen in order to help the user navigate a computer system. • The icon itself is a quickly comprehensible symbol of a software tool, function, or a data file, accessible on the system. • The user can activate an icon using a mouse, pointer, finger, or recently voice commands.
  • 4. ADVANTAGES OF ICONS • It provides clarity, adds visual interest, and reinforces a company’s brand. • The benefit of providing labels with icons is that you can introduce new features and be reassured that your users will know what to expect when they interact with it.
  • 5. DISADVANTAGE OF ICONS • Using icons-only should be reserved for specific conditions where screen space is limited and the feature is common and familiar to the user. • The problem with using icons by themselves is that their meaning can be vague, especially when introducing a new feature. • Many users won’t start clicking buttons to find what they need if it isn’t immediately obvious. The uncertainty of an icon’s function puts the user in a state of doubt. • It requires them to think about the icon instead of focusing on their task. Worst case scenario is the user accidentally clicks on something and the result is undesirable and potentially irreversible.
  • 6. USE OF IMAGES • Simple fact, people perceive images faster than words. • In other words, if you want to deliver a statement or an important message, use an image to support it. • In this case, it will be an illustration, which can easily clarify what words cannot. Keep in mind, that when the user lands on a website or opens the app, they don't start reading right away, they scan. • If a screen is boring and full of text, the user will most probably leave. • Simple illustrations with supporting text can easily explain the most crucial functionalities and interactions. Illustrations have both explanatory and eye-catching effect.
  • 7. USE OF IMAGE IN WEBPAGE
  • 8. ADVANTAGE OF IMAGE • Attention of users: • Illustrations are not only creating visual hierarchy and can support visual division on screen, but they also draw attention to the most important parts of the screen. • Designers have the power to create a focus of user to certain text or action, just by adding the right illustration directly to the screen. • Aesthetics: • Functional websites can work, but if you combine function with aesthetics, you will push your product to another level. • People are simple and if you want to sell, you have to create a visually appealing website that represents your product. Illustrations are definitely an option to add style to your interface.
  • 9.
  • 10. MULTIMEDIA IN GUI • The graphical flexibility of the Web permits inclusion of other media on a screen, including, images, photographs, video, diagrams, drawings, and spoken audio. • Multimedia can hold the user’s attention, add interest to a screen, entertain, and quickly convey information that is more difficult to present textually. • It can also make the Web much more accessible to people with disabilities. • Today, consequently, good interface design employs • multimedia in a conservative and appropriate manner. • In the future, experts say, multimedia elements will be • much better integrated with browsers, alleviating many of today’s usability problems.
  • 11.
  • 12.
  • 13. • References: Galitz, Wilbert (2002). The Essential Guide to User Interface Design, 2ndEdition. John Wiley & Sons, Inc. , Canada Galitz, Wilbert (2007). The Essential Guide to User Interface Design, 3rd Edition. John Wiley & Sons, Inc. , Canada http://www.google.com.ph/ http://www.wikipedia.com/ REFERENCES