element-hq / element-web

A glossy Matrix collaboration client for the web.
https://element.io
GNU Affero General Public License v3.0
11.23k stars 2k forks source link

Emoji picker UI #1107

Closed ara4n closed 4 years ago

ara4n commented 8 years ago

Once upon a time a suggested design wireframe for this was:

screen shot 2016-03-10 at 16 25 04
AndrewJDR commented 8 years ago

Much preferred over the text-based search method for emoji as it stands!

superdump commented 8 years ago

:+1: or in general, I feel that GitHub do a pretty good job with emoji UX-wise.

joelostblom commented 7 years ago

This would be a very helpful addition! I was having troubles writing emojis initially, as autocomplete didn't work until I enable the experimental Rich Text Editor. Now I can get emojis for :smile: etc, but I still can't autocomplete emojis on :) and similar. An emoji selection UI would make this much more straightforward and the design suggestion above looks great!

lukebarnard1 commented 7 years ago

@lukebarnard1 wonders if we're going to change the current emoji picker to look more like this

MurzNN commented 7 years ago

At now Riot already have popup frame with list of smileys via typing :, but it contains very little items, because items shows with text: http://i.imgur.com/Q3RedkP.png Will be good to show only image without text, and add scroll for view all items. Also will be good to add separate Smiley button for select smiley in bold-italic-quote panel, because not all users knows about : hack.

MurzNN commented 7 years ago

Good implementation of Emoji picker we can see in VK.com (Vkontakte): and Telegram:

MurzNN commented 7 years ago

Here is React implementation of Slack Emoji picker: https://slack.engineering/rebuilding-slacks-emoji-picker-in-react-bfbd8ce6fbfe?gi=37f3b106bb90 but seems it not opensource :( img

MurzNN commented 7 years ago

And here is another React implementations of Emoji picker: https://github.com/tommoor/emojione-picker https://github.com/missive/emoji-mart https://github.com/ealush/emoji-picker https://github.com/conorhastings/react-emoji-react

floviolleau commented 7 years ago

Hi, I like links from @MurzNN.

Can s.o. have time to implement it?

KR

pafcu commented 7 years ago

As a data-point, Mastodon has switched to using emoji-mart

Hoeze commented 6 years ago

Are there any updates on this?

MightyCreak commented 5 years ago

There is a pretty important bug in the latest 1.0.x releases: we don't see which smiley is currently selected any more. So we just need to hit tab until we get the right one.

eMPee584 commented 5 years ago

emoji-mart still seems to be well maintained and thus a good candidate for integration: https://github.com/missive/emoji-mart/graphs/contributors

aleex5 commented 5 years ago

this feature is necessary, it will give more life to the application

MurzNN commented 5 years ago

Riot moved to Emojione, so here Emoji Picker is good react emoji picker integrated with Emojione, and React Emoji Picker V2 is other alternative.

lalomartins commented 5 years ago

@MurzNN you're a little late 😅 Riot just moved away from Emojione

eMPee584 commented 5 years ago

emoji-mart still seems to be well maintained and thus a good candidate for integration:

… Is it not? having the sticker function sit behind that smiley face and no picker still is really somewhat confusing..

juliusv commented 5 years ago

I do have to agree, it's hard to sell a chat app (on the web) to people if it doesn't have an emoji picker. The current smiley face not leading to an emoji keyboard (but to some unwanted sticker store) was confusing for me as well.

Ezwen commented 5 years ago

Quick question: is it planned to also use the fancy new reaction emoji picker for writing emojis in the message composer? Would be really neat :)

turt2live commented 5 years ago

it's been requested a lot, and I don't think anyone is opposed to it. Best to keep the discussion on https://github.com/vector-im/riot-web/issues/9484

Ezwen commented 5 years ago

Thanks for the link! sorry I did not find the other issue with my first search

t3chguy commented 4 years ago

https://github.com/vector-im/riot-web/issues/9484#issuecomment-489096947 sets out the overarching plan

Letterus commented 4 years ago

Just want to push this issue. Current UI/UX is not consistent and confusing. Several of our users reported that.

Hoeze commented 4 years ago

Can we just have something working? It does not need to be pretty, things can always be improved.

This (seemingly simple/essential) functionality is discussed for four (!) years now :laughing:

fti7 commented 4 years ago

With the current speed we can expect something for Christmas :-)

t3chguy commented 4 years ago

Designs are almost ready actually.

nadonomy commented 4 years ago

@t3chguy just to unblock this specific issue, we can lift the icons from the new Composer work in Figma (which still has some validation left to do):

https://www.figma.com/file/WM63nhWpzWUrVhEYgFRUpt/Composer?node-id=8%3A680