Content uploaded by Chrysoula Gatsou
Author content
All content in this area was uploaded by Chrysoula Gatsou on Jul 10, 2014
Content may be subject to copyright.
Abstract—This study deals with the vital issue of whether a
mobile phone interface icon effectively expresses the function
related to it. The subject of the effectiveness of icons used in mo-
bile phone interfaces deserves examination. Icons are an inte-
gral part of most mobile interfaces, for they are the bridge en-
abling interaction. We also examine how far any icon represents
the meaning of the function for which it has been designed, cho-
sen and installed by the mobile phone manufacturer and design-
er. Among the chief findings are (1) graphical representation
affects the recognition rate of icons and influences user percep-
tion and (2) there are significant differences in performance in
recognizing icons among different age groups.
Keywords—icons recognition; human factors; interface de-
sign; mobile interaction.
I. INTRODUCTION
OBILE phone interaction is nowadays part of
everyday human behavior and an activity which
involves speaking, listening, touching and performing other
tasks, in order to communicate. Interactivity converts a
system into a communication medium by eliciting user
interaction with the interface. One of the main goals of a
mobile phone interface is to relate phone functions and
operations to elements of interaction that are performed well
(e.g. sounds and visual elements). Mobile interfaces use
icons to represent the functionality required by users in
performing their tasks. Since visual aspects, such as
graphics and icons, are essential elements of user-device
interaction, are used extensively in interface design on the
assumption that visual icons are capable of transcending
language barriers and of presenting meaning in condensed
form [1], [2], [3]. With the increase in the use of new
technologies and of the internet at home, there is an
exponential growth in numbers of novice users, that is,
ordinary people who lack skills in computer science and are
drawn from a wide range of backgrounds, they face
difficulties in operating their computers. Ordinary people are
now the main target of the market, which produces new
applications very rapidly. Consequently, there is a need for
new tools with particular features to assist such users. Yet
there has been little investigation of the influence of
graphical icons on the perception of ordinary mobile phone
users.
M
An icon can be defined as a graphical representation of
concepts that symbolize computer actions [4]. Exponents of
icons argue that iconic interfaces enjoy many advantages [5].
One such suggested advantage is that icons are easily
recognized [6]. Also, it is suggested, that graphic images
help users memorize and recognize functions available
within an application [7]. In addition, iconic interfaces are
especially important for novice users who only infrequently
use interactive systems. To be effective, an icon must fulfill
several criteria, such as whether it is visible, legible, and
comprehensible. Studies have found that the visual and
cognitive features of icons significantly influence an icon’s
effectiveness [8], [9], [10]. Recently designers of mobile
interfaces have been using icons to represent the
functionality required by users to perform their tasks. Icons
are a popular method for visually representing functionality,
because they provide direct access, allow direct manipulation
and can economise on valuable space in interfaces. A key
concern in the design of iconic interfaces is the effective
depiction of the meaning of the icon. Potentially speaking,
an icon can represent both the referent and its attributes,
associations, and state [2].
The proper use of iconic mobile interfaces reduces system
complexity and helps users interact with mobile phones more
easily.
Given this discussion, present study seeks answers to the
following questions:
1. Are mobile phone function icons easily recognizable by a
wider audience?
2. Is there any difference in recognition rate among different
age groups?
3. Are there any differences in the recognition rate between
the genders in each of the age groups?
II. ICON CLASSIFICATION, SEMIOTICS AND INTERACTION
Icons can be divided into broad categories that rest on
Pierce’s early explanation of semiotics. Pierce classified
signs in three categories that is, icon, index and symbol
[11]. For a sign to exist, it must consist of all three parts (the
object, the representamen and the interpretant) and the
interaction between them is a process Peirce termed semiosis
(from Greek ‘sēmeiōsis’).
Icon. An icon is the simplest of these types of representation,
since it consists of a pattern of lines that physically
resembles what it `stands for'. Icons display features that
resemble the object they signify.
Index. An index correlates in space and time to its meaning
and relates indirectly to the concept of its referent.
From icons perception to mobile interaction
Chrysoula Gatsou
School of Applied Arts
Hellenic Open University
Patra , Greece
Email: cgatsou@teiath.gr
Anastasios Politis
Graphic Arts Technology
Faculty of Fine Arts and Design,
TEI of Athens
Athens, Greece
Email: politisresearch@techlink.gr
Dimitrios Zevgolis
School of Applied Arts
Hellenic Open University
Patra , Greece
Email: zevgolis@eap.gr
Proceedings of the Federated Conference on
Computer Science and Information Systems pp. 705–710
ISBN 978-83-60810-22-4
978-83-60810-22-4/$25.00 c
2011 IEEE 705
Symbol. A symbol is a sign whose relation to what is
signified is conventional or arbitrary.
Wileman states that symbols can be assigned in three
groups. Pictorial, graphic and verbal symbols range from
concrete to abstract representations [12]. Fig. 1, illustrates
several representations of a “camera” based on Nadin’s idea
[13]. Different amount of interpretation from concrete to
abstract and different types of icons (iconic, indexical,
symbolic) plays an important role in user performance. The
interpretation becomes easier, as the representation becomes
more schematic. As the level of abstraction increases, the
sign becomes progressively more generic and less complex.
From a semiotic point of view, the design of an interface for
a mobile application consists of various signs. By means of
these, the designer tries to convey the meaning he intends to
convert [14]. When the user interacts with the screen of the
mobile phone, he or she is required to guess the object of the
sign, since the sign is designed to convey specific meanings.
When the user’s interpretation (interpretant) matches the
intended object of the sign, the designer has achieved his
aim of producing a successful icon [13]. Ideally, the link
between the representamen and object should be obvious to
all the users of the interface and result in only one
interpretant. This should activate the correct mental model,
which allows the user both to understand the action and to
interact appropriately [15].
III. DIFFERENT SYMBOLS, DIFFERENT MEANINGS, IDENTICAL
FUNCTIONS
There is an increasing range of existing iconography in
mobile phones, together with a number of interesting
graphics. Not all users though can transfer their skills from
one model to another, because of differences in the interface
and the icons between the two models. Different individuals
interpret the same icon in different ways and one icon may
be capable of more than one interpretation, this phenomenon
is being labeled the ‘ambiguity’ of the icon.
Rossi and Querrioux - Coulombier suggest that “the
relationship between an icon and its meaning should be
automatic and consequently independent of any learning”
[16]. This means that for an icon to work more effectively
than some other means of representation, such as a textual
description, it needs to draw on the understanding of the
implicit meaning of the icon. Various icons on various
handsets, differing among themselves in appearance, but
representative of the same function, may complicate the
intellectual model applied by the user and so cause problems
in the perception on the part of the user.
The most important role of an icon is to convey, without
the use of text, the meaning of the function it represents,
thereby making icons more efficient than text in the
operation of mobile phones and in function implementation.
The effectiveness of an icon in relation to its intended
meaning also depends on the degree of mapping between
physical form and function, this being known as the
“articulatory distance”[17]. The closer the visual
representation is to the intended meaning, the shorter the
articulatory distance becomes.
Ideally, the icons used in the interface for representing
information will activate the appropriate mental models in
the users. How the user interprets the sign will depend on the
user’s mental models. Likewise, how the designer chooses to
represent the object may also depend on his own set of
mental models [18]. It is important to note that the function
assigned to an icon by those designing it may be quite
different to the meaning actually attributed to it by users.
The correct interpretation of icons also depends on other
factors, such as the context in which the icon is used. Any
text labels that might be displayed together with an icon and
the user’s familiarity with the icon and with its application
context [19]. The elderly are likely to have less experience
than other younger age-groups with contemporary handset
devices and to be less familiar with icons displayed by a
device and with applications, which thus makes such icons
more difficult to interpret.
Fig. 2 Types of icon representations from different handsets
Previous studies have shown that mobile phone icons
make for faster, more direct access to a mobile function [16].
This then leads to the inevitable question, "What makes an
effective comprehensive interface mobile icon"?
In Fig. 2, we see eight of the most frequent functions from
five different popular brands of mobile phones, namely,
Iphone, Nokia, Motorola, Samsung and Sony Erikson. We
present icons from two models per brand (Nokia, Motorola,
Samsung and Sony Erikson ) and one model from Iphone. It
Fig. 1 Types of icon representations (adapted from Nadin)
706 PROCEEDINGS OF THE FEDCSIS. SZCZECIN, 2011
is to be observed that even the same company is not
consistent in its choice of symbols to depict functions. In
Nielsen’s view, “the latest mobile devices are agonizingly
close to being practical, but still lack key usability features
required for mainstream use” [20].
IV. RESEARCH METHODOLOGY
There are several criteria that an icon must satisfy, if it is
to be effective. Among these are legibility, distinctiveness,
comprehension, the reaction time [21].
The main problem in evaluating icons is the proper
construction and modification of them [22]. Several methods
have been utilized to evaluate graphic symbols and icons.
The method used most often is a comprehension test, also
termed a ‘recognition test’ [23]. Howell and Fuchs were the
first to devise criteria for the correct recognition of symbols,
grouping them into the following categories: identifiable (60-
100%), medium (30-60%) and vague (0-30%) [24]. Many
researchers have employed procedures involving “matching
tests” to evaluate graphic symbols [25],[26]. In the
“matching” method, the suitability of an icon is evaluated in
relation to other icon variables. Yet another method is the
icon intuitiveness test, created by Nielsen and Sano, in which
an icon is shown without any label to a small number of
users, typically five [27]. The users are asked to guess what
the icon is intended to represent. Sanders and McCormick
have also shown that the criteria for selecting symbols
generally include a degree of recognition, a matching degree
and a subjective preference and opinion [28].
A. The selection of the sample for the evaluation.
After choosing handsets from five different manufacturers
on the basis of brand popularity, we selected icons for our
study from the main menu functions. It was impossible to
represent each function by a standard number of icons, since
the icons in question are extremely diverse in appearance.
Some were selected on the grounds that, although they were
drawn from different brands, they converged and we were
eager to investigate whether such convergence aided user
perception. Our goal was to determine whether or not the
visual representations offered by icons do indeed help users
to understand the functionality of the icon in question.
B. Participants
We employed a sample of 60 participants, all volunteers.
They possessed mobile phones and came from various
backgrounds. They were roughly equal in terms of gender
and their age distribution is given in Table 1. All
participants have normal vision, though some wore glasses
or contact lenses. The majority had owned a mobile phone
for more than one year. Each subject was given a brief
overview of the experiment and briefed as to the purpose and
procedure of the study.
C. Icon recognition questionnaire
Before answering the icon recognition questionnaire, all
participants completed a pre-experiment questionnaire which
collected personal details and data relating to technology
skills and mobile phone experience. A paper-based icon
recognition questionnaire was prepared, which involved 54
mobile phone function icon .The questionnaire was designed
to examine icon recognition and perception performance
over different age groups. According to the Organization
for International Standardization (ISO3864), icon
recognition rates should be at least 66.7%, to be acceptable
[29]. With a view to making the procedure of presenting the
participants with the icons they were to interpret as efficient
as possible, a table was constructed in Adobe InDesign with
numbered rows, placed an icon next to each number, and left
the space to the right for a set of referents from eight
functions that participants had to select the proper one.
Since the test required that the icons be clearly visible, they
were printed at high resolution. The recognition rate was
computed as follows:
(Number of correct choices / Number of respondents) x
100=Recognition rate(%)
TABLE I.
AGE, GENDER AND NUMBER OF PARTICIPANTS.
Age group
No.of
participants Participant Gender
Male Female
20-29
30-39
40-49
50-59
60-69
70-79
10
11
12
14
8
5
5
7
5
8
2
5
5
4
7
6
6
Σ 60 28 32
Fig. 3 Recognition rate of icons.
CHRYSOULA GATSOU, ANASTASIOS POLITIS, DIMITRIOS ZEVGOLIS: FROM ICONS PERCEPTION TO MOBILE INTERACTION 707
In this study, the 54 icons were graded according to their
recognition rate.
V. ANALYSIS OF RESULTS
The summary of the test results is shown in Fig. 3. The
recognition rate for 29 icons was over 66.7%, a fact which
provides an overall answer to questions we posed ourselves.
In view of the ISO standard mentioned above, we award the
icons we tested one of two grades: ‘good’, with a correct
answer rate of above 66.7%, and ‘low’, with a correct
answer rate below 66.7%. On this basis, 29 of the icons
tested are to be considered ‘good’ and so are suitable for
mobile phone use, the remaining 25 icons achieving only a
recognition rate below this level.
Other facts emerge from our analysis. Six mobile icons were
easily recognized and associated with their correct functions,
thus fulfilling Howell’s criteria. Icons E4 and F2 enjoyed
the highest recognition rate of all, 100%. However, the
analysis of our test results relates to our research questions to
a greater degree than this. It is clear that the icon recognition
rate differs over age groups, some icons enjoying a high
recognition rate and some others a lower rate. Older
participants were less accurate in recognizing and
interpreting the meaning of the icons. The findings shown in
Fig.4 and Table II illustrate this point.
Fig. 4 Recognition rate and different age group
TABLE II.
MEAN RECOGNITION RATE IN AGE GROUPS
Age group No. of
participants
Mean
Recognition rate
20-29
30-39
40-49
50-59
60-69
70-79
10
11
12
14
8
5
86.9%
83.5%
71.0%
67.3%
60.6%
42.2%
Σ 60 68.5%
If we regard a recognition rate of 66.7% as indicating
success, the most effective icons are:
• F2 and E4, with a recognition rate of 100%,
• C1, with a recognition rate of 98.3%,
• E3, with a recognition rate of 96.7%,
• F2, with a recognition rate of 96.7%,
• F3, with a recognition rate of 96.7% and
• D5, with a recognition rate of 95.0%.
Information regarding matters of experience with
technology and of gender was derived from the pro-
experiment questionnaire. An analysis of the results is given
in Fig. 5 and 6. As for the six icons whose recognition rate
fell between 20%-40%, various suggested factors, which are
summarised in Table III, may be responsible for this poor
performance.
Fig. 5 Recognition rate and experience with technology.
Fig. 6 Recognition rate and gender.
TABLE III.
ICONS WITH LOW RECOGNITION RATE 20%-40%
Icons R/r* Original
meaning
Possible reasons for
misunderstanding
40% phone
book
The graphic, intended to indicate a note
book, is visually unclear.
40% internet
The use of a compass to denote the
internet is unfamiliar to some users.
Generally an icon of a globe is more
effective.
30% phone
book
The combination of head phone and
notebook is confusing.
30% games
The addition of the word ‘games’ would
probably add to clarity and
effectiveness
21.7
%
phone
call
The combination of handset and an
individual is ambiguous.
20% phone
call
The resemblance to a notebook may
cause confusion with the phone book
icon.
*R/r = recognition rate
Interestingly, the recognition rate for the various icons
denoting a very basic function, “phone call” (Fig. 7), is
surprisingly low, with the exception of the icon employed by
the Iphone, which consists of a head phone. This enjoyed the
708 PROCEEDINGS OF THE FEDCSIS. SZCZECIN, 2011
highest rate of recognition (75%), whilst that of all the other
icons fell beneath 66.7%
Fig. 7 Recognition rates for various icons representing ‘phone call’
function.
VI. DISCUSSION
In this particular study, we found that:
• 29 of our 54 icons enjoyed a recognition rate of more
than 66.7% ,
• is a significant difference in recognition rates among
age groups, with recognition rate decreasing as age increases
and that
• there is no importance difference between genders, with
the recognition rate displayed by males being only 4% higher
than that displayed by females.
Our study suffers from limitations that may have given
rise to inaccuracies in our results. As we have pointed out,
we settled upon a paper-based form of test, as some of our
participants were unfamiliar with computer technology. Such
participants, ignorant of computer technology, were unable
to compare the icon they were requested to evaluate with
other icons from the application from which the test icon was
drawn. This does not reflect reality, where the users of an
application may be in a better position to guess the meaning
of the icon in question by comparing it with other icons in
the same application.
For reasons of legibility, comparatively large depictions of
icons were used in our recognition test. In reality, of course,
icons are becoming ever smaller and less visible [22]. Our
focus was upon ordinary people. Although they were not
necessarily experienced users of technology and were drawn
from various age groups, they were called upon to evaluate
icons, no easy task. Among the factors of which account
needs to be taken is the medium in which the icons were
presented and examined and, above all, age differences.
In general, however, iconic signs are more easily
recognized than symbolic signs. It is thus extremely
important that the appropriate design style be selected at the
initial stage of the icon design process. If either information
or function has strong ties with an object, a pictorial icon is
the best choice. Examples of this are our icons F2 and E4,
which enjoyed a recognition rate of 100%.
VII. CONCLUSION
We have dealt in this study only with the representation
and recognition of icons, yet our findings can contribute to
the improvement in how a larger number of users experience
interfaces. Other issues, however, such as the structure of
menus and colour combinations employed in icons, also
require in-depth study.
Since the amount of information in our lives continues to
increase, information designers must design solutions that
match users’ requirements as much as possible. The proper
selection of graphical elements are one way to optimize
communication with users, but requires designers to be
aware of how users interact with graphical elements.
The use of an appropriate icon is a vital factor in ensuring
the correct functioning of mobile phone applications. In
order for icons to evoke the intended meaning in the viewer's
consciousness, or even subconsciousness and for them to
achieve communication between designer and user, a symbol
should display a strong, direct association with the desired
meaning, in the mind of both designer and user. During the
icon formulation process, a design whose aim is to produce
functional results makes such functions comprehensible.
Furthermore, in order to help new or ordinary users interpret
icons correctly, some form of comprehensive test or test of
recognition should precede any attempt at improving
performance.
We hope that the results of our study will offer a deeper
understanding of how a wider audience uses mobile phones
and icons, in particular.
ACKNOWLEDGMENT
This research was supported by the European program
ESPA and by HERAKLEITOS II in Greece. We are also
grateful to the participants in the study.
REFERENCES
[1] S. Caplin, Icon design: Graphic icons in computer interface design .
London: Cassell, 2001.
[2] D. Gittins, “Icon-based human-computer interaction”. International
Journal of Man Machine Studies, 24, (1986), pp.519-543.
[3] S. J. P. McDougall, M. B. Curry, and O. de Bruijn, “Exploring the ef-
fectsof icon characteristics on user performance: The role of icon
concreteness, complexity, and distinctiveness,” Journal of Experimen-
tal Psychology: Applied, vol. 6, no. 3, 2000, pp. 291-306.
[4] C .Ware, Information Visualization. Morgan Kaufmann, 2000.
[5] G.Shank. and P. Darke. "Understanding Corporate Data Models," In -
formation and Management, 35:1, 1999, pp. 19-30.
[6] B. Shneiderman, Designing the User Interface: Strategies for Effec -
tive Human-Computer Interaction, 3rd ed. Reading, MA: Addi-
son-Wesley, 1997
[7] K. Siau, "Human-computer interaction: The effect of application do-
main knowledge on icon visualization," J. of Computer Information
Systems, 45(3), 2005 p.p53-62.
[8] M. A Blattner, D. A. Sumikawa, and R. A. Greenberg, “Earcons and
icons: their structure and common design principles”. Human±
Computer Interaction. 1989
[9] M. E. Familant, and M. C. Detweiler, “Iconic reference:evolving per -
spectives and an organizing framework”, International Journal of
Man± Machine Studies, 39, 705± 728, 1993
[10] Y. Rogers, "Icons at the Interface: Their Usefulness," Interacting with
Computers, 1:1, 1989.
[11] C. S Peirce. Logic as semiotic: the theory of signs. In: Innis, R. E.
(Ed.) Semiotics: an introductory reader. Bloomington, Indiana: Indi-
ana University Press. 1985.
[12] M. S. Wileman Visual Communicating . Educational Technology Pub-
lications, New Jersey,1993.
[13] M . Nadin, “Interface design: A semiotic paradigm”. Semiotica. 69:
269–302, 1988.
[14] R. Buchanan, “Declaration by Design: Rhetoric, Argument, and De-
monstration in Design Practice”, Design Issues, 2(1),1985, pp, 4-22.
[15] S. Isherwood, “ Graphics and Semantics: The Relationship between
What Is Seen and What Is Meant in Icon Design”. HCI (17) 2009,p.p
197-205
[16] J. Rossi, & G. Querrioux-Coulombier, “Picture Icon and Word Icon”.
From Human and Machine Perception. New York, NY: Plenum
Press, 1997.
[17] E.L.Hutchins, D.J.Hollan, and D.L. Norman,. “Direct manipulation
interfaces”, in Norman, D.A. and Draper, S. (eds) user-centered sys-
tem design Lawrence Earlbaum Associates, Hillsdale, NJ, USA, 1986
CHRYSOULA GATSOU, ANASTASIOS POLITIS, DIMITRIOS ZEVGOLIS: FROM ICONS PERCEPTION TO MOBILE INTERACTION 709
[18] D. Norman, Things That Make Us Smart, Addison-Wesley
Publishing Co., Reading, MA 1993
[19] W. Horton, The Icon Book – Visual symbols for computer systems
and documentation , New York: Wiley and Sons, 1994.
[20] J. Nielsen, UseIt.com [Online].Available: http://www.useit.com/
/alertbox/20030818.html
[21] R. Dewar, “Design and evaluation of public information symbols,” in
Visual Information for Everyday Use: Design and Research
Perspectives, H. J. G. Zwaga, T. Boersema, and H. C. M. Hoonhout,
Eds. London: Taylor & Francis, 1999, pp. 285-304.
[22] S. Blankenberger and K. Hainj. Effects of icon design on hu-
man-computer interaction. Int. J. Man-Machine Studies 1991, 35,
363-377
[23] W. C. Howell,. & A. H. Fuchs, Population stereotypy in code design.
Organisational Behavior in Human Performance 3, 1968, pp 310-339.
[24] H. I. Cheng, P. E. Patterson,." Iconic hyperlinks on e-commerce web -
sites. Applied Ergonomics " 38 (1), 2007, pp 65–69.
[25] E. Heard, “A symbol study-1972,” Paper No 740304, Society of Au-
tomotive Engineers, New York, 1974.
[26] Easterby and H. Zwaga (Eds.), Information design, “The design and
evaluation of signs and printed material”(pp. 277-297). New York:
J. Wiley & Sons
[27] J. Nielsen, and D. Sano, SunWeb: User Interface Design for Sun Mi -
crosystem's Internal Web. In Proc. 2nd World Wide Web Conf. '94:
Mosaic and the Web. Chicago, IL, pp. 547.557.
[28] Sanders, M. S. and McCormick, E. J “Human factors in engineering
and design,”7th ed, New York: McGraw-Hill, 1993.
[29] D. P. T. Piamonte, J. D. A. Abeysekera, and K. Ohlsson, Under -
standing small graphical symbols: a cross-cultural study. Inter-
national Journal of Industrial Ergonomics, 27 (6), 2000, pp. 399-404
710 PROCEEDINGS OF THE FEDCSIS. SZCZECIN, 2011