Babble v1 78

babble-digest Monday, December 15 1997 Volume 01 : Number 078

In this issue:
Interesting.
Take me off!!!!!
ADMIN: Compiling a Babble FAQ
Rollovers: The Definitive Example
Re: technical possible?
Re: ADMIN: Compiling a Babble FAQ
re: http://www.webtamers.com/koolshade/
Re: indexing to adaptive palette
RE> rollover discussion
Re: Arch of Strength
re: Using rollovers...why?
Re: Rollovers: The Definitive Example
Re: indexing to adaptive palette
RE: technical possible?
Re: babble-digest V1 #76

----------------------------------------------------------------------

Date: Mon, 15 Dec 1997 18:20:32 -0500
From: Ryan Ferguson <ryan@webworkx.com>
Subject: Interesting.

Check out this link:

http://necxdirect.necx.com:8002/cgi-bin/auth/docroot/holiday.html

This particular page has ads pointing to it from several sites, including
Bottom Dollar (www.bottomdollar.com). Their focus here is organizing great
Christmas gifts by price range. Pretty slick.

E-commerce isn't gonna go down the tubes anytime soon with this sort of
advertising and marketing savvy behind it.

R y a n F e r g u s o n
ryan@webworkx.com
============================
Creative Director, Web Workx Int'l.
http://www.webworkx.com
(407)295-3271

AIM: Fergorama

"A common error on the part of most
humans is the tendency to mistake
an aardvark with an anteater. To
underestimate a 'vark in this way
can be deadly."

- - Dick Balsoon, Zoologist

