search

vmware-archive / clarity

Clarity is a scalable, accessible, customizable, open source design system built with web components. Works with any JavaScript framework, built for enterprises, and designed to be inclusive.
http://clarity.design
MIT License
6.43k stars 761 forks source link

Icons volume 14 #2709

Closed lil-kim closed 5 years ago

lil-kim commented 6 years ago
  1. Snowflake
  2. Fish
  3. Fuel - example https://cdn2.iconfinder.com/data/icons/maki/100/fuel-512.png
  4. Basic circuit elements (resistor, capacitor, inductor) - see Oct 22 comment for reference
  5. Squid - see Oct 22 comment for reference
  6. Volume (as in capacity-not sound level) https://icons8.com/icon/1415/volume
  7. (Already done) "Skip to first/last page" for pagination icon set (completed. published to Clarity icon library)
  8. Bell curve (Normal distribution chart) see Oct 25 comment...
  9. Crosshairs, see #2987 for example and details
  10. form kinds (like text input、number input、select、horizontal slider fields)、
  11. table kinds (like general table、tree grid、pivot table) icons
  12. Target (for timeline component)
dorthrithil commented 6 years ago

A fuel icon would be great: https://cdn2.iconfinder.com/data/icons/maki/100/fuel-512.png

amellnik commented 6 years ago
lil-kim commented 6 years ago

@amellnik The basic circuit elements would be fine as icons. It would be really helpful if you would attach a googled image for each so that we are clear on the representation. As for the squid, I'm afraid we can't provide that one as it is not very common/practical and we don't have an icon category for it. Sorry, squid fans! :-(

dorthrithil commented 6 years ago

A volume (capacity, not loundness) icon would be useful: https://icons8.com/icon/1415/volume

jeeyun commented 6 years ago

HI @lil-kim could we add an icon for "skip to first/last page" in the new pagination design? Not sure what would be the appropriate name for this. Screenshot for reference:

screen shot 2018-10-15 at 9 49 54 am
amellnik commented 6 years ago

@lil-kim - The capacitor, resistor and inductor circuit elements here are pretty typical: https://en.wikipedia.org/wiki/Electronic_symbol#/media/File:Circuit_elements.svg

There's also a circuit element symbol for a SQUID, which in retrospect would make way more sense than using an icon of a squid (the animal) in my use case. It looks the screenshot below (from this image) without the red text (and maybe rotated 90 degrees to be consistent) with the others.

image

lil-kim commented 6 years ago

@amellnik Added your SQUID request to the comprehensive list in the first comment.

archerchiu commented 6 years ago

Could you consider the Bell curve (Normal distribution chart)、form kinds (like text input、number input、select、horizontal slider fields)、table kinds (like general table、tree grid、pivot table) icons? Sincerely

colinreedmiller commented 6 years ago

In order to effectively prioritize icon requests moving forward please include the following background for each request:

  1. What is this glyph intended to signify?
  2. What is the specific product / use?
archerchiu commented 5 years ago

Hi, @colinreedmiller We are going to establish dashboard design tool. Many kinds of widgets to be dragged for designer, such as form, table, and chart aspects. Namely, designer is easy to know what kind of widget through icons. Thanks.

lil-kim commented 5 years ago

Updated and compiled list of icons for vol 14 - see first comment.

yaooluu commented 5 years ago

@lil-kim Please also add a "target" icon mentioned as "current step" at: https://github.com/vmware/clarity/issues/1633

lil-kim commented 5 years ago

@Stela-Stamenkova, Adding a "target" icon to the list. This should be the last icon added to this epic. image It will be used in the timeline component. See Yao's comment above. Use the "circle" icon from Clarity library as the base. Thanks.

lil-kim commented 5 years ago

@Stela, I missed adding some icons from the comment on 10/25 from Archerchiu. (now added to consolidated list at the top of this page) Not all may be possible to translate into icons, but please do what you can. Thanks!

stela commented 5 years ago

@stela, I missed adding some icons from the comment on 10/25 from Archerchiu. (now added to consolidated list at the top of this page) Not all may be possible to translate into icons, but please do what you can. Thanks!

@lil-kim @Stela-Stamenkova Wrong "stela" I'm afraid!

lil-kim commented 5 years ago

@stela Thanks so much for letting me know! :-)

Stela-Stamenkova commented 5 years ago

Hello everyone! I am attaching the icons, let me know how they work! Best, Stela Vol.14_expanded.zip

Ergnos commented 5 years ago

@Stela-Stamenkova , the filenames of the Capacitor, Inductor and Resistor are currently mixed up.

Line_Capacitor -> Line_Inductor Line_Inductor-> Line_Resistor Line_Resistor -> Line_Capcitor

Regards.

amellnik commented 5 years ago

@Ergnos is correct. I also think that the resistor and inductor symbols might need an additional zigzag/loop to be recognizable. (See this for example).

Shijir commented 5 years ago

@Ergnos Thanks for your feedback. I have addressed the issue in the PR.

@amellnik thanks for your feedback. I agree with your concern so I will talk to @Stela-Stamenkova and @lil-kim

I am working on the PR right now. You can track it here: https://github.com/vmware/clarity/pull/3099

lil-kim commented 5 years ago

@Shijir, I modified the inductor and resistor icons based on feedback from @Ergnos and @amellnik : inductor-resistor.zip

amellnik commented 5 years ago

@lil-kim Looks good!

github-actions[bot] commented 4 years ago

Hi there 👋, this is an automated message. To help Clarity keep track of discussions, we automatically lock closed issues after 14 days. Please look for another open issue or open a new issue with updated details and reference this one as necessary.