3 ms·

Show HN: Discreet Twitter buttons

16 points by tholman 14y ago

mipapage 14y ago
Interesting; I think a couple of those may break their logo user guidelines. While they are fun, I have a feeling that engagement or clickthru of the element they uncover may be higher without the layer of complexity on top of them.
- maxmcd 14y ago
  That's certainly true, and something I've witnessed in the past when implement hover-to-reveal social buttons. I feel like these are great for personal sites or small projects where you might be able to sacrifice a little on the conversion side in exchange for some added visual aesthetic.
habosa 14y ago
Wow those are beautiful. Nice work!
eli 14y ago
They look really slick, but I have to say I'm not a big fan of things that jump around when my cursor happens to move over them.
ohhmaar 14y ago
Very simple. Very smooth animations. I like.
zmitri 14y ago
Although I wouldn't put these on a consumer site, I might throw it on the personal one. These are absolutely beautiful. Great work tholman.
danso 14y ago
This is a cool effect, but I wonder if it wouldn't be more effective if instead the reveal had the logo come in after the onhover. What I mean is that the link is plaintext, something like "Follow me at @username", which most people recognize as a call to action and a link to Twitter. Upon hover, the Twitter blue is applied with some animation, maybe something like the logo flying in. (yes, I know that screams against most people's personal design aesthetic here, but maybe it will work for some designers who want to stand out and are clever about it). The main difference is that the Twitter logo is too discrete. There is literally no call to action and there's nothing about the Twitter logo that leads me to think that hovering over it will reveal the call to action. It's more likely to make me think: "This person works at Twitter!" * edit: on reflection, I do realize that those Twitter icons, especially when used in conjunction with other social icons, are recognized as the "These are the social accounts", especially when they are in the footer. But I guess you'd have to do something different for the other social buttons? If it's just one Twitter logo and no other social-button context, I still think that the call-to-action is too subtle.
vineet 14y ago
My problem with such buttons is actually something slightly different: I often notice that on webpages that it looks like the page is interesting and I want to follow similar work, but I don't know how much noise is on the person's twitter account (as opposed to the person's projects). ...I would like to see the most recent tweets show up when I hover over the button.
JoshTriplett 14y ago
Interesting, but it seems to show up as a Unicode missing character of E000 rather than whatever it intended to show up as.
- tholman 14y ago
  Sorry about that, had some CORS problems with the fonts... should be fixed :)
  - JoshTriplett 14y ago
    What's the advantage of a font over an image here?
    - tholman 14y ago
      Thats a very good point, using a font had the advantage of malleability when building them (colors, size etc) ... but now that they're finalized, I should shift them over to images.
shyn3 14y ago
Awesome work. Would this be against the new TOS for Twitter where you aren't supposed to modify the bird?

16 points by tholman 14y ago

Interesting; I think a couple of those may break their logo user guidelines. While they are fun, I have a feeling that engagement or clickthru of the element they uncover may be higher without the layer of complexity on top of them.

maxmcd 14y ago
That's certainly true, and something I've witnessed in the past when implement hover-to-reveal social buttons. I feel like these are great for personal sites or small projects where you might be able to sacrifice a little on the conversion side in exchange for some added visual aesthetic.

habosa 14y ago

Wow those are beautiful. Nice work!

eli 14y ago

They look really slick, but I have to say I'm not a big fan of things that jump around when my cursor happens to move over them.

ohhmaar 14y ago

Very simple. Very smooth animations. I like.

zmitri 14y ago

Although I wouldn't put these on a consumer site, I might throw it on the personal one. These are absolutely beautiful. Great work tholman.

danso 14y ago

This is a cool effect, but I wonder if it wouldn't be more effective if instead the reveal had the logo come in after the onhover. What I mean is that the link is plaintext, something like "Follow me at @username", which most people recognize as a call to action and a link to Twitter. Upon hover, the Twitter blue is applied with some animation, maybe something like the logo flying in. (yes, I know that screams against most people's personal design aesthetic here, but maybe it will work for some designers who want to stand out and are clever about it). The main difference is that the Twitter logo is too discrete. There is literally no call to action and there's nothing about the Twitter logo that leads me to think that hovering over it will reveal the call to action. It's more likely to make me think: "This person works at Twitter!" * edit: on reflection, I do realize that those Twitter icons, especially when used in conjunction with other social icons, are recognized as the "These are the social accounts", especially when they are in the footer. But I guess you'd have to do something different for the other social buttons? If it's just one Twitter logo and no other social-button context, I still think that the call-to-action is too subtle.

vineet 14y ago

My problem with such buttons is actually something slightly different: I often notice that on webpages that it looks like the page is interesting and I want to follow similar work, but I don't know how much noise is on the person's twitter account (as opposed to the person's projects). ...I would like to see the most recent tweets show up when I hover over the button.

JoshTriplett 14y ago

Interesting, but it seems to show up as a Unicode missing character of E000 rather than whatever it intended to show up as.

tholman 14y ago
Sorry about that, had some CORS problems with the fonts... should be fixed :)
- JoshTriplett 14y ago
  What's the advantage of a font over an image here?
  - tholman 14y ago
    Thats a very good point, using a font had the advantage of malleability when building them (colors, size etc) ... but now that they're finalized, I should shift them over to images.

shyn3 14y ago

Awesome work. Would this be against the new TOS for Twitter where you aren't supposed to modify the bird?