(excerpt from "Animals That don't
kill except under really weird,
strange circumstances")

T H E A A R D V A R K F A Q :
http://www.webworkx.com/aardvark.html
============================

[This mailing list is a service of High Five http://www.highfive.com/]
[ To unsubscribe, send the following one line to babble@highfive: ]
[ "unsubscribe <babble or babble-digest> [<e-mail address>]" ]
[ H5 Babble Design List Info: http://www.highfive.com/h5/babble.html ]

------------------------------

Date: Mon, 15 Dec 1997 15:21:10 +0000
From: Kyp Griffin <kyp@tmsonline.com>
Subject: Take me off!!!!!

Please take me of your e-mail mailing list.
- --
Kyp Griffin
Marketing/Creative Director
the marketing store!
http://www.tmsonline.com
916.737.7310
[This mailing list is a service of High Five http://www.highfive.com/]
[ To unsubscribe, send the following one line to babble@highfive: ]
[ "unsubscribe <babble or babble-digest> [<e-mail address>]" ]
[ H5 Babble Design List Info: http://www.highfive.com/h5/babble.html ]

------------------------------

Date: Mon, 15 Dec 1997 18:36:39 -0500
From: Porter Glendinning <pglendinning@cen.com>
Subject: ADMIN: Compiling a Babble FAQ

Hello all,

In the interest of reducing the number of repeat questions that seem to be
cropping up on the list, I have volunteered to compile a FAQ (Frequently
Asked Questions) for us.

If you have any questions that you think should be addressed in the Babble
FAQ please address them to me with the subject line, "BabbleFAQ," or, if
your mail reader supports embedded links, just use this link:
mailto:pglendinning@cen.com?subject=BabbleFAQ

(Thx, Ben, for the link idea.)

Rest assured that at the very top of the list are all the different
permutations of, "How do I make images X, Y and/or Z change when I move the
mouse over this link?"

- - Porter

- -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
Porter Glendinning pglendinning@cen.com
WWW Developer http://www.serve.com/apg

[This mailing list is a service of High Five http://www.highfive.com/]
[ To unsubscribe, send the following one line to babble@highfive: ]
[ "unsubscribe <babble or babble-digest> [<e-mail address>]" ]
[ H5 Babble Design List Info: http://www.highfive.com/h5/babble.html ]

------------------------------

Date: Mon, 15 Dec 1997 19:06:10 -0500
From: "William C. Stratas" <president@planetcast.com>
Subject: Rollovers: The Definitive Example

So, we have a number of divergent views about the utility of rollovers!
Perhaps what is missing is an example of a truly unique application.

Check this: <http://www.BennettGold.ca/> and click through any of the
image links.

This rollover features capture-video accent images in the upper-left
quadrant and an intuitive 'click' image as a secondary pop-up button.

Notice how all the rollover images were pre-loaded in the initial page.
Efficient code structure is one secret to rollover success.

Comments in response? I invite your private correspondence to:
<mailto:president@planetcast.com>

~~~~~~~~~~~~ Planetcast Presentations, Inc. ~~~~~~~~~~~~
William C. Stratas / President / Toronto, Canada
Tel: 416/593-6993 USA/Canada: 800/663-7054
Corporate: mailto:mailbox@planetcast.com
Confidential: mailto:president@planetcast.com
~~~~~~ Web Corporate Communications Specialists ~~~~~~
[This mailing list is a service of High Five http://www.highfive.com/]
[ To unsubscribe, send the following one line to babble@highfive: ]
[ "unsubscribe <babble or babble-digest> [<e-mail address>]" ]
[ H5 Babble Design List Info: http://www.highfive.com/h5/babble.html ]

------------------------------

Date: Mon, 15 Dec 1997 19:11:42 -0500
From: Porter Glendinning <pglendinning@cen.com>
Subject: Re: technical possible?

At 06:16 PM 12/15/97 -0500, Ryan Ferguson wrote:
[snip]
>>>> http://www.learning-web.com/lw_cgi-bin/c1.asp?client=0
[snip]
>>
>>Sure there's room! Just increase the height of the top frame by 10-20
>>pixels and put the mouseover descriptions above or below the icons.
>>
>>There's always room -- it's just that sometimes it takes a shoehorn and a
>>little Crisco.
>
>Surely you don't say this from a designer's perspective. Weighting the
>various elements in any medium, whether it's the web or a print ad, is
>serious business.
[snip]
>If I had carefully
>planned this particular page, the magical "10-20 pixels" you ordered up
>would dramatically affect the way the page worked. Not having the text
>sitting beneath the images reduces clutter, improves the focus and
>understandability of the site, and in short, looks cool.
[snip]

Actually yes, most of that post was tongue-in-cheek, but I think I may have
clouded my main point a bit. While you are correct in your statement about
adding 10-20 pixels willy-nilly to a "carefully planned" layout, part of
that careful planning needs to be the incorporation of meaningful
information design.

The reason I don't really like the mouseover used in the previously
mentioned site is because the separation of the link icon and its
description is a little unnerving to me. That's not to say it doesn't work,
just that it could be designed to work better. When I mouse around the
links in the top frame, I watch the center image for the description and
not the icon I'm pointing at. So I don't really make a connection between
the icon and section heading (e.g., the connection between the building
icon and "Administration").

An example of a layout that avoids this problem by pairing the link icons
and their descriptions is at:
http://www.serve.com/apg/babble/osu

Just as a disclaimer, and to not take undue credit, this is not my design.
It was just a quick tweak of an existing interface as an illustration of a
possible design choice.

- - Porter

+--------------------------+--------------------------+
| Porter Glendinning | Century Computing, Inc. |
| WWW Developer | 8101 Sandy Spring Rd. |
| | Laurel, MD 20707 |
| http://www.cen.com | T: 301-953-3330 |
| pglendinning@cen.com | F: 301-953-2368 |
+--------------------------+--------------------------+
[This mailing list is a service of High Five http://www.highfive.com/]
[ To unsubscribe, send the following one line to babble@highfive: ]
[ "unsubscribe <babble or babble-digest> [<e-mail address>]" ]
[ H5 Babble Design List Info: http://www.highfive.com/h5/babble.html ]

------------------------------

Date: Mon, 15 Dec 1997 16:17:05 +0800
From: "Tenacious Terry" <tenacious-t@thecybercircus.com>
Subject: Re: ADMIN: Compiling a Babble FAQ

Porter wrote:

> In the interest of reducing the number of repeat questions that
> seem to be cropping up on the list, I have volunteered to compile
> a FAQ (Frequently Asked Questions) for us.
<snip>
> Rest assured that at the very top of the list are all the
> different permutations of, "How do I make images X, Y and/or Z
> change when I move the mouse over this link?"

Ummmm, perhaps above that should be "How do I unsubscribe?". I didn't
realize this was such a difficult task, but given the number of
messages devoted to that topic, especially today, obviously I'm
wrong! :-)

Terry

------------------------------

Date: Mon, 15 Dec 1997 19:01:03 -0600
From: Darrel Austin <daustin@isd.net>
Subject: re: http://www.webtamers.com/koolshade/

>If anyone has time, please check out:
>
>http://www.webtamers.com/koolshade/
>
>- -Just getting started on this one, would love to hear your opinions,
>and/or ideas for improvement.

One big problem. The product that the site is selling is specifically
designed for blocking out the bright daytime sun. However, your site is
using a dark-of-night starry sky theme.

Maybe you had a reason for that, but I find it a total contradiction.

Minor suggestions:

1) loose the music. I think most people find that music playing in the
background is rather intrusive. I personally don't like the selection,
either. That's not to say others won't like it, but you need to realize
that there are going to be people that don't like it. Once music starts
playing, I usually leave the site immediately.

2) The home page has two predominant sets of navigation. This seems
redundant to me.

3) Your page uses Java. Why? I had to wait about 20 seconds for "JAVA to
load" and I didn't see anything that needed JAVA to be implemented.

4) Do you need to use frames?

5) The animated logo only really needs to animate once.

Hope that helps,

- -Darrel

------------------------------

Date: Mon, 15 Dec 1997 19:07:11 -0600
From: Darrel Austin <daustin@isd.net>
Subject: Re: indexing to adaptive palette

>How do I make an adaptive palette in Photoshop without shifting the RGB
>values? I find that even if I start with flat areas of web-safe colors,
>indexing the image shifts the colors slightly.

If your image uses over 256 colors, Photoshop will make a judgement call on
what 256 colors to use when it indexes the image. If you want Photoshop to
place more emphasis on specific colors (like the area of solid color) then
select a "chunk" of that area and then index the image.

I would ask why you are using an adaptive pallette and trying to use
web-safe colors at the same time, though. Use one or the other. I always
use the web-safe pallette when indexing ANY image. Some say to use adaptive
palletes when indexing photographic type images, but you will find that
Netscape will posterize those images terribly when more that 216 colors end
up on the same page. By always using the web-safe pallette, you we be sure
to have more consistent images.

HTH,

Darrel

------------------------------

Date: Mon, 15 Dec 1997 17:10:53 -0800
From: Ben Curtis <quixote@wenet.net>
Subject: RE> rollover discussion

Many are saying they will not put critical information inside a swapped image.
I would like to ask them their opinion on this site:

http://www.honda.com/cars/index.html

To explore what I mean, go to this page, pick a car, then select "Color Your
Car." This is one of the first good uses of the rollover affect that I've
seen. But the question remains, is this good design? Is it good web design,
especially for a corporation, to exclude anyone even for something so cool?

<SURVEY>
As designers, interface developers, and artists, when should we start issuing
our critical information in this manner?
Do you use the JavaScript or Java or Plug-in technologies to display crucial
information, unobtainable in any other manner?

yes: mailto:quixote@wenet.net?subject=Yes%20I%20hide%20critical%20info
no: mailto:quixote@wenet.net?subject=No%20I%20degrade%20gracefully

Please let me know when you *would* or *did* become comfortable doing so.
</SURVEY>

Also, I'd like to point out that I am all for rollovers, image-swapping, and
other sordid JavaScript mousiness. (thx, Ryan!)
e.g.: http://www.wenet.com/~quixote/LaMancha.html

This is a slight update of my first image swap. I am most proud of
"Adventure!" I feel that this type of rollover definitely adds to a page,
inviting clicking (or at least "mousing around") and adding a flavor to the
page that would be missing without. And the buttons don't just glow when
you're over them (except for "Prison" I know! I know! I couldn't
*think* of anything, dammit!)

Adding emotional impact can be just as useful (or more, if you appreciate
Myst and Riven) as adding informative substance onMouseover.

~~
__________qp_______________________________________________________

Ben Curtis "A thought
once put to words,
mailto:quixote@wenet.net loses its true essence.
http://www.wenet.net/~quixote But what else can we do?"
[This mailing list is a service of High Five http://www.highfive.com/]
[ To unsubscribe, send the following one line to babble@highfive: ]
[ "unsubscribe <babble or babble-digest> [<e-mail address>]" ]
[ H5 Babble Design List Info: http://www.highfive.com/h5/babble.html ]

------------------------------

Date: Mon, 15 Dec 1997 12:36:23 +1100
From: daniel keating <keeto@netinfo.com.au>
Subject: Re: Arch of Strength

> To honor his father I would like to use a depiction of this
> so called "Arch of Strength" as accurately as I can to the actual
> mathematical function for the main banner on the site.
> I might also want to render it 3D (extruded), so if you
> have any thoughts on what app. and approach would be best for that you
> will have my appreciation for that as well.

for rendering mathematical functions my first pick would be POV-Ray
(http://www.povray.org) because it's free and works on just about any
system on the planet.

daniel keating:)

------------------------------

Date: Mon, 15 Dec 1997 19:23:00 -0600
From: Darrel Austin <daustin@isd.net>
Subject: re: Using rollovers...why?

> Most commonly, image swapping happens when the mouse crosses over a link. I
>*know* where my mouse is. I don't need the web page to tell me where my mouse
>is. Buttons reacting to the mouse arrow destroy the intuitiveness of a button
>- -- isn't it supposed to look like something you press?

OK, which is worse: over-used rollovers or over-used 3-D buttons?

Rollovers do serve a purpose, and that is some sort of user feedback.
Basically it lets the user know that "yes this is an active part of the
page." The technique of rollovers (mouseovers) is quite popular in
multimedia authoring. On the web, Hypertext is the framework, and
traditionally, and underline word meant the same thing as a rollover in a
multimedia title. We are now merging the two.

3-D "buttons" aren't the most appropriate choice all of the time. "buttons"
are a remnant of the real, tactile world. Most OSs still use the "button"
(MacOS, Windows) and it is simply something that people have come to rely
on as anything that is rendered as a 3-D image means "click me".

Obviously, it makes little sense you use both techniques, and often,
neither technique is appropriate.

> Now, if the button doesn't look like a link, then its reaction to my
>mouseover may aid me in determining whether it's a link or not, which is good,
>but is this good design?

Sometimes a simple rollover is nice. Perhaps we are just seeing too many
badly or uneccessarily implented rollovers that the meaning is lost.

>Take a look at what MSIE did, and then Netscape mimicked after they decided to
>screw up a good thing: all the buttons at the top of the browser became flat
>icons that don't invite pressing. They only become buttons *after* you've
>decided you want to press them and have moved the mouse over. That's just
>poor interface design.

Interesting point. But, perhaps it is good interface design (removing
uneeded effects only to use them when needed) but it is wrong in that it
goes against all of our training and past experinces using the computer.

Or maybe not...

I do like IE4 implementation of navigation. Instead of using the 3-D button
found within the OS, they are using underlined blue text. THAT makes sense,
as we are now used to the hyperlink as a means of input/feedback.

I can't explain Netscape 4's ridiculous 3-D picture icons.

Interesting topic...

Darrel

------------------------------

Date: Mon, 15 Dec 97 20:29:10 -0500
From: Matthew Snow <snow@maine.rr.com>
Subject: Re: Rollovers: The Definitive Example

>So, we have a number of divergent views about the utility of rollovers!
>Perhaps what is missing is an example of a truly unique application.
>
>Check this: <http://www.BennettGold.ca/> and click through any of the
>image links.
>
>This rollover features capture-video accent images in the upper-left
>quadrant and an intuitive 'click' image as a secondary pop-up button.
>
>Notice how all the rollover images were pre-loaded in the initial page.
>Efficient code structure is one secret to rollover success.
>
>Comments in response? I invite your private correspondence to:
><mailto:president@planetcast.com>

I don't think this is a unique application, as I have seen this approach
many times. What I did see was text not lining up on the rollover images,
and every rollover image was a picture of a white middle-aged guy (except
for the contact image).
Sorry if I insulted you, I just tell it like it is.
Matt

snow design
portland, maine.
207.774.5452
snow@maine.rr.com

------------------------------

Date: Mon, 15 Dec 1997 20:43:21 -0500
From: Brian Dame <brian@iweb.net>
Subject: Re: indexing to adaptive palette

>Date: Mon, 15 Dec 1997 09:39:39 -0400
>From: Amy Eisenfeld <amy@pixeldance.com>
>Subject: Re: indexing to adaptive palette
>
>How do I make an adaptive palette in Photoshop without shifting the RGB
>values? I find that even if I start with flat areas of web-safe colors,
>indexing the image shifts the colors slightly.
>- --
>Amy Eisenfeld, Designer
>PixelDance Communications Inc.

- --
Ahh, the dreaded shift. There are several workarounds to fix this problem,
but unfortunately, none of them are simple.

The easiest solution is to get a hold of Debabilizer and use it to index
your images. It won't shift the colors like Photoshop does and it has some
nifty scripting capabilities.

The second solution is to open the color table of each of your images and
force the color back to it's correct RGB value (really a pain, but
sometimes it's easier).

We have a tutorial on these first two techniques up at our production site:

http://www.iweb.net/~harold/graphics/052997.shtml

(the site is an internal one, so my apologies for any obscure references.)

The third solution is to read about the WebScrub image optimization
algorithm developed by Todd Fahrner at Verso. The freely available plug-in
allows you to use a sliding bar to control how much shifting occurs in your
image. Really cool.

http://www.verso.com/agitprop/dithering/

Good luck!

- --
Brian Dame
Minister of Production
Interweb, Inc. || http://www.iweb.net/

------------------------------

Date: Mon, 15 Dec 1997 17:56:44 -0700
From: Kam Stewart <kams@imagesinlight.com>
Subject: RE: technical possible?

> If a real button in, say, my car reacted to my finger being nearby,
> then I'd run screaming.

No, you wouldn't. When people walk through Bill Gates' home, they are
followed by music and the lights in the rooms turn on, and off again after
they leave. (as well as the homes of a few other well off indviduals who
have some extra cash burning holes in their pockets)

Amazingly, there haven't yet been any media reports of screaming visitors,
but hey, I don't read the Enquirer enough.

Let's first realize that technology is continually changing. In cyberspace
the experience we create is based on reality in order to enable the
viewer/participant to more easily relate to the interface without a cbt
course of computer commands and functions. The fact that buttons don't glow
in my car isn't because I wouldn't like them to, or that I would feel
they're possessed. In fact, if the buttons did glow at night, as my hand
rolled over, perhaps signalling some status info on a central led screen
above, it might make using the heater, radio and electronic mapping panel
that much easier to use.

We do have to take the expected user audience into account, and design to
meet their needs. If we're talking nomads on the Serengeti, without access
to tv, then this might be an issue. But, then there would be much greater
issues here anyway.

My point is cyber-space allows a lot of things that don't necessarily map
directly to the real world. But then again, it can't match a much greater
number of others that the real world can. --We still can't smell on our
computers, though I predict this limitation will pass in fifteen years max.
A gov. proposal to fund medical research in this area failed to pass this
year, but it will eventually.

So, what is the point? Communicating. Effectively. To the intended target
audience.

>Buttons reacting to the mouse arrow destroy the intuitiveness of
>a button

Why? When I skim a page, I move the cursor to look for hot areas. It's very
quick and intuitive. My cursor changes from an arrow to a hand, but I don't
scream. The main reason I do this I confess, is that what represents a
button on many sites is not consistant or regularly clear. The additional
addtional stimulus is helpful for this reason.

>-- isn't it supposed to look like something you press?

God, I hope NOT every page design takes this metaphor. Should every page
look like a VCR panel? I hope not. This is a new medium. With new metaphors
that evolve. Cinema has evolved from one camera shot continuously in front
of a stage, to something hardly recognizable for reality (aka Mtv or a
Quintin Tarrentino or Peter Greenaway film), But I haven't seen a lot of
one-act movies since Rope, even when they are based on linear plays like
MacBeth.

> Flat or greyed out means "don't press me." It only becomes a button when the
> mouse is over it.

When does this reflect reality? does your car do this? When something is
greyed out, I probably won't roll over it to find out. It tells me that
this is not a possible option at this time. It is only when it appears
active, that I will check.

Also unlike reality, monitors are very low resolution. We as designers are
constantly trying to overcome this limitation. One way sometimes
appropriate is by providing context sensitive information. To verbally
explain an entire screen is both combersome and can lead to information
overload. Allowing specific information to appear with rollovers can
enhance understanding and minmize the time to glean this knowledge.

For an instore kiosk we created for Levi's we used an audio guide explain
the simplest steps to the customer and walk them through the process. On
screen popup 'grease pencil' notes would appear when they started to wander
off too far, along with another voice suggestion. This greatly enhanced
usability, and was well recieved in user testing.

The technique provides a type of easter egg if you will, enhancing the
explorative experience in a subtle way. This _can_ be abused, just as
creating 'buttony' buttons can be. Again, it is about creating effective
communication for the intended audience.

Innovation shouldn't be derrided simply because it is new or unique. It
also shouldn't embraced simply for those reasons either.

thoughtfully,

Kam Stewart

Images in Light, inc.
-creating interactive communication for a digital world
___________________________________________________________________
t.415.575.4915 885 Bryant Street, Suite 202
f.415.575.4917 San Francisco, CA 94103
kams@imagesinlight.com http://www.imagesinlight.com
___________________________________________________________________

------------------------------

Date: Mon, 15 Dec 1997 22:40:49 -0500
From: Aaron Christy <christy.18@osu.edu>
Subject: Re: babble-digest V1 #76

>Date: Mon, 15 Dec 1997 10:38:34 -0800
>From: Ben Curtis <quixote@wenet.net>
>Subject: Re: technical possible?

> What I find horribly under-discussed in this arena, for example, is "Why
>rollover?" Is it popular because its fun for the designers to make or
>envision, or is it popular because it serves a use?
>
> Most commonly, image swapping happens when the mouse crosses over a
link. I
>*know* where my mouse is. I don't need the web page to tell me where my
mouse

>is.

The real issue at hand is intuitiveness. What you find intuitive (such as
"where your
mouse is") may or may not be intuitive to the rest of the Internet
community. Case
in point: I bet that if you decided to unsubscribe to this list you either
(A) sift through
your old e-mail to find out where to send an unsubscribe command or (B) go
to the
H5 Babble site and find out there. However, look at how the Babble list
has been
cluttered by people who don't know how to unsubscribe and have sent their
request
to the list itself.

The same follows through to web design. A designer who feels his well
designed
button screams "push me, push me" may simply say "what the hell is this bottle
cap doing on this page?" to an average user. I agree that well designed
navigation
and intuitively designed buttons are important, but associating action with
those
buttons (i.e., rollovers) assists in capturing a visitor's attention and
may help to
guide them to areas of interest. However, like you pointed out, no
designer can
simply rely on this rollover technique due to browser incompatibility.

Rollovers, like any UI technique, are worthwhile and effective when done
correctly.
The average user (if there truly is such a thing) looks to the web for
interactively,
responsiveness, and movement. This is perhaps why blink tags and gif
animation
gained such wide-spread popularity. . . just as their poor usage has caused
much
of their demise.

- ----------------------------------
Aaron Christy
ATW

http://jujubee.cob.ohio-state.edu/~christy
[This mailing list is a service of High Five http://www.highfive.com/]
[ To unsubscribe, send the following one line to babble@highfive: ]
[ "unsubscribe <babble or babble-digest> [<e-mail address>]" ]
[ H5 Babble Design List Info: http://www.highfive.com/h5/babble.html ]

------------------------------

End of babble-digest V1 #78
***************************

Previous | ToC | Next