sergiop / react-giphy-searchbox

Responsive and customizable search and select for Giphy's GIFs and Stickers.
https://sergiop.github.io/react-giphy-searchbox/
MIT License
48 stars 19 forks source link

Attribution & Giphy Guidelines #36

Open antoinejaussoin opened 3 years ago

antoinejaussoin commented 3 years ago

Hi!

Thanks for your amazing component, which I'm using on retrospected.com.

I've just received an email from Giphy, stating that the component doesn't comply to the Attribution Policy:

Spark_-_antoine_jaussoin_com

Looking at their website (https://developers.giphy.com/docs/sdk/#design-guidelines), it looks like the component needs to somehow display the image creator's handle/username and perhaps a link to see more from them:

GIPHY_Developers

My question is: is that something you are planning to work on at some point?

Thanks!

sergiop commented 3 years ago

Hi again @antoinejaussoin and thanks for reporting πŸ™‚ .

At the time I developed this module they haven't released this guidelines yet, but I think we can add what they're asking. Do you think it could be enough to add the name of the contributor for each result (linked with the original media on Ghiphy's website), or do you believe we should implement a more complex solution, like the one they are showing in their docs? I understand the needing of give the right attribution to the authors, but I don't want to add too much complexity to the UI, keeping it simple and focused in with the main purpose.

sergiop commented 3 years ago

@antoinejaussoin I quickly drafted a possible solution (take a look at the first two results in the below image), but I don't like it so much. Adding the name over the image, in our case, significantly covers the image itself. Otherwise, showing it on mouse over, forces us to manage differences between non-touch and touch devices. Any suggestions or feedback?

with-author

sergiop commented 3 years ago

A further thought: opening their website at the trending page, I can't see any attribution to authors showed over the images on mobile/touch view, neither on the onMouseOver action. Otherwise, on desktop view I can see the attribution only on the onMouseOver action. The problem is that our "widget", as well on desktop view, take up much less space than their desktop layout.

Anyway... following what they are doing on their website, probably a compromise solution could be to hide the attribution on mobile/touch view and show it on the onMouseOver action on desktop view.

Giphy Website mobile view Giphy Website desktop view
antoinejaussoin commented 3 years ago

Hi! Apologies for the late reply.

I was wondering if a simple tooltip over the image wouldn't be enough? As you said, it would only work on desktop but it's probably fine?

sergiop commented 3 years ago

@antoinejaussoin I understand the purpose of giving the proper attribution to authors asked by Giphy's team, but this module is intended to have a quick search and select tool, I don't want the user can be distracted by unuseful information. I think that the idea I proposed could fit the main need (as well the tooltip, it’s just an aesthetic issue). I can add it, maybe leaving it optional with a prop, but we have to figure out if the Giphy's dev team will like the way we will add this feature.

caleb15 commented 3 years ago

I could be wrong but I think you just need a updated logo?

https://developers.giphy.com/faq/

What conditions does my app/project need to meet in order to get a production API Key?

Glad you asked! As per our section 5A of our Terms of Service, we require all apps that use the GIPHY API to conspicuously display "Powered By GIPHY" attribution marks where the API is utilized. You can find approved official logo marks here. You may also be asked to provide screenshots or a video of app during the application process.

https://support.giphy.com/hc/en-us/articles/360028134111-GIPHY-API-Terms-of-Service-

Approved logos: https://media.giphy.com/giphy-attribution-marks.zip

sergiop commented 3 years ago

I could be wrong but I think you just need a updated logo?

I don't think so @caleb15, I'm using the Poweredby_640px-White_HorizText.png logo you can find inside the approved logos ZIP set. Anyway, with the poweredByGiphyImage prop you can change it with the one you prefer from that set. πŸ˜‰

Schermata 2020-10-22 alle 10 44 02