13 ms·
It looks like someone getting good at illustration. Older icons are far better illustrations. However icon design is not just about illustration, it's about cla
by danpalmer 9mo ago
It looks like someone getting good at illustration. Older icons are far better illustrations. However icon design is not just about illustration, it's about clarity and affordances. Icons don't exist in isolation like an illustration, they exist alongside the rest of the UX and other app icons, and being recognisable is important.
All that to say, the sweet pot was likely somewhere in the middle of this timeline. The earliest icons aren't recognisable enough as they're too illustrative. The later icons aren't recognisable enough because they're too basic. The middle are pretty, clear from colour, clear from shape, well branded.
- deleted 9mo ago[deleted]
- christophilus 9mo agoI agree. The middle one seems to be the best combination of clarity and simplicity.
- temporallobe 9mo agoI spent half a year designing and creating 200+ icons for a custom geospatial mapping app. I really enjoyed the work but it was grueling and tedious, especially the design part. Too many people had too many different opinions on which symbols meant what, which styles clearly conveyed ideas without being too detailed, and many other things that kept wasting my time and causing a lot of rework and inconsistencies. It was literally just me doing the work, so I stopped trying to get consensus and took a few weeks to redesign the entire set and even used color science to inform my design decisions. I created the entire set without external input, then presented it. Sure there was some tweaking here and there, but I believe it turned about to be great and no one really complained in the end. The most important part was that end-users were happy. I used Inkscape and developed a set of scripts to automate the build and had everything in a very organized Git repo.
- BTBurke 9mo agoI’d be interested in seeing those if you’re open to sharing.
- temporallobe 9mo agoThis was about 8 years ago and I am not sure I ever retained a local copy of the repo. If I find it, I’ll resurrect it in a public Github repo unless there’s some NDA/IP issue.
- nine_k 9mo ago> no one really complained They were happy that someone finally made a decision, and freed them from the burden of fruitless repeated deliberation.
- bigiain 9mo agoYep. Sometimes it's better to keep everybody away from the bikeshed until it's fully finished and painted.
- heisenbit 9mo agoConsistency sells but is really hard to ensure in time bounded series of narrow discussions with changing participants. But this must not discount the value of the preceding often frustrating search for understanding the requirements and prototyping. Throwing away the prototype while all the lessons are still in the head can yield great design.
- ethbr1 9mo agoIn feedback solicitation situations with multiple stakeholders, it's important to attach cost to suggestions. Consulted without being responsible is always a dangerous offering. Not in the sense of "This is how long that will take me" (because who cares about someone else's time?), but in "Of the 3 things you requested, which 1 is your must-have?" Often this is approximated via design/dev team pushback, but it's easier just to be explicit about it: i.e. everyone gets X change request tokens.
- judahmeek 9mo agoResolving bikeshedding might be LLM's most valuable contribution to an organization
- mschuster91 9mo agoThat's just like hiring McKinsey et al - the true value isn't the advice itself, it's probably been written down by some poor intern working 80 hours a week yet billed to the client as "director" time, the true value of why these consultants still get hired despite their truly abysmal track record is that management can use that "external advice" to cut through red tape and plow over internal resistance. LLMs however... they give part of this power to lower levels as well. After all, what is an LLM other than the condensed knowledge of humanity? (Partially /s)
- card_zero 9mo agoPossibly the half year of annoyance helped inform the weeks of opinionated inspiration.
- chrisweekly 9mo agocan you share the icons? curious to see the finished product
- spiderfarmer 9mo agoThis is one of the many reasons I do my own projects. I do value the opinion of people without knowledge and experience, but I don’t want to feel obligated to make them feel I did what they wanted.
- amelius 9mo agoQuestion: what do you think is a great example of an icon for people/users? I'm asking because to my taste nobody seems to get it right.
- temporallobe 9mo agoI am partial to the relevant icons in FontAwesome and these days the Bootstrap icons. I think the silhouette of a generic, androgynous portrait universally gets the idea across nicely.
- qznc 9mo agoDo you think it would have worked out if you skipped the grueling and tedious discussions entirely?
- temporallobe 9mo agoI definitely needed the initial input from the stakeholders as to what they wanted and why, but it turned into pointless bickering about colors and many disagreements about symbol meanings - for example should a dropped pin have a shadow? Should it be pin or a baloon-like thingy? Should it lean left or right? How does one represent a “duty station” when there is no previous iconography or other kind of standard around this? It also led to a lot of design-by-committee meetings where well-intentioned people suggested good ideas but things were always left at some ambiguous action item that never had any follow through. This took months and I kept re-rendering the icon set (which were all multi-layer SVGs) and then pasting the PNG renderings into a Word doc because that’s how they wanted to review them. What this did teach me was to create very efficient workflows. I had all the Inkscape keystrokes memorized and found out they had an API that allowed me to create some level of automation (things like batch conversations IIRC). I kept certain symbols as separate base/template images so I could quickly swap things in and out. I had separate color files with swatches of various color themes, all in hexadecimal. Since I was and am fundamentally a software engineer, I used those engineering processes and principles to make it more like a typical software project than just a collection of images.
- HPsquared 9mo agoFunnily enough that's (stereotypically at least) the Apple way of product design.
- xattt 9mo agoQueue adenoidal voice: Apple has the benefit of massive cash-flow and, as a result, hiring many competent designers who draw and create to a specification. The specification could be created by another team of senior designers that are paid handsomely to deal with the gruelling task of defining a corporate identity. This is similar to how major feature cartoons, which typically require variations of an image to be drawn over and over again, are typically animated by more than one person. I.e. Apple has the money. They can do better than having one extremely hand-cramped illustrator crank out silhouette-style icons.
- alfiedotwtf 9mo ago> Apple has the money. they can do better But they haven’t. The latest Mac OS is atrocious. Glass? Are they literally trying to mimic 2006’s Compiz?
- xattt 9mo agoI think there are designers that think they are hot shit that don’t know graphical history, and go by “feel” for their design.
- Gigachad 9mo agoNone of the Pages icons are recognisable because almost no one uses Pages. The word icon is just a blue W which is not any more illustrative than an orange pen.
- danpalmer 9mo agoDocument, pen, orange, and name "Pages" is pretty excellent all round for recognisability in my opinion. Over the years Word/Powerpoint/Excel have done similar things, they have their own colour, their own name/letter, and usually have had a descriptive graphic in the icon too, indicating a document, grid, or slide.
- shagie 9mo agoOne of my favorite series is Nathan Lowell's Solar Clipper... in In Ashes Born, there's an bit about creating a logo for the company... He pointed to the far end of his studio. Two tiny patches of white—which were probably actually gray—lay in a single pool of light. One was a smudge of red and the other was a spiral of red. “Which one of those is your logo?” he asked. “Neither,” Pip said. “The smudge,” I said understanding where the kid was taking us. “Right,” he said. “The smudge.” “What?” Pip asked. The kid held up the paper from the workbench. “Look, this is nice and all, but it’s too fussy. If you look at anybody else’s logo, it’s not fussy. It’s iconic. A crown with wings. A C in a circle. That’s yours,” he said to Pip. “All of them are simple shapes combined to form an unmistakable pattern.” My own choice for a gavatar is similar - https://github.com/shagie https://github.com/shagie (it's from a photo I took). While by itself its a neat bit, its also something that is easily recognizable as "that's Shagie's" when its projected on a screen on the other side of the room or if it's someone's full screen share and everyone's icons are shrunk down to smaller blurs - mine remains clearly distinct. The goal of an icon is to be able to identify it quickly without having to read the associated text. The inkwell and the two with the paper are artistic - but they aren't things that stand out quickly when you're trying to find them in the launchpad or on the sidebar. Pages is orange. Numbers is green. iTunes is red. Keynote is blue. For Microsoft, Word is blue, Excel is green, and Powerpoint is orange (and Outlook has an envelope like shape). The letter reinforces the choice, but that's more of a hint and reinforcement. The shape and color is the important thing for quickly finding what you're looking for.
- jan_Sate 9mo agoAnyone else doesn't like modern minimalist icon design? It looks boring.
- LtWorf 9mo agoI still love the KDE Oxygen icon theme.
- rk06 9mo agoicons should prioritize usability first,and design, intersting afterwards. if your users need billboards, then your job is to make great bill boards
- WWLink 9mo agoThe current icons really aren't that good. Looking at apple specifically: The facetime and messages icons are almost completely indistinguishable. Get angry and say I'm blind, but so is a lot of the userbase - like legitimately, legally blind people. The camera icon on iOS is just a fucking camera lens with a grey background. No context. The calculator one is actually pretty good. The photos one is also bullshit lol.
- what 9mo agoFaceTime is a video camera, messages is a speech bubble. They look nothing alike except they share the same colors?
- dijit 9mo agothey share so much visual language that I always do a double-take when I am about to click on MacOS. You’re right that in isolation they are visually distinguished, but our eyes don’t see colour uniformly, and these icons do not exist in isolation. I guess frosted white on green is not a good combination for quickly discerning shape.
- wtetzner 9mo agoSure, but it's not clear they're unrelated. Maybe interesting is necessary (but not sufficient) for usability? Also, the newer icons don't really indicate a word processing application. If anything, they're look like they might be for a drawing program. So regardless of interesting/abstract/whatever, it seems like a poor icon choice.
- pembrook 9mo agoExactly. Anyone who thinks an intricate illustration of a quill and ink communicates to the user "Hey this app is our Microsoft Word"...is not thinking about what function an icon is supposed to serve. It's like comparing a road sign to an 18th century painting and saying "LOOK HOW FAR WE'VE FALLEN!" These are not serious people.
- ImprobableTruth 9mo agoThe quill and ink at least communicates that it's about writing. The new one is so abstract that when I first looked at it I had no idea what I was even looking at, it certainly doesn't communicate "this is like word" to me. Without comparison to the previous icon, how many people do you think would understand that the bottom line is intended to be a stroke drawn by the pen?
- pembrook 9mo agoI think you might be post-hoc rationalizing an emotional feeling, as clearly this meme is emotionally triggering to everyones nostalgia/pessimism nerve (hence why it went viral). I'm 100% positive more people would guess the far left icon is a text editor compared to the far right icon. Not that I like the left icon aesthetically. Both are pretty weak icons.
- Dylan16807 9mo agoLeftmost is probably a pen, rightmost is definitely a pen and specifically a fountain pen. I've never seen these icons before, and I'm trying to be the fairest I can, and I think rightmost wins at evoking "text editor". But the one exactly in the center wins by a mile. Pen on lined paper, hard to do better.
- spookie 9mo agoSame thought. The one on the left just conveys "notes" to me. Middle actually seems to be about a more "well put together" document. A fountain pen by itself doesn't necessarily mean documents to me, but signing them. As you, never seen these icons in my entire life.
- fvgvkujdfbllo 9mo agoI prefer illustrations and old school icons. Every icon was unique and easily recognizable. Now all icons look alike, and it takes longer to recognize.
- kyleee 9mo agoI am basically icon blind thanks to a couple decades of icon churn
- danpalmer 9mo agoI think this spectrum shows the issues with that though. Take the last one, the pen pot. You truly have to _learn_ what that means. Pen pots aren't a thing that most people are familiar with (I've never used one, I don't think my parents generation did mostly either), and there's little explanation of what it is. Move up just one previous, and you've got a good looking illustration still, the pen and paper, but now a) everyone knows what a pen and paper look like, b) it literally says the name of the app, and c) the yellow colour scheme distinguishes it well when scanning many icons. It's clearly more accessible to new users, existing users, young and old users, and in terms of illustration quality, seems pretty subjective as to whether it's better or worse than the last one.
- LtWorf 9mo agoThe new one is just some lines over a background, and you'll have to pick it in a sea of other icons that are similarly 2-3 lines over the same background.
- JumpCrisscross 9mo ago> Pen pots aren't a thing that most people are familiar with Personally, no. Cognitively? We've been seeing quills and ink in children's stories for centuries. One doesn't have to have used a bubble level to get the analogy in the iOS Level app. > pen and paper, but now a) everyone knows what a pen and paper look like A quill and ink are conventionally portrayed in relation to writing. A pen and paper could refer to e.g. sketching. I'm obviously nitpicking. But I reject the notion that we have to oversimplify to the degree you're suggesting. > it literally says the name of the app The OS does this almost everywhere apps exist. Putting the name in the logo is superfluous.
- WWLink 9mo agoI agree with your conclusion that the sweet spot is in the middle, because I could easily explain to my mom "click the icon that has a pen and paper" and it would be very obvious. The current icon is completely ambiguous crap.
- hshdhdhj4444 9mo agoHow in the world are the newer icons more clear? They are hard to distinguish from each other, removing the main goal of an icon…to make it easy and quick to uniquely identify an app.
- QuantumNomad_ 9mo agoI use macOS and have done so for several years. But I had to look up this app icon to know what app it was. It’s the Pages app, which I don’t use and don’t keep in my dock. Looking at only the leftmost icon, I was thinking it might be the Notes app or the Freeform app, both of which might conceivably also be represented by what to me looks like an Apple Pencil for iPad. Looking at the reminder of the icons, I recognize that it’s not the Notes app because although I no longer use that one I have in the past so I remember that it has looked like a notepad with some lines and some yellow on it. But the leftmost one might as well have been a newer version of Notes than the one I last used.
- kcrwfrd_ 9mo agoTbh I like the far left way more than the rest. It is simple, clear, and distinctive. Dead middle is decent too.
- wtetzner 9mo agoIs it clear though? It looks like an icon for a drawing app, not a word processor.
- dd8601fn 9mo agoI actually had to try to zoom in on the older, “ideal” example shown, just to see what it is. Yes, my eyes aren’t great anymore. Yes, I’m on my phone looking at a social media post. But I feel like the speed and clarity of the newer ones was (accidentally) on display here.
- trueismywork 9mo agoLatest icons are also horrible. Magnifying glass for "open containing directory".
- ben_w 9mo agoThe new one, orange pen on black background, to me looks like a blacksmith hammer or a welding torch. I would not associate it with writing at all. 2, 3, and 4 (from the left) look like they're for a notes app rather than DTP. 5 and 6 tell me what the app is for. 7 looks like an art app, not writing. I favour skeumorphism, but to work that needs to use metaphors people are familiar with, and pots of ink are something I know only from art stores.
- seviu 9mo agoThe fact that since Tahoe everything is a squircle kills me. I can’t visually find my apps anymore. It takes me several seconds to find an existing opened app when I hit cmd tab, it has been months already, I use my Mac for work, I know this stuff. It’s not just the new design but also something else, like if part of my Mac lost its soul.
- ljm 9mo agoOlder versions of MacOS had an elegance to them. It’s lost some of that over the years. The overall trend towards minimalism has ironed out much of what made it unique and it hasn’t always succeeded in improving UX. Even Liquid Glass and the ability to tint the icons (to make them even more indistinguishable) depends on the detail being kept to a minimum.
- rpdillon 9mo agoYeah, what's amazing to me is that they play with the icon so much in an environment where they expect people to find the application by its icon. I always set up my machines so that I use a launcher that allows me to type the name of the program and then press Enter because I hate searching through grids of icons to find things, especially when the icons change over time. But when the company itself is expecting people to find things visually and then constantly changes the visual landscape, it just seems egregious.
- iamcalledrob 9mo agoDesigner here: there's a trade-off between visual harmony (all icons look the same) and ease of differentiation. A standardized container adds regularity to irregular shapes. Recently, Apple has been heavily opting for visual harmony, so their icons look consistent when seen as a set. Google too. It's an industry trend that is fairly annoying. Similar "let's remove the differentiation" decision made for menu icons in macOS: https://tonsky.me/blog/tahoe-icons/ https://tonsky.me/blog/tahoe-icons/
- everyone 9mo agoBut is it simply trading actual concrete functionality and usability in exchange for the concept of "superficially looks nicer to certain people in a marketing image" ?
- rpdillon 9mo agoYep, quite literally form-over-function.
- iamcalledrob 9mo agoI'd argue it's trading legibility for aesthetics. My personal take is that aesthetics play an important function, but legibility is more important. Good design will achieve both.
- reactordev 9mo agoA great example of the pains it takes to achieve both: https://admindagency.com/road-sign-design/ https://admindagency.com/road-sign-design/ Road sign design had to achieve both and more and yet they still managed to pull it off.
- curt15 9mo ago>A standardized container adds regularity to irregular shapes. Does putting differently shaped icons in a standardized container make them harder to distinguish? When I look at an object its boundaries register first. If all icons are enclosed in the same square container, then they all look like squares at first glance.
- raincole 9mo ago> it's about clarity and affordances The ink pot one tells me it's clearly an Apple's app. Though I might not know what it is, I know it's likely Apple's.[0] The new ones can be a random app that shows up in AppStore when you search 'note taking' or 'todo list' or whatever. I'm also strongly against the idea that an icon needs to directly tell you the functionality of the app. Photoshop's icon is literally 'PS.' Twitter is (was) a bird. No one thinks they lack clarity. [0]: of course in this AI era if the retro detailed illustration comes back, everyone will just generate their icons in that style... it's a battle you can't win.
- nedt 9mo agoOS X had a lot of icons that were detailed illustrations but you‘d only see it when you zoom in. Yet they also worked as small icons. You can have both and Apple did. The textedit icon is a great example.
- flqn 9mo agoNitpick: icons are about signifiers, not affordances. A button affords being pressed, an icon on the button signifies what pressing it will do.
- arendtio 9mo agoI think it depends on size. If the icon is very small, I like the simple ones. If the icon is large, I like the detailed ones. Optimally, you can have an icon with more detailed versions when displayed larger, but it remains the same icon.
- simjnd 9mo ago> The earliest icons aren't recognisable enough as they're too illustrative. What? The fact that they have a unique silhouette alone make them so much more recognizable than all the other versions.