-
Notifications
You must be signed in to change notification settings - Fork 2k
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
Consider the icon for the command palette #89578
Comments
Support References This comment is automatically generated. Please do not edit it.
|
Just to give a bit of background about the current decision, when we began working on this feature (p9Jlb4-9CH-p2), we considered using an icon similar to GitHub's to represent the command palette. However, we decided against it, partly because we worried that the icon might not be clearly understood. Currently, we have three solutions for the affordance:
Introducing a new icon would create another discrepancy, but to make things worse, the search icon is a bit problematic when the user is in the Reader, because the search feature uses the same icon and it's pretty close to it. I think it's quite difficult to find a solution that would solve all these problems and inconsistencies. That said, there are two main approaches to move forward:
I've worked on several proposals, including using the GitHub prompt icon and Gutenberg's block-code icon to represent the concept of command, and two variations on the magnifier icon to distinguish it from the regular version. |
I'd totally missed the Gutenberg command palette icon in the sidebar. I guess it probably makes sense to stay consistent then. I also think that the command palette is an advanced feature, given our current focus though, I think there's a question in how much we follow the feedback we've had on the icon - it has been mainly from non-advanced users. |
During a conversation with @danielbachhuber today, he suggested the idea of using a compass to identify the Command Palette. I think it has some advantages over other options: it's more recognizable than the prompt icon, and it symbolizes navigation, direction, and exploration, which are indirectly related to searching. And to include more suggestions, @simison proposed using the ⌘ icon. Its association with the term 'command' and its original meaning (a landmark sign) could work well in our context. However, its strong connection with Apple and the relationship with a key that's not available on all keyboards could be confusing for some users. Figma file with more proposals: 2aegKcEt9nAj7wBQ4yV5n4-fi-2910_6025 |
👍 either the compass or the command prompt icon seems good to me. I think we should make the change and perhaps push GB upstream to change their icon too. |
Ah, that's a good point, @simison, I had forgotten about that association.
Ok. Given that there isn't an option that is clearly superior to the others (at least as far as I know), that there's a desire to have an affordance in the UI that is not the current search icon, and that @danielbachhuber explicitly said that he wants something "nerdy and cool" (p1715085681280819/1715003152.316989-slack-C9EJ7KSGH), I'd say let's go with the prompt icon and see how users (and .org) react. |
I've added a new icon to the Dotcom Design Library called "prompt". I think we’re good to go and we can replace the current icon with this one. |
@javierarce Looks great! |
These changes are now live. |
Looks great! |
The icon for the command palette in the global navigation is a magnifying glass, it looks like this:![Screenshot 2024-04-16 at 14 52 58](https://private-user-images.githubusercontent.com/93301/322870381-0840efe9-4215-41cc-b821-8e2f5f95940d.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQ2NzU5ODQsIm5iZiI6MTcyNDY3NTY4NCwicGF0aCI6Ii85MzMwMS8zMjI4NzAzODEtMDg0MGVmZTktNDIxNS00MWNjLWI4MjEtOGUyZjVmOTU5NDBkLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjYlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODI2VDEyMzQ0NFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTUxM2MzMDYzNTgwYjc0NGQxNjc3NjExNTEwNjdhMjZmYWRkNGVmYzNhMDgyNzBmNWRjOTU4NjkyZWI3YmJlMTEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.7N_y9AXIbdyYoSWYpenzO6LxOV0lmX3_L3sB5ceHOuA)
Feedback from user testing (paYJgx-4Nn-p2) revealed that most users struggled to associate this icon with the 'jump to' menu.
We had some further discussion on whether it's a problem that matters and some ideas to make the command palette icon more relevant for power users. paYJgx-4Nn-p2#comment-4858 One suggestion was to use an developer terminal icon like Github does
![image](https://private-user-images.githubusercontent.com/93301/322872307-19e663a9-a263-4e6d-b474-29844b4e59c6.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MjQ2NzU5ODQsIm5iZiI6MTcyNDY3NTY4NCwicGF0aCI6Ii85MzMwMS8zMjI4NzIzMDctMTllNjYzYTktYTI2My00ZTZkLWI0NzQtMjk4NDRiNGU1OWM2LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA4MjYlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwODI2VDEyMzQ0NFomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWIyM2U0OGYzOWYzZjEwYmY3ZjA4NDFmNjJhYjIxNWFiZTI1ODVmMjBjMjFmYjM5Yzg1YTA5NWY2Nzg3YzI3ZDgmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.FTJ10lwAlQ620rFVuF2tyUrW61QVhaE98g4ikmvpNDY)
Gutenberg don't have a visual way to launch the command palette, just the shortcut icon.
The text was updated successfully, but these errors were encountered: