Alerting visitors to a website of a current event (e.g. breaking news)

Question

Backstory:

We have a website for a conference. As part of the process of the conference, we invite people to submit sessions, but only for a limited period of time. We want to alert visitors to the site that this period is now open, and prompt them to submit a session. We were thinking of something along the lines of "breaking news" on news sites.

Currently, we have a banner that appears as part of body of the main site (see here for the real site), but it is a bit ugly. There has also been some criticism of it as being too "in-your-face". We have tried something more toned down, but it doesn't really stand out enough from the rest of the elements on the page.

Question:

How can we add something to the site that draws a visitor's attention, without it being too overbearing? Is there an approach that is commonly used that would be more suitable for this kind of thing (e.g. a growl/toast/popup of some sort)?

Answer 1

A few alternatives:

• Make the box/container/button pulsate slowly. It's not it your face and has a nice warm and lively feel to it.

• You can create an overlay when the user enters the site. Like, any article you open on upworthy, you are asked a question http://www.upworthy.com/this-rapper-can-brag-about-being-arrested-because-he-was-arrested-for-doing-some?c=fea. Can be annoying at times.

• When the page loads, you can sort of dim out everything else for a few seconds and only let the event announcement section intact. This way you are not forcing the user to take any action, everything is visible, you're just calling their attention to a specific thing for a couple seconds. Make sure the dimming is smooth.

Answer 2

I believe this solution blends in too much.

Contrast is about differences. Difference in position, in proximity, in size, in color.. disruption of the flow.

What if you disrupt it by placing it off-grid?

Like, have it in an overlayed button, but without the modal shadow usually seen. Have a different form (like, rounded corners), color (anything but green), font, etc, and make sure that it doesn't align nicely with any other element on any of its edges. Oh, and please: choose only 1 or 2 of these properties. Contrast should be noticeable, not obstrusive.

Think of how they teach it in typography: either increase size or weight but never both. If you look at the iOS homescreen for example, it's pretty obvious, wether date or time is more important according to Apple designers, but they're written in the same font!

And yes, some animation here won't hurt, but make sure to play it only for about 1-2 seconds. It's about enough to recognize (1 second is the average reaction time of a human * ) that something is there, but after that, it's only annoying.

(*) look it up in "Designing With The Mind in Mind" or "100 Things Every Designer Should Know"