

Nudge users towards goals with annoying CSS3 arrows - andyshora
http://andyshora.com/demos/nudgenudge/

======
crazygringo
Wow, they're right. It's really annoying.

At least they're honest.

~~~
andyshora
I'm going to split test it on a new site soon, have no idea if it will have a
positive effect on sign ups. What do you reckon? I'll do a post on the
results, either way!

~~~
noahlt
My prediction: it'll have a positive effect on sign ups, but retention will be
lower.

~~~
andyshora
You are probably right. I've made a 'hideAfter' option, so it can maybe do 2
or 3 small nudges then disappear, so as to initially draw the eye to a CTA.
Although by default it's set to annoying mode :-)

------
faulkner
Surely adult sites will put this to good use.

------
slig
Why is jQuery needed? Shouldn't it be just a few new CSS3 stuff and <img
class="nudge>?

------
tobyjsullivan
Awesome concept and I think it has some potential to evolve but for now I see
two problems. 1) The motion makes it too distracting from other page content
(at a sub-conscious level) so you may as well just have a blank pages with the
action item as nothing else can be consumed. 2) If you're trying to use the
arrow to identify the real action item on a page littered with ads, this will
just make it look more like an ad.

~~~
andyshora
Thanks for the feedback! I've made a 'hideAfter' option, so in a serious
scenario I'd probably set it to hide after a couple of nudges, so as to draw
the user there initially. But for the demo I've set it to infinite so as to
annoy all of you as much as possible :-)

------
devinfoley
I still prefer the <blink> tag.

------
jcurbo
Typo in the large title at the top? ("nugenudge" - the code and URL says
nudgenudge)

~~~
andyshora
well spotted, thanks :-)

------
aroman
Cool idea, but at least for me (2012 13" MacBook Air), scrolling smoothness
suffers slightly (yet noticeably).

I wonder how it performs on iOS/Android devices?

~~~
andyshora
Thanks :-)

It performs surprisingly well on iPhone 4, no additional work done for mobile
support, the mobile browsers tend to handle CSS3 animations pretty well.
Perhaps if the animation was constant (as opposed to an easing transition) it
would be less jerky, but then it would be extremely annoying!

------
newaccount2
GIF/PNG/SVG can do it w/ out Javascript or CSS. That said, this is still
bloody brilliant.

------
grakic
Is this faster with real browsers than moving a DOM node offset, or using an
animated GIF?

------
rhizome
It's the blink-tag form of a CTA.

Also, inevitably there will eventually come a need for an orange one pointing
to their how-to video. "Don't forget to sign our guestbook!" "Also, this other
thing is kind of important." Just use better page design rather than greebling
your existing one.

------
5vforest
Unfortunate that the arrows aren't actually drawn with CSS3.

~~~
andyshora
v2.0 :-)

------
dr42
Rather than use this do the call to action, a better usage for me would be a
'help mode', user clicks help and a wucik walk through of functionality is
presented using these arrows to draw attention to some area of the screen.

~~~
andyshora
Nice idea, I'll try and think of some additional options to make it
configurable for this. Thanks!

