Peertube: Improve discoverability of sponsorship

[alexgleason]

Per #629, several people felt that the "sponsor" button was too hard to find.

It uses a heart symbol which could be confused for favorite or like. It is also gray, like the other buttons. As a result, the button is easily overlooked.

I propose that we:

1. Make the button green. This button should be bold and unique to draw attention to it.
2. Change the heart symbol to a different one. (see below)

END. Optional info below.

---

About the symbol:

I am leaning towards dollar sign $ as the best option. I know it's not international, but it's used by many countries (Canada, US, Mexico, Australia, most of South America, Jamaica, Singapore, Taiwan, Hong Kong, etc).

It is a concern that Europeans may be discouraged from clicking it, but at least it sends a very clear message: "this is how you can support with money." Other icons are not so clear.

---

Why this is important:

PeerTube is a decentralized, independent platform. A major appeal is that PeerTube respects its users and gives them freedom. This is unlike YouTube, which recently changed their algorithm and caused many channels to lose money and be forced to shut down.

I think if creators see that PeerTube puts emphasis on their ability to get funding, it will make the platform more appealing to them. This is something that PeerTube can do that is clearly better than YouTube to the average person.

[rigelk]

I get the will to send a clear message, and since it is the primary way to get funding the message better be clear :)

However the button has a broader purpose than just asking for money. You might want to ask for something that isn't money, like a call to action or just anything you find supporting. In that sense the icon shouldn't be tied too much to money, IMHO.

[alexgleason]

Ahh, I see. Thanks!

You might want to ask for something that isn't money, like a call to action or just anything you find supporting. In that sense the icon shouldn't be tied too much to money, IMHO.

Do you know if anyone is actually using it this way? Having a flexible solution is always nice, but in this case I think there is a strong argument for creating a purpose-driven action: help people get funding and drive them to the platform.

For what it's worth, I'm saying this as a person with an intense hatred for work. I don't think people should have to perform on the internet and then beg for money to survive. But I've also lost hope that a radical change will happen soon, so I think making small accommodations like this might actually help people in the short-term.

EDIT: I'm trying to explain why money specifically is something useful to emphasize.

[pafcu]

I'd argue against using a dollar sign, because to me that evokes a negative reaction (paid content that I _have_ to pay for, sponsored content, etc.). Perhaps a dollar sign with a smiley face would better convey that it's about supporting rather than paying.

[Chocobozzz]

Make the button green. This button should be bold and unique to draw attention to it.

The admin of thinkerview.video overloaded the peertube CSS so the button is green (for quite some time), and I must admit it's really interesting: https://thinkerview.video/videos/watch/39972d84-1054-4cee-af60-ca7c398b9d13

[ldidry]

Perhaps a dollar sign with a smiley face would better convey that it's about supporting rather than paying.

On diaspora*, it suggests to pay to make the hoster able to have a coffee. So maybe something like that : ☕/💲/♥️ = 😘 (just a thought)

[scanlime]

I'm really glad we're having this discussion! Having a good symbol to communicate micropayments for open content is perhaps as important as the underlying mechanism.

[Bugsbane]

Two ideas:

1. Like Facebook, there could be a handful of options that the uploader could choose from such as "Donate" "Buy" "Support" "Download" "Visit" each with their own icon.

1. A bit more ambitiously, we could just let the uploader choose the text and icon, as well as the link, for the button.

[Niquarl]

It is a concern that Europeans may be discouraged from clicking it, but at least it sends a very clear message: "this is how you can support with money." Other icons are not so clear.

I agree that this could be seen as a way for it to be american centric but it's still seen as a pretty internationcal symbol for money. On my french keyboard I have three currency symbols, the €, the $ and the £. Perhaps using these three would better.

I also love the idea of offering a few other options, like "Support!", "Act", "Buy Merch!" ect...

[gnouts]

My 2 cents...
I really like the support button. "Support" is good enough for now, and ideally it should be completly customizable : choosing the wording and the icon (from fork-awesome which support 40+ currency icons, for example). Anything in between is not suitable.
I think relying just on few icons that are popular on US and Europe is not a wise choice and doesn't fit the idea I have of this project.

(Also, if anyone have the CSS to make button look like on ThinkerView instance, I'm interested 😊 )

[Bugsbane]

From a design / UX point of view, I'd be cautious about having multiple buttons using different colours for different things. Typically you use one specific colour that suggests that an item, such as a button, is interactive. The less consistent that is, the harder it is for the user to intuit.

Until we have a fully customizable button though, I wonder if an icon that suggests giving and not just liking may be closer to the message we're trying to get across. Possibly something like:

[1000i100]

@gnouts

(Also, if anyone have the CSS to make button look like on ThinkerView instance, I'm interested 😊 )

div.action-button-support {
    background-color: #45be84 !important;
    color: white !important;
}
div.action-button-support:hover {
    background-color: #61cb98;
    background-color: #d84759 !important;
}

[Chocobozzz]

I updated the icon in https://github.com/Chocobozzz/PeerTube/commit/64ff48cb8d854f43884cd769d1eec71f6394cd77

Let's test with a green button: https://github.com/Chocobozzz/PeerTube/commit/2fcc2294974dacef3c83928abf0f299e8ae12cd2