When is UI eye candy appropriate in a web app?

Question

To start with some context, I'm so annoyed whenever I get on a Windows computer that has the settings adjusted for "best appearance" over "best performance" that I instinctively turn off all fades, transitions, animations, etc. immediately. I almost can't focus until it's changed.

However, when it comes to my web apps, I will very occasionally throw in some "eye candy" - maybe a slight transition because the instant transition seems distracting or too abrupt.

I feel like a hypocrite though. I never opt for a slower UI on a desktop machine, and when I change desktop settings for family, friends, and clients, no one EVER asks to switch back to the old, slower way.

So am I biased or are there some legitimate rules of thumb for when it is actually appropriate?

In my current dilemma, I'm using a Javascript paginator with a fade in to show the next page's worth of content over 0.75 sec because if I do not do it, the change causes a tiny flicker (distracting to me), but maybe if I was in the user chair, I would be screaming, "just show me the page already!"

Thoughts? Anyone read any good books on this stuff?

Edit: I should mention that in my current example, the next page is almost always ready to be displayed instantly if I so desired. I prefetch the next page while the user is on the current page. That's one aspect of what makes something like this "eye candy" to me. I could do it faster with almost no difference to the user.

2nd Edit: Thanks for all the suggestions and considerations. There are several books that I'm looking forward to reading. I marked the ui-patterns website as the answer because it will be the most immediately useful for this type of problem. Also no one mentioned the YUI design pattern library, but I came across it later. It's an excellent resource and even addresses this issue. Also, I definitely intend to seek user input when I'm at that stage for this particular example.

Lastly, I understand that my initial reasoning about it didn't take into account my familiarity with windows vs my app. Since I'm so used to the Windows desktop, I now just want to get things done. Maybe way back when I first used xp, those transitions where helpful for a day or two. (I don't remember that being the case but maybe.) Probably the same will be true for my transitions in my web app if it's used often enough. Soon I (and my users) will be tired of any eye candy that I add even if it is very brief. I'll see and ask.

Thanks, everyone!

Answer 1

I really like the new 'low bandwidth view' that MSDN supports. I'd like to imagine that as a more common standard on websites.

That way, I can pick my user experience which may change at different times.

Answer 2

I have found UI Patterns to be very helpful when making UI decisions.

Answer 3

There is no easy answer The Design of Everyday Things is a good place to start looking into simplistic design. Sites like SO that have a "clean" look with a little extra flash (figurative not the adobe kind) seem to fair the best.

Exactly not MSDN is a good place to start...

Update - As pointed out by John in the comments the low bandwidth view of MSDN is actually pretty nice. Good call John Weldon I had never looked at it before (and likely never would have). Thanks!

Answer 4

but maybe if I was in the user chair, I would be screaming, "just show me the page already!"

I think the easiest way to work out if your transition is useful or not is to ask your users. Same for any UI technique you want to use to improve the experience.

I think Rules of thumb will be difficult as different apps (web-based or not) have different audiences, different usage expectations, etc.

Answer 5

Animations also help to draw the user's attention to a portion of the screen. Used carefully, they can make the system much easier to use. Some of the eyecandy in windows just exists to slow things down and forces the user to wait. My biggest issue with scroll out menus in windows is that I already know what I am looking for and where to find it. The menu just adds a delay. That might not be true in your web-app because the user is exploring your system.

If a system is attractive and presented well, it puts the user in a better mood and makes them more confident that they can solve problems. When a problem presents itself "how do I do xyz" they find the problem easier to solve. Putting time and effort into making the UI nice will pay off both through a better user experience and also a better marketing image. It also makes you proud to work on the system, which is crucial to having a great product. The hallmark of a great product is one that the developer themselves uses on a regular basis.

Answer 6

I like web app effects and eye candies. Just don't make it "overkill" :)

Answer 7

Basically, if your web application is one-of-a-kind and you don't believe you'll have much competition, then eye candy is completely unnecessary, as people will use your service regardless (because it's the only one). However, if you have a lot of competition to deal with, a nice design and pretty animations will definitely attract more users, because you need something to impress them with.

Generally, as long as it doesn't hurt usability, go for it. :)

Answer 8

It depends on what you are trying to achieve with the website. We have made a few websites for brands that demand to have eye candy , be it at the expense of performance.

Answer 9

There's really only one true rule ... the only people who know the answer are your potential users. As such, you need to go off and get that information out of potential users so you can be as informed as possible about their expectations on your site.

If it's a product that is already in development you can always go get some users and test stuff.

Also, it's important to note: Even though we pretend that web-applications are the same as applications ... their not, at least conceptually in our brains. People expect that applications and web-applications work differently to each other, even if it's minute differences. Use your example of pagination. Chances are, if you wrote a full application with pagination, you'd probably expect a very quick transition. However, because it's a webpage something flags in your brain.

EDIT: If you want to read some books on interaction design, you could try Alan Coopers About Face 2.0, Lucy Suchman's Situated Actions or search around things like usability.gov.

Answer 10

UI eye candy is very important. But should never get in the way of good user experience. It's an opinion (which is slowly changing) that having eye candy will give a good user experience.

The user experience should be designed first, then add the glitter, alway remembering that in design 'less is more'

Answer 11

After checking out some of the other books mentioned here on amazon, I also came across "Don't Make Me Think". While I haven't read the book, I read many reviews and excerpts and it looks very good, so I'm adding it to the list.

Answer 12

Do you have to demo your product to somebody to sell it? Or is it a standalone site. If you are demoing a product for sale, eye candy can help people to remember what you're selling, i think.

Looking slick can make people think that your product is more 'professional'.