Nudge users towards goals with annoying CSS3 arrows(andyshora.com)
andyshora.com
Nudge users towards goals with annoying CSS3 arrows
http://andyshora.com/demos/nudgenudge/
22 comments
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!
My prediction: it'll have a positive effect on sign ups, but retention will be lower.
I'd click the button just to make the arrow go away
Surely adult sites will put this to good use.
Why is jQuery needed? Shouldn't it be just a few new CSS3 stuff and <img class="nudge>?
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.
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 :-)
I still prefer the <blink> tag.
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?
I wonder how it performs on iOS/Android devices?
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!
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!
GIF/PNG/SVG can do it w/ out Javascript or CSS. That said, this is still bloody brilliant.
Is this faster with real browsers than moving a DOM node offset, or using an animated GIF?
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.
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.
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.
Nice idea, I'll try and think of some additional options to make it configurable for this. Thanks!
At least they're honest.