Use of icons v. hidden triggers for rollovers

15 Jan 2004 - 10:52am
10 years ago
8 replies
567 reads
T. Taylor
2004

Hi,

I work on a team that builds foreign language
courseware in a browser-based environment. The nature
of the program requires that in addition to a target
language (if we are teaching Spanish, Spanish is the
target language), we supply English equivalent for
most vocabulary that is taught. We display the English
through the use of rollovers, so that the learner can
display/hide the English at will, or we can restrict
the learner's access to English until they have
completed a choice (such as in a multiple choice).
We've in the past used two different methods for
triggering rollovers, depending on the circumstances
of the activity. One is that a small E icon is
displayed next to each target language word. When the
user moves the mouse over the icon, the English
appears underneath the target language. The advantage
is, the learner always knows where to interact with
the screen to get English. The disadvantage is that
the proliferation of icons for each word takes up a
huge amount of screen real estate, especially in
languages where we need to have icons for
transliteration as well. The screen often looks very
crowded. The other method is that the learner moves
the mouse over the target language word and the
English is displayed underneath. This leaves the page
less cluttered, but it also does not give the learner
clear signals as to where/when English is available.

My sense is that the method with the icons is better,
and we should consistently use that method in all
exercises. However, I have nothing to back this up
with. I'd love some feedback from others about this.
Any thoughts?

Tiffany Taylor

__________________________________
Do you Yahoo!?
Yahoo! Hotjobs: Enter the "Signing Bonus" Sweepstakes
http://hotjobs.sweepstakes.yahoo.com/signingbonus

Comments

16 Jan 2004 - 1:49pm
Dan Saffer
2003

Can't you use another method (like a different color, or a highlight)
to indicate there is something special about the word and give it some
affordance? Too many icons=a lot of visual clutter.

Dan

ps. Another method *aside from underlining* :)

16 Jan 2004 - 4:35pm
Austin Govella
2004

Dan Saffer wrote:
> Can't you use another method (like a different color, or a highlight) to
> indicate there is something special about the word and give it some
> affordance? Too many icons=a lot of visual clutter.

Typographically, the best options are to bold or italicise
the text. Bold text is easier to read onscreen than
italicised text.

As a common practice, changing the text's color *and* making
it bold seems to work really well.

--
Austin

20 Jan 2004 - 1:47pm
T. Taylor
2004

Unfortunately, typographical methods won't work in our
case, because each word/phrase we are teaching is a
discrete element, already chunked and segregated.
Typographical formatting would be meaningless in this
case.

I've attached a screencap from one of our activities
from a Spanish program. Note the icons to one side of
each box with a phrase in it. The learner clicks on
the audio icon to hear the phrase pronounced, and
clicks on the E icon to see the English. We have other
activities that function in other ways, but the main
issue is that English is not always available to the
learner at the start of the activity, and sometimes
not at all in the activity. I think it is helpful for
the learner to see at a glance when they enter the
screen what exactly their options are, whether English
is available always or on completion of the item,
whether audio is available always, etc. I'm not
necessarily convinced that icons are the way to go,
but I don't see any other way to give the learner the
visual cues they need, given the way our screens are
currently structured. However, keep the comments
coming. I'm sure there's something I haven't thought
about!

Tiffany

--- Austin Govella <austin at grafofini.com> wrote:
> Dan Saffer wrote:
> > Can't you use another method (like a different
> color, or a highlight) to
> > indicate there is something special about the word
> and give it some
> > affordance? Too many icons=a lot of visual
> clutter.
>
> Typographically, the best options are to bold or
> italicise
> the text. Bold text is easier to read onscreen than
> italicised text.
>
> As a common practice, changing the text's color
> *and* making
> it bold seems to work really well.
>
> --
> Austin
>
> _______________________________________________
> Interaction Design Discussion List
> discuss at interactiondesigners.com
> --
> to change your options (unsubscribe or set digest):
> http://discuss.interactiondesigners.com
> --
> Questions: lists at interactiondesigners.com
> --
> Announcement Online List (discussion list members
> get announcements already)
> http://interactiondesigners.com/announceList/
> --
> http://interactiondesigners.com/

__________________________________
Do you Yahoo!?
Yahoo! Hotjobs: Enter the "Signing Bonus" Sweepstakes
http://hotjobs.sweepstakes.yahoo.com/signingbonus
-------------- next part --------------
A non-text attachment was scrubbed...
Name: screencap.jpg
Type: image/pjpeg
Size: 63141 bytes
Desc: screencap.jpg
Url : http://lists.interactiondesigners.com/private.cgi/discuss-interactiondesigners.com/attachments/20040120/dcb609b1/screencap-0001.bin

