[HN Gopher] System UIcons - icons designed for products, no attr...
___________________________________________________________________
System UIcons - icons designed for products, no attribution
Author : nabeards
Score : 263 points
Date : 2020-08-03 14:01 UTC (8 hours ago)
(HTM) web link (systemuicons.com)
(TXT) w3m dump (systemuicons.com)
| ignoramous wrote:
| I've used https://ikonate.com/, and this service looks pretty
| similar and of equal quality if not better.
|
| > _Use how you want, without attribution_
|
| This license reminded me of Sam Hocevar's [0] _do whatever the
| fuck you want_ license [1].
|
| [0] Probably one of the first to advocate DNS based ad-blocking
| way back in _2002_ :
| http://sam.zoy.org/writings/internet/doubleclick.html
|
| [1] https://en.wikipedia.org/wiki/WTFPL
| Akcium wrote:
| Looks pretty neat
|
| Though I'm always afraid of using icon sets (especially for a big
| product) because if I couldn't find an icon I need then sometimes
| it's not that easy to find this icon from another source with
| similar styling
| Andrew_nenakhov wrote:
| I use materialdesignicons.com
|
| If I don't have a necessary icon, I just draw one, and
| contribute it to them.
|
| The only problem is that Google lately seems to have abandoned
| nice simple material icons in favour of rather ugly outlined
| icons. Their current design with this fat new font is way worse
| than it was when Material Design was introduced in Android 5.0
| bradstewart wrote:
| So what do you do, design every icon you need yourself?
| Akcium wrote:
| I use noun project or flaticon. Though in order to get full
| advantage you got to pay. So yeah, I'm actually looking
| through tons of icons trying to find some with similar
| styling
| colinjoy wrote:
| you could always bribe the author, I hear he's a nice guy :)
|
| worst case you might end up paying some other designer to
| supply the icon you need in the desired style. shouldn't break
| the bank, "especially for a big product".
| grishka wrote:
| Some of them are great, but some of them aren't aligned with the
| pixel grid and thus look terrible.
| jyrkesh wrote:
| Icons look pretty good, always grateful for free stuff like this.
|
| Minor side: the first thing I typed into the filter box was
| "save" because I wanted to see how the designer thought about the
| whole "floppy disk == save" problem in a greenfield icon set. I
| thought it was even more remarkable (or just notable, I guess)
| that there's no Save icon at all, which really speaks to where
| the world is at around cloud-based web apps.
|
| Why require someone to click Save at all, right?
| allenu wrote:
| This is all true, but there's also no cloud or sync icon. (I
| suppose those only matter for native apps.)
| rootusrootus wrote:
| > Why require someone to click Save at all, right?
|
| It's like the 'close door' button on an elevator. Some people
| just want to feel like they are doing something.
| jeffhuys wrote:
| The elevators I encounter daily have a working close button,
| are there ones that don't work?
| bussierem wrote:
| Many elevators have placebo ones. It might behoove you to
| test it out sometime - is the button actually working
| immediately or is it taking time after pressing (or
| multipressing) the button? Many elevators ignore the button
| and close when they want but people still think/feel like
| they were the cause.
| dragonwriter wrote:
| > Many elevators have placebo ones
|
| As I understand, basically _no_ elevators have placebo
| close door buttons, but some have ones that only function
| when the elevator has been placed in manual operation
| mode, which requires a special key and is usually only
| done for service, emergency operations, and other special
| circumstances, and in which mode doors do not close
| automatically.
| marshmellman wrote:
| Yes, I believe man are placebo buttons.
|
| https://en.wikipedia.org/wiki/Placebo_button
| crooked-v wrote:
| > Why require someone to click Save at all, right?
|
| Because you're making many changes to a large form and a
| partial update could result in someone else using bad data.
| PrimeDirective wrote:
| It was a rhetorical question
| com2kid wrote:
| > Why require someone to click Save at all, right?
|
| Sometimes saving is a high latency operation.
|
| Sometimes you don't want to show others data as it is being
| edited, think product data for an online story. Heck the
| "reply" button beneath the text box I'm typing into right now
| is a form of "save".
|
| Paradigms matter! Saving was necessary for all disk IO for a
| long time due to technology limitations, but even now days it
| is still the appropriate paradigm for certain circumstances.
| derefr wrote:
| > Sometimes you don't want to show others data as it is being
| edited, think product data for an online story.
|
| In modern CMS workflows (used by e.g. newspapers), the
| software will auto-save _draft versions_ ; while you then
| explicitly _publish_ particular versions (or, more likely,
| submit particular versions for the next stage of the
| pipeline, e.g. editing) by changing your latest version 's
| _state_ in a drop-down.
|
| This process really has no analogy with _saving_ per se. It
| 's more like tagging a commit.
| divbzero wrote:
| I wonder how many HNers have never used a floppy disk.
| bromuro wrote:
| As i see it, modern OSs are trying to remove the idea of
| "saving", which confuses most of non techies and it is actually
| obsolete most of the time.
|
| I still Ctrl+S automatically though:(
| bynormous wrote:
| Thanks, I love me some icons. Looks like it could work well
| stylistically along side those also using Github's recently
| redesigned octicons (https://primer.style/octicons)
| teddyh wrote:
| I would prefer more usage of ISO 9995-7 symbols. They might be
| equally inscrutable, but at least they are an international
| standard.
| duskwuff wrote:
| As far as I'm aware, ISO 9995-7 only specifies symbols which
| would be used on or in relation to a keyboard -- glyphs
| representing functions like Shift, Control, Escape, Scroll
| Lock, etc. Useful if you're trying to describe keyboard
| shortcuts, useless if you're trying to describe a more concrete
| operation like "zoom in", "add a comment", or "delete this".
| falcolas wrote:
| And in unicode, to boot. Though, I'd calls them slightly less
| scrutable, as it were, than the ones presented here. Slightly.
| rambojazz wrote:
| What's the license? Are these in the public domain? And are the
| source files somewhere?
| edoceo wrote:
| Bottom of the page says:
|
| ""Use how you want, without attribution""
|
| And they are SVG, the display is the source.
| [deleted]
| mholt wrote:
| Please though, if you ever use these (or any icons, frankly),
| PLEASE accompany the icons with text so my aging parents -- and
| heck, me too -- know what they mean.
|
| All too often I am helping my family members navigate UIs that
| are "clean" yes (plenty of whitespace! too much) but with icons
| that hide everything and don't mean anything.
|
| "Oh, to send it to your daughter? Click the 3 lines in the top
| right corner, then click the two lines joined by a circle. Er,
| the one that looks like a chart. Yeah, that means 'share'
| apparently. You just have to know that."
|
| I kind of miss the days when software didn't change so much and
| came with instruction manuals.
| crazygringo wrote:
| I mean, that's honestly really hard sometimes.
|
| On mobile you very often simply don't have the space for text.
|
| And if you say "well just make it a scrollable area for all the
| options" let me tell you, many people will never realize there
| are any further options to be scrolled to, especially if your
| phone's height randomly happens to make it so that the viewport
| area terminates between lines rather than in the middle of a
| line.
|
| And just in case you say "well then you shouldn't have that
| many options, simple is better", you're probably wrong. The
| functionality is probably there because it's necessary for
| certain users.
|
| I agree it's a little annoying to have to learn what the icons
| mean. But they're also awfully standardized at this point.
| There are a couple different common versions of menu and share
| and link, and occasionally the context doesn't clarify among
| search/find/zoom or back/undo... but otherwise it's pretty
| good. A gear icon always means settings, a person icon always
| means user/account, etc.
|
| For real -- every computing environment has common conventions
| you just have to learn, whether Ctrl+Z/X/C/V, or pinch-to-zoom,
| or what the Apple logo is for in your menu. Icons aren't
| particularly worse here.
| karmakaze wrote:
| Those 'phone' icons are the most generic things. Maybe useful
| to distinguish an iPhone vs iPhone X/11. If I was expecting
| anything other than a phone there's a 50:50 chance I could
| believe it was something else.
| com2kid wrote:
| They are a bit confusing since now days the microphone tends
| to be on the bottom side of the phone and there is a notch of
| some type on the top.
|
| My first thought was that the phone icon was upside down,
| camera notch goes on the top!
| vezycash wrote:
| Even if there are no text, add tooltips.
|
| The crazy part is that apps without descriptions and tooltips
| do not include help files.
|
| The worst offenders are electron apps from devs who use Macs
| exclusively.
| spankalee wrote:
| A clever way that the Material Design icon font works is to
| define ligatures for all the icon names, so the text in the
| document is default readable by a screen reader.
|
| This only helps when the icon is used for something relevant to
| its default name. I'm not sure how you opt-into a more
| descriptive name because some alt-text on the containing
| elements, ie <mwc-icon-button> has a label attribute for this.
| henrikeh wrote:
| That is clever for sure, but the comment replied to referred
| to not understanding the symbols, despite being able to see
| them.
| benrbray wrote:
| The symbols are pretty standardized these days. I am always
| perplexed on the rare occasion I encounter a physical radio,
| but I wouldn't ask them to waste space by adding text to the
| buttons! On the web, hover text is probably good enough.
| alxlaz wrote:
| For the love of everything that is holy, if in your design
| the icons for "Undo" and "Jump Backwards" are practically
| identical -- as in this font, where only the outline of the
| arrows differs -- , please, _please_ "waste space" by adding
| text to the buttons.
|
| Don't make people discover which one's "undo" and which one's
| "discard the current screen" by trying the buttons out.
| That's not a friendly interface. An interface can be friendly
| without looking like a five year-old's doodle. A wall of text
| is intimidating and unfriendly, sure, but nobody older than
| eight is intimidated by having to read six or seven words.
| benrbray wrote:
| Fair enough! I didn't look closely at this icon set, and
| definitely agree that we should strive for high-clarity
| icons if they're the only signal about what a button does.
| falcolas wrote:
| To abuse a different saying, "Space wasted for clarity is not
| wasted space."
|
| At least make it configurable.
| _Microft wrote:
| _I don 't see three lines but there are three dots in the top
| right corner..._
|
| Yes, text labels please or at least tooltips if on a desktop
| platform.
|
| Here is an example for icons that are saved by their labels:
| the Windows 10 Mail app has a menu with _two_ magnifying glass
| icons. One with the handle to the bottom left symbolizes
| search, one with the handle to the bottom right is for zooming.
| Now imagine that these would not have their accompanying text
| labels. ><
| tinus_hn wrote:
| If it's a desktop, proper ui is a menu bar that has all the
| actions listed.
|
| On touch platforms you're out of luck though because those
| haven't had 30 years to settle down yet.
| eplanit wrote:
| It seems like when "UI" became "UX" is when that kind of design
| arrogance started to be more common.
| JimDabell wrote:
| This isn't new at all; it has been commonplace for decades.
| People have been complaining about this since at least 1998,
| when the term "mystery meat navigation" was coined:
|
| https://en.wikipedia.org/wiki/Mystery_meat_navigation
| eyelidlessness wrote:
| UI never "became" UX, they are different but related with
| overlapping concerns. Typically a person doing User Interface
| work should have User eXperience considerations in mind. This
| is not a thing that changed, it's always been the case (even
| if there wasn't a name for it or it wasn't in common usage).
| puranjay wrote:
| I remember those dark days when everyone was using a different
| icon for "share" and you never really knew what icon did what.
| The icons even changed across Android/iOS versions, and there
| was Microsoft in the corner tooting its own horn on Windows
| Phone.
|
| I'm hardly tech illiterate, but the way apps use icons these
| days makes me almost go into "those darn kids" mode.
| ChrisMarshallNY wrote:
| That's pretty cool! Thanks!
| jkoberg wrote:
| Tiny inscrutable icons are a terrible design fad.
|
| The solution isn't "yet another free icon collection"
| _Microft wrote:
| These do not have to be tiny as they are available as SVGs.
| richardwhiuk wrote:
| Just because a logo is a vector art doesn't mean you can just
| naively scale it up.
| Wistar wrote:
| Yes. Line art can be tough to scale properly.
| eyelidlessness wrote:
| I don't know if this icon set provides this, but there's no
| reason SVG can't provide different levels of detail for
| different scaling factors.
| _Microft wrote:
| I'm aware, that's why I checked a few to make sure these
| actually scale well.
| richardwhiuk wrote:
| Normally when you make a logo bigger, you'll increase the
| level of detail, and tweak line widths.
| myself248 wrote:
| Obligatory:
| https://www.youtube.com/watch?v=5AxwaszFbDw#t=17s
|
| (aside: These guys sound like Deep #800080 don't they?)
| suby wrote:
| Maybe it's just my particular setup, but these icons look blurry
| to me, especially when you mouse over them. It looks as if there
| is no antialiasing. I'm on Ubuntu with Firefox for whatever it's
| worth.
|
| Other than that they look like nice icons and this is a nice
| effort.
| asutekku wrote:
| It's your setup, those are svg icons so there should be no blur
| on any display.
___________________________________________________________________
(page generated 2020-08-03 23:00 UTC)