terminal icon indicating copy to clipboard operation
terminal copied to clipboard

New icons for UI elements

Open cinnamon-msft opened this issue 4 years ago • 15 comments

Description of the new feature/enhancement

We need some new iconography for some of our UI elements, specifically the command palette and settings UI. Below are the requested icons:

Command / Title Icon proposal
Launch (SUI) Rocket ship
Split horizontally Window with horizontal pane split
Split vertically Window with vertical pane split

Proposed technical implementation details (optional)

cinnamon-msft avatar Jul 10 '20 21:07 cinnamon-msft

  • Placeholder icon for a profile that has no icon.

DHowett avatar Jul 10 '20 23:07 DHowett

  • Placeholder icon for a profile that has no icon.

Terminal icon maybe?

cinnamon-msft avatar Jul 10 '20 23:07 cinnamon-msft

I'm thinking something more wirefeame and line-art like the ones in Segoe. I don't want to genericize our brand!

DHowett avatar Jul 10 '20 23:07 DHowett

I'm thinking something more wirefeame and line-art like the ones in Segoe. I don't want to genericize our brand!

Fluent Icons should be the grounding - rather than Segoe MDL2 Icons

mdtauk avatar Jul 11 '20 01:07 mdtauk

As far as I have seen, Fluent icons are not used in subtle pictographic representations for settings UIs and other ephemeral UI. Monochrome icons are still the framework default inside applications.

DHowett avatar Jul 11 '20 04:07 DHowett

As far as I have seen, Fluent icons are not used in subtle pictographic representations for settings UIs and other ephemeral UI. Monochrome icons are still the framework default inside applications.

I think I was not clear enough - There are the Fluent brand/app logo icons, but there seems to be a "replacement" for the MDL2 Icons...

Fluent UI Icons, as can be seen in the Repo https://github.com/microsoft/fluentui-system-icons and as mentioned in this Medium post https://medium.com/microsoft-design/developing-an-open-source-icon-system-at-microsoft-b1796315df9f

mdtauk avatar Jul 11 '20 04:07 mdtauk

I see, I misunderstood. Sorry, and thanks!

DHowett avatar Jul 11 '20 04:07 DHowett

Rocket

There is a Rocket Ship icon there, but nothing suitable for Horizontal and Vertical splits, so perhaps use the MDL2 icons for those until newer icons are available...

image image image

mdtauk avatar Jul 11 '20 06:07 mdtauk

what about this one for horizontal split: didn't found an equivalent for vertical split though

LuanVSO avatar Jul 12 '20 18:07 LuanVSO

what about this one for horizontal split: didn't found an equivalent for vertical split though

It looks a little complicated, but it could work - and you could rotate it for the Vertical Split

image

Here is a quick idea, using the Rocket from the Fluent UI Set

mdtauk avatar Jul 12 '20 20:07 mdtauk

I don't think any of these are relevant to the ones mentioned, but I came across the icons that Edge uses: Edge Icons Placing here for general inspiration 😊

carlos-zamora avatar Jul 16 '20 16:07 carlos-zamora

@carlos-zamora Edge (Dev channel) has new Fluent icons:

Fluent Icons in Edge Settings

ghost avatar Nov 25 '20 05:11 ghost

I think we should also replace these icons:

Current icons in tab drop down

with these

  • Settings icon Fluent settings icon

  • Feedback icon Fluent feedback icon

  • About icon Fluent about icon

Suggestions? @cinnamon-msft @carlos-zamora @DHowett @mdtauk

ghost avatar Dec 01 '20 03:12 ghost

When icons are made available for general use in Windows that comply with the modern design guidelines, we will use them. Until then, we will not.

DHowett avatar Dec 01 '20 03:12 DHowett

Newer versions of Windows are now using Segoe Fluent Icons

mdtauk avatar Jun 11 '21 22:06 mdtauk

@PankajBhojwani This was the thread for "add more action icons", but apparently I didn't leave notes. The best I could find was: https://github.com/microsoft/terminal/commit/40bdbadf96b8520e95eb7959fa67269342fd6074

zadjii-msft avatar Jun 04 '24 21:06 zadjii-msft