22 Jan 2004 - 3:59pm
Svoboda, Eric
2004

Adapting from Nielsen's Hueristic #6, "Recognition rather than recall",
I'd show the English directly under the Spanish in a different
weight/color/font from the get-go rather than "hiding" it behind the 'E'
button. I suspect that showing the Spanish and English next to each
other might also satisfy some sort of instructional design precepts as
well (retention through grouping maybe?)

Eric Svoboda
Creative Producer
Maritz Travel
www.maritztravel.com

-----Original Message-----
From:
discuss-interactiondesigners.com-bounces at lists.interactiondesigners.com
[mailto:discuss-interactiondesigners.com-bounces at lists.interactiondesign
ers.com]On Behalf Of T. Taylor
Sent: Tuesday, January 20, 2004 12:47 PM
To: discuss-interactiondesigners.com at lists.interactiondesigners.com
Subject: Re: [ID Discuss] Use of icons v. hidden triggers for rollovers

Unfortunately, typographical methods won't work in our
case, because each word/phrase we are teaching is a
discrete element, already chunked and segregated.
Typographical formatting would be meaningless in this
case.

I've attached a screencap from one of our activities
from a Spanish program. Note the icons to one side of
each box with a phrase in it. The learner clicks on
the audio icon to hear the phrase pronounced, and
clicks on the E icon to see the English. We have other
activities that function in other ways, but the main
issue is that English is not always available to the
learner at the start of the activity, and sometimes
not at all in the activity. I think it is helpful for
the learner to see at a glance when they enter the
screen what exactly their options are, whether English
is available always or on completion of the item,
whether audio is available always, etc. I'm not
necessarily convinced that icons are the way to go,
but I don't see any other way to give the learner the
visual cues they need, given the way our screens are
currently structured. However, keep the comments
coming. I'm sure there's something I haven't thought
about!

Tiffany

--- Austin Govella <austin at grafofini.com> wrote:
> Dan Saffer wrote:
> > Can't you use another method (like a different
> color, or a highlight) to
> > indicate there is something special about the word
> and give it some
> > affordance? Too many icons=a lot of visual
> clutter.
>
> Typographically, the best options are to bold or
> italicise
> the text. Bold text is easier to read onscreen than
> italicised text.
>
> As a common practice, changing the text's color
> *and* making
> it bold seems to work really well.
>
> --
> Austin
>
> _______________________________________________
> Interaction Design Discussion List
> discuss at interactiondesigners.com
> --
> to change your options (unsubscribe or set digest):
> http://discuss.interactiondesigners.com
> --
> Questions: lists at interactiondesigners.com
> --
> Announcement Online List (discussion list members
> get announcements already)
> http://interactiondesigners.com/announceList/
> --
> http://interactiondesigners.com/

__________________________________
Do you Yahoo!?
Yahoo! Hotjobs: Enter the "Signing Bonus" Sweepstakes
http://hotjobs.sweepstakes.yahoo.com/signingbonus

Confidentiality Warning: This e-mail contains information intended only for the use of the individual or entity named above. If the reader of this e-mail is not the intended recipient or the employee or agent responsible for delivering it to the intended recipient, any dissemination, publication or copying of this e-mail is strictly prohibited. The sender does not accept any responsibility for any loss, disruption or damage to your data or computer system that may occur while using data contained in, or transmitted with, this e-mail. If you have received this e-mail in error, please immediately notify us by return e-mail. Thank you.

22 Jan 2004 - 4:00pm
Svoboda, Eric
2004

...that's heuristic or course...sry

-----Original Message-----
From: Svoboda, Eric
Sent: Thursday, January 22, 2004 2:59 PM
To: 'T. Taylor';
discuss-interactiondesigners.com at lists.interactiondesigners.com
Subject: RE: [ID Discuss] Use of icons v. hidden triggers for rollovers

Adapting from Nielsen's Hueristic #6, "Recognition rather than recall",
I'd show the English directly under the Spanish in a different
weight/color/font from the get-go rather than "hiding" it behind the 'E'
button. I suspect that showing the Spanish and English next to each
other might also satisfy some sort of instructional design precepts as
well (retention through grouping maybe?)

Eric Svoboda
Creative Producer
Maritz Travel
www.maritztravel.com

-----Original Message-----
From:
discuss-interactiondesigners.com-bounces at lists.interactiondesigners.com
[mailto:discuss-interactiondesigners.com-bounces at lists.interactiondesign
ers.com]On Behalf Of T. Taylor
Sent: Tuesday, January 20, 2004 12:47 PM
To: discuss-interactiondesigners.com at lists.interactiondesigners.com
Subject: Re: [ID Discuss] Use of icons v. hidden triggers for rollovers

Unfortunately, typographical methods won't work in our
case, because each word/phrase we are teaching is a
discrete element, already chunked and segregated.
Typographical formatting would be meaningless in this
case.

I've attached a screencap from one of our activities
from a Spanish program. Note the icons to one side of
each box with a phrase in it. The learner clicks on
the audio icon to hear the phrase pronounced, and
clicks on the E icon to see the English. We have other
activities that function in other ways, but the main
issue is that English is not always available to the
learner at the start of the activity, and sometimes
not at all in the activity. I think it is helpful for
the learner to see at a glance when they enter the
screen what exactly their options are, whether English
is available always or on completion of the item,
whether audio is available always, etc. I'm not
necessarily convinced that icons are the way to go,
but I don't see any other way to give the learner the
visual cues they need, given the way our screens are
currently structured. However, keep the comments
coming. I'm sure there's something I haven't thought
about!

Tiffany

--- Austin Govella <austin at grafofini.com> wrote:
> Dan Saffer wrote:
> > Can't you use another method (like a different
> color, or a highlight) to
> > indicate there is something special about the word
> and give it some
> > affordance? Too many icons=a lot of visual
> clutter.
>
> Typographically, the best options are to bold or
> italicise
> the text. Bold text is easier to read onscreen than
> italicised text.
>
> As a common practice, changing the text's color
> *and* making
> it bold seems to work really well.
>
> --
> Austin
>
> _______________________________________________
> Interaction Design Discussion List
> discuss at interactiondesigners.com
> --
> to change your options (unsubscribe or set digest):
> http://discuss.interactiondesigners.com
> --
> Questions: lists at interactiondesigners.com
> --
> Announcement Online List (discussion list members
> get announcements already)
> http://interactiondesigners.com/announceList/
> --
> http://interactiondesigners.com/

__________________________________
Do you Yahoo!?
Yahoo! Hotjobs: Enter the "Signing Bonus" Sweepstakes
http://hotjobs.sweepstakes.yahoo.com/signingbonus

Confidentiality Warning: This e-mail contains information intended only for the use of the individual or entity named above. If the reader of this e-mail is not the intended recipient or the employee or agent responsible for delivering it to the intended recipient, any dissemination, publication or copying of this e-mail is strictly prohibited. The sender does not accept any responsibility for any loss, disruption or damage to your data or computer system that may occur while using data contained in, or transmitted with, this e-mail. If you have received this e-mail in error, please immediately notify us by return e-mail. Thank you.

23 Jan 2004 - 9:47am
Elizabeth Buie
2004

Eric Svoboda writes:

>Adapting from Nielsen's Heuristic #6, "Recognition
>rather than recall"...

Psychology has known for many years that recognition is easier than
recall. This principle was well established long before Nielsen quoted
it.

Nielsen was not even the first to apply it to HCI. (I can't say I know
who did.)

Now, I'm not denying what Nielsen has contributed to the field; he's very
good at making usability issues known to the IT community as a whole. But
his fame does tend to result in people attributing to him things he didn't
invent.

Elizabeth
--
Elizabeth Buie
Computer Sciences Corporation
Rockville, Maryland, USA
+1.301.921.3326

----------------------------------------------------------------------------------------
This is a PRIVATE message. If you are not the intended recipient, please
delete without copying and kindly advise us by e-mail of the mistake in
delivery. NOTE: Regardless of content, this e-mail shall not operate to
bind CSC to any order or other contract unless pursuant to explicit
written agreement or government initiative expressly permitting the use of
e-mail for such purpose.
----------------------------------------------------------------------------------------

26 Jan 2004 - 2:22pm
Svoboda, Eric
2004

Clearly any reasonable person would recognize that no one person
'invented' the principle. My use of the possessive might have been
sloppy. As your question was about a user interface, I was merely citing
him as an authority on the subject.

-----Original Message-----
From:
discuss-interactiondesigners.com-bounces at lists.interactiondesigners.com
[mailto:discuss-interactiondesigners.com-bounces at lists.interactiondesign
ers.com]On Behalf Of Elizabeth Buie
Sent: Friday, January 23, 2004 8:47 AM
To: discuss-interactiondesigners.com at lists.interactiondesigners.com
Subject: RE: [ID Discuss] Use of icons v. hidden triggers for rollovers

Eric Svoboda writes:

>Adapting from Nielsen's Heuristic #6, "Recognition
>rather than recall"...

Psychology has known for many years that recognition is easier than
recall. This principle was well established long before Nielsen quoted
it.

Nielsen was not even the first to apply it to HCI. (I can't say I know
who did.)

Now, I'm not denying what Nielsen has contributed to the field; he's
very
good at making usability issues known to the IT community as a whole.
But
his fame does tend to result in people attributing to him things he
didn't
invent.

Elizabeth
--
Elizabeth Buie
Computer Sciences Corporation
Rockville, Maryland, USA
+1.301.921.3326

------------------------------------------------------------------------
----------------
This is a PRIVATE message. If you are not the intended recipient, please

delete without copying and kindly advise us by e-mail of the mistake in
delivery. NOTE: Regardless of content, this e-mail shall not operate to
bind CSC to any order or other contract unless pursuant to explicit
written agreement or government initiative expressly permitting the use
of
e-mail for such purpose.
------------------------------------------------------------------------
----------------

_______________________________________________
Interaction Design Discussion List
discuss at interactiondesigners.com
--
to change your options (unsubscribe or set digest):
http://discuss.interactiondesigners.com
--
Questions: lists at interactiondesigners.com
--
Announcement Online List (discussion list members get announcements
already)
http://interactiondesigners.com/announceList/
--
http://interactiondesigners.com/

Confidentiality Warning: This e-mail contains information intended only for the use of the individual or entity named above. If the reader of this e-mail is not the intended recipient or the employee or agent responsible for delivering it to the intended recipient, any dissemination, publication or copying of this e-mail is strictly prohibited. The sender does not accept any responsibility for any loss, disruption or damage to your data or computer system that may occur while using data contained in, or transmitted with, this e-mail. If you have received this e-mail in error, please immediately notify us by return e-mail. Thank you.

26 Jan 2004 - 2:24pm
Svoboda, Eric
2004

Elizabeth,

I just realized that it wasn't you who originated the question.

-----Original Message-----
From:
discuss-interactiondesigners.com-bounces at lists.interactiondesigners.com
[mailto:discuss-interactiondesigners.com-bounces at lists.interactiondesign
ers.com]On Behalf Of Elizabeth Buie
Sent: Friday, January 23, 2004 8:47 AM
To: discuss-interactiondesigners.com at lists.interactiondesigners.com
Subject: RE: [ID Discuss] Use of icons v. hidden triggers for rollovers

Eric Svoboda writes:

>Adapting from Nielsen's Heuristic #6, "Recognition
>rather than recall"...

Psychology has known for many years that recognition is easier than
recall. This principle was well established long before Nielsen quoted
it.

Nielsen was not even the first to apply it to HCI. (I can't say I know
who did.)

Now, I'm not denying what Nielsen has contributed to the field; he's
very
good at making usability issues known to the IT community as a whole.
But
his fame does tend to result in people attributing to him things he
didn't
invent.

Elizabeth
--
Elizabeth Buie
Computer Sciences Corporation
Rockville, Maryland, USA
+1.301.921.3326

------------------------------------------------------------------------
----------------
This is a PRIVATE message. If you are not the intended recipient, please

delete without copying and kindly advise us by e-mail of the mistake in
delivery. NOTE: Regardless of content, this e-mail shall not operate to
bind CSC to any order or other contract unless pursuant to explicit
written agreement or government initiative expressly permitting the use
of
e-mail for such purpose.
------------------------------------------------------------------------
----------------

_______________________________________________
Interaction Design Discussion List
discuss at interactiondesigners.com
--
to change your options (unsubscribe or set digest):
http://discuss.interactiondesigners.com
--
Questions: lists at interactiondesigners.com
--
Announcement Online List (discussion list members get announcements
already)
http://interactiondesigners.com/announceList/
--
http://interactiondesigners.com/

Confidentiality Warning: This e-mail contains information intended only for the use of the individual or entity named above. If the reader of this e-mail is not the intended recipient or the employee or agent responsible for delivering it to the intended recipient, any dissemination, publication or copying of this e-mail is strictly prohibited. The sender does not accept any responsibility for any loss, disruption or damage to your data or computer system that may occur while using data contained in, or transmitted with, this e-mail. If you have received this e-mail in error, please immediately notify us by return e-mail. Thank you.

Syndicate content Get the feed