mastodon / mastodon-ios

Official iOS app for Mastodon
https://app.joinmastodon.org/ios
GNU General Public License v3.0
2.05k stars 262 forks source link

Change Star Icon (☆) to Heart Icon (♡) #639

Open adishavit opened 1 year ago

adishavit commented 1 year ago

"Star" as "Favorite" traditionally means "Bookmark". It is something that the user does for themselves.
In fact, Mastodon [App] already has the option to bookmark a post - so this is a mixed and redundant message. "Heart" (or "Thumb-Up" is a meassage to the poster - "I liked your post".

I'd like the Settings option to replace the start icon with a heart icon - to indicate my kind message to the OP.

Yonodactyl commented 1 year ago

What benefit do we get from switching the context to like vs favorite?

I'm still new to Mastodon, but it does seem like they strive to have that degree of separation from a traditional social media client - the fake nature of seeing a highly liked post as popular and vice versa.

This might be a solution to streamline the transition for new users from what they are used to, but I think getting over the initial learning curve is part of the fun of a "new" client.

adishavit commented 1 year ago

Well, using a star to indicate a bookmark has been in use in browsers for almost 30 years. Trying to educate folks to think about it as a like button (which also has a long history with heart or thumbs up) is like deciding that in your app, the red tap faucet (hot water) will from now on be colored blue. UI/UX does not work like that. There are important social contexts and implicate meaning in a button or graphic design. Not only changing the graphic but switching it to something that means something else is counterproductive to say the least.

Yonodactyl commented 1 year ago

I don't think in this case we are "reinventing" UI/UX. A Star symbol (on social and blog sites) traditionally has been used as a mechanism to remember something for later (in your example bookmarks), but the star symbol has been around in UI/UX for some time now and has had a somewhat similar connotation - ratings.

You rate how much you like or dislike something with stars (Review apps, Yelp, Google, etc...), so a user could know that a star means "rate because I liked." Now, the "dumb user" will not quickly grasp this concept and I can see where it slips through, but it's not entirely far fetched!

Maybe I'm alone in this feeling - I would be interested in what the core contributors think about adopting the Heart in lieu of the Star symbol.

adishavit commented 1 year ago

Indeed, the star is frequently used for scoring or rating. In these cases it is usually one of several (5). TBH, I didn’t make the connection and I still think it sends an inaccurate message. A heart is the de-facto convention for indicating “like”. as opposed to rating or scoring which is judgmental.

eszter007 commented 1 year ago

From a UX design standpoint, I agree that a heart is more appropriate than a star. "Favoriting" something is mentally a higher commitment than a "like". Let's think about it as a real-world analogy.

As you see, liking is mentally associated with a lower commitment - usually in real-life there are many things you like but of those things only a few of them are your favorites.

Thus, we can ask ourselves: What is the purpose of the interaction? Why do you want users to press the favorite/like button? This interaction serves in social media as a general support for the other users to continue (positive mental stimulation). The more feedback you get, the more dopamine is omitted and the better you feel about yourselves. As a , you post more. Posting more is better for the overall network since the network effects are stronger. If you don't get much feedback, you might even stop posting. Here, the product goal from my perspective to foster more interactions. And you get more interactions by a low-commitment support interaction which is essentially the like (= heart). For example, if you see a post, rather than thinking "Hey, this is my favorite post, you express "I like this." (But it does not need to be my favorite).

Regarding the symbol, we can think one step further. Favorites are often indicated by a star (e.g. browser bookmarks), while likes are indicated by a heart (Instagram, Twitter, TikTok). However, a heart is also subconsciously associated with Love. Saying you love something is also quite a high commitment. How many people are there whom you like but how many do you love?

I think in this context, implementing rather a reaction-based system where the user can select the most appropriate reaction from a couple of emojis (e.g. ♥️👍👏🥳...) such as used by Github, LinkedIn, Facebook, Whatsapp, Signal, ... will provide the most value:

The reason why I would limit the selection of emojis is that I would like to avoid negative feedback as it can be counter-productive (e.g. imagine you get a 🙄 reaction). Still, too many options also bears the risk that the cognitive load is higher since you have to make a decision unless there is a good default reaction. So I'd also recommend a test for this idea.

As a next step, we could quickly prototype different solutions in Figma (= heart button, emoji reactions, favorite button) and test these in a few UX tests. Additionally, A/B tests (heart vs. star; winner of the heart/star-interaction vs. emoji reactions) might also be an option to make a good decision here. Side note: As a UX designer, I'd be happy to contribute here and do this research - however I am not sure what the process is like in open source environments when it comes to design as I didn't see a Figma link/Miro board, etc for user research/UX ideation, etc.

adishavit commented 1 year ago

@eszter007 thanks for stating what I said so much clearly! Note that my original request, was rather humble - allow the user to change the icon in the app (settings). All the underlying systems remains in tact. 🤷‍♂️

Yonodactyl commented 1 year ago

Love the thoughts and thoroughness here @eszter007 and @adishavit

I don't disagree that the sentiment behind a heart makes more sense in comparison with a star - it's what you see all around other social platforms. I just wanted to open the discussion to see what benefits exist for either or. In a way, I was asking about thoughts about AB-testing the symbols we use, but I suppose that didn't come across in my posts; therefore, sorry for any confusion that came across!


Hope you didn't take any of my comments personally @adishavit - I think discourse is a foundation of open source, so it's better to think through ideas rather than just implement for implementation sake.

I would love to see a clearer process here in the community for pitching ideas and getting them through an approval and implementation process. This could serve as a great foundation for the argument for it!

adishavit commented 1 year ago

I think the discussion here is important. It also seems that there is a general agreement that the current star icon is indeed somewhat ambiguous.

kaleb-haugen commented 1 year ago

My comment certainly isn't as thoughtful as many above, but I do really appreciate the concept of the neutral "react/reaction" that doesn't assume a particular emotion for engagement. With this in mind, a stylized theatre mask 🎭 icon (comedy/tragedy) with a limited submenu of base reactions: like 👍🏼, love ❤️, thinking 🤔, sad 😢.

All reactions could be treated as engagement so any ActivityPub app/service not supporting this more complex model would just display "favourites".