Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

🚀 Keyboard shortcut, emoji insertation and a mini-picker #2

Closed
dmxt opened this issue Mar 29, 2019 · 3 comments
Closed

🚀 Keyboard shortcut, emoji insertation and a mini-picker #2

dmxt opened this issue Mar 29, 2019 · 3 comments

Comments

@dmxt
Copy link

dmxt commented Mar 29, 2019

I'm a UI/UX designer and some of suggestions below are improvised from my experience.

Windows 8 and Linux users background

We don't have a system-wide shortcut to open emoji menu, so we rely on browser extensions to insert an emoji. We also installed a custom emoji font "Twemoji" to replace boxes or black-white polyfills: https://github.com/eosrei/twemoji-color-font

Note: Twemoji is an active development forked from abandoned EmojiOne Color project.

Build a keyboard shortcut

Feature request: A pre-built keyboard shortcut to open an emoji extension interface.

This should be a quick feature addition, and I would love it to see it built.

Pasting an emoji from a picker and extension

I'm aware of the : shortcut, but it doesn't function the same as an actual extension interface. The shortcode isn't converted to emoji inside the textfield.

Fix request: Instead of pasting a shortcode, paste an actual emoji from a : mini-picker interface.

With this change, an emoji should show up in the text field instead of a :shortcode:, which would be great for most text-editor webapp... except Notion.

Fix ideas and suggestions for special expectation cases

Notion - an emoji-heavy text editor, on this specific webapp, the : shortcut does not pop up any picker at all, it just input colons like normal.

With keyboard shortcut feature: If a keyboard shortcut to open an emoji picker doesn't defocus a textfield, then it will open afunctionality to paste an emoji in current text input when emoji is selected.

Without keyboard shortcut feature: If a keyboard shortcut to open an emoji picker still defocus a textfield, then try to behave similarly to a Chrome extension Chromoji as shown on image:
Chromoji text field selected

Note: This extension Chromoji does not have keyboard shortcut and the interface is opened by clicking an icon in extension bar.

When an extension icon is clicked, it seems like this extension "remembers" the current input (refer to the blue glow around the input field in an image) and opens a possibility to paste an emoji on the input.


Future feature requests

Later down in the line, it would be very useful to have these features developed:

##An option to change a keyboard shortcut
Feature request: An option to allow users to change a keyboard shortcut to open.

It will allow the extension support longevity in case Firefox changed their shortcut that happens to override the extension. It occurred to one Emoji picker extension, rendering it useless because their pre-built shortcut got overridded by a Firefox update for some dev tool shortcut.

##Focus on the search field
Feature request: Make a search as a default focused field upon opening the emoji picker menu.

So users can type down in the search right away after pressing a keyboard shortcut or clicking on an extension icon.

##Emoji pop-up picker menu
Feature request: Build a "popup interface" which pops up above the current text field input, triggered by a keyboard shortcut, featuring:

  • Search emoji as a default focused field
  • Close the pop-up after the emoji selection (and auto-paste)
  • Popup interface design inspirations:
    Twitter popup
    😃
@dmxt dmxt changed the title (Features and behavior change requests) Keyboard shortcut, emoji insertation and a picker 🚀 Keyboard shortcut, emoji insertation and a mini-picker Mar 29, 2019
@rugk
Copy link
Owner

rugk commented Mar 29, 2019

Wow, thanks. 👍 I am really impressed and these are well-written and good suggestions. (especially as this add-on is just a few days old… 👶)

Please note (as you probably noticed) that the current version of the add-on is a pre-release and even stable. It's a first prototype/MVP and can (& hopefully will) be improved. (and some ideas you said, are also ones I already had in mind. 😃)


About the specific things, please do open a new issue for each separate suggestion. (You can link back to this issue. 😃)
Also for all future feature requests please. Future is relative, and I prefer to sort and prioritize these with milestones, labels, upvotes etc. then later. Any request can go into a new issue. 😃

Also I did not quite got the use case with Notion.
Also the shortcode story is confusing, as it totally depends on the website you use, whether : is supported and what they display there… 😄

Also some other specific things:

  • auto-focus is already implemented in the master version (current source code)
  • the hot key is really easy to implement and a "good first issue", so if you want to contribute something, you can tackle it now directly… 😄 (Please do open a new issue anyway for tracking purposes.)

About your background: Yes, I think this is actually the main user base for this add-on.
While actually on Linux it totally depends on your window system. GNOME e.g. recently added emoji picker features + keyboard.
However, I personally also use this add-on, because it is much more convenient than the system alternatives, and

And BTW, great I know someone, who I can ask for UX questions. Ehm… if you did not mind, maybe have a look at rugk/offline-qr-code#42. 😃

As for https://github.com/eosrei/twemoji-color-font, okay nice. But note this add-on already includes the option to use the emojis from Twitter 🐦.

@rugk
Copy link
Owner

rugk commented Apr 3, 2019

So, @dmxt, could you possibly create a new issue for each of your suggestions?

@rugk
Copy link
Owner

rugk commented Apr 7, 2019

Closing due to inactivity…

I'll open some issued for some mentioned ideas.

@rugk rugk closed this as completed Apr 7, 2019
rugk pushed a commit that referenced this issue Nov 8, 2020
rugk pushed a commit that referenced this issue Aug 5, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants