Redesigning the Save Symbol

http://branch.com/b/redesigning-the-save-symbol-let-s-do-this

by stevewilhelm • 13 years ago

48 65 13 years ago

fusiongyro• 13 years ago

I think this is something that should be done, but I sense that fragmented circles are more of a "flat" reaction to iconography of obsolete technology. But obsolete technology generally makes for good, intuitive icons. I don't think the up and down arrows are especially good at conveying things either, especially since they'll probably be paired with other up and down icons that mean other things (like disclose menus, scroll, etc). Maybe the new generation has never seen a floppy, but they also haven't seen a magnifying glass, an hourglass, or a rotary phone, yet they've managed to learn them as part of the visual vocabulary of computing.

I'm not a designer, but I think most of the ideas on display here are fashion-forward dead ends.

zwegner• 13 years ago

> I'm not a designer, but I think most of the ideas on display here are fashion-forward dead ends.

This... It seems like these are "design for the sake of design", and doesn't take into account that the vast majority of users really don't care, as long as they know what the button does--which these examples don't really convey.

thorum2• 13 years ago

Alternatively, we could make autosave ubiquitous so the symbol is no longer needed.

ori_b• 13 years ago

Only if saving also provides infinite undo, and the ability to save to multiple locations.

Saving is often used by non-developers as a poor man's branching and version history.

thorum2• 13 years ago

But like what you're getting at, we already have concepts like "branch" and "undo" and "version history" and "publish" for other uses of the save button and most of those already have their own, more intuitive icons. So why not do away with "save" as something that has to be done manually and emphasize those other actions with their own buttons.

bajsejohannes• 13 years ago

Yes! This is definitely something the user shouldn't have to care about.

I used to have vim autosave every time I changed focus. This worked really well, until I edited something which wasn't in revision control. That time I just cancelled the experiment, but maybe I should restart it and just autodetect if I'm in a repository or not.

Detrus• 13 years ago

The save symbol doesn't need to become universally known like radiation and biohazard. The concept won't need to be known in another decade.

krapp3• 13 years ago

I hope (and believe) you're wrong... I want to have the option to chose when and where to save my work. Not having this choice seems to imply a future in which no one has any real control over a filesystem or their files.

... which I suppose one can see coming from a mile away, but I really hope it doesn't become ubiquitous.

moonboots• 13 years ago

I prefer text to icons. Text has less ambiguity with the additional benefits of being easier to implement and faster to load (at least for html/css). An example is the new Safari [1] and Chrome devtools, which both stem from the old Safari devtools [2]. The new chrome devtools removes the top row navigation icons, leaving only text like 'Elements' and 'Resources'. It's cleaner and tighter than the old UI without sacrificing usability. Safari 6 removed the text and kept the icons. I find myself constantly lost and cycling through the icons. Admittedly, I only use Safari devtools to debug safari issues.

Back to the original topic, I think auto-save and undo obsolete the save button.

[1] https://developer.apple.com/technologies/safari/developer-to...

[2] this site has chrome screenshots, but it's what safari 5 dev tools looked like: https://developers.google.com/chrome-developer-tools/docs/ov...

Rezo• 13 years ago

Google Docs doesn't have a Save function, instead it has an endless revision history.

Which makes me think... if I'm coding and the project is in git repository, why am I still manually saving all the time? Why not automatically save every change I make as a revision, and provide me with endless undo (even if I quit the IDE). "Save" could now instead do a git rebase & squash to produce a neater commit from the many intermediate revisions.

nglevin2• 13 years ago

I always wondered why nobody else seemed to follow the lead of Lotus 1-2-3 for Windows. Use "save" and "load" icons that portray arrows pointing to and from folders [1]. Never have to worry about a floppy again.

Turns out, these guys just did that. Except with documents [2] and clouds [3] instead of folders. Guess iOS did away with those.

[1] - As seen in https://en.wikipedia.org/wiki/File:Lotus_1-2-3_9.8_Windows.p... , upper left corner

[2] http://branch.com/b/redesigning-the-save-symbol-let-s-do-thi...

[3] http://branch.com/b/redesigning-the-save-symbol-let-s-do-thi...

fyi802• 13 years ago

but wtf is a "folder", now?

hkmurakami2• 13 years ago

Don't people still use manilla folders and hanging folders to keep records of various medical/insurance/tax/legal papers at home? (these industries haven't exactly digitized their workflow)

(I certainly do)

krapp3• 13 years ago

a folder's a folder. Go into an office depot and you can buy boxes of them. people still use them all the time.

hkmurakami2• 13 years ago

People with relatively poor vision may have a problem identifying those icons.

nglevin2• 13 years ago

Someone tried to make an effort.

The load icon's arrow is bright green, while the save icon's arrow is teal. Which is downright impossible to see at 1440x900.

...I think the idea might have been better than the implementation.

bitwize• 13 years ago

A "phone" these days is usually, more or less, a small box with one glowy side. Yet these self-same devices, to represent "phone", use the silhouette of the handset from an old Bell Telephone landline model, thirty years after those phones went out of fashion. To even the younger generation, that shape means "phone", even if it doesn't look like a phone.

Similarly, the D-pad from a NES controller -- or worse, an Atari 2600 joystick -- is often used to represent or signify "video games".

"Home" is based on tract housing from the 1950s; yet even if home to you is an apartment, condo unit, palace, or boat, that icon still means "home".

There's another example. I just recently bought a Moleskine with an abstract graphic image of an audiocassette on it. There's no real reason for this; it's very hipster. It's sort of "celebrating the audiocassette" because to an entire generation of people, the cassette -- and its shape -- meant music (especially music on the go, like in a Walkman). Youngsters connect to it too, in a "retro" way. The same will be true of the floppy disk icon. No one uses it now, but it was ubiquitous that -- like the audiocassette or the distinctively shaped horn of a Victrola phonograph -- its shape has become semi-permanently associated in our culture with its intended use.

nfg• 13 years ago

Even the word “phone” is interesting, I have a feeling people will continue to apply it to increasingly advanced portable personal technologies far into the future.

apendleton• 13 years ago

Yes, I completely agree. Having the icon be a floppy disk is only weird during this transitional period when there are software users that regularly used floppy disks and now recognize them as antiquated. Most of the youngest generation of current computer users have probably never seen a floppy disk, so for them, that symbol (like the phone) just means "save," rather than being a representation of an actual thing. Eventually it will probably become more stylized and less recognizable, as people forget what it originally meant.

krapp3• 13 years ago

Icons representing 'obsolete' technology work as ideograms because the form factor of that old technology was unique enough to express a concept in a few pixels, whereas everything now is just some form of a nondescript box which chances are does multiple things. I ran into this problem a couple of years ago when I had to design a television graphic for my company... you know how difficult it is to convey "television" without rabbit ears? I wanted to add them just because that said "this is a tv."

Icons don't have to keep up with the actual technology whose function they represent... they just have to be immediately recognizable.

TrevorJ• 13 years ago

This is a good point - we've moved to a place where function no longer needs to dictate form to the same extent that it once did. A cassette tape was shaped the way it was in order to fulfill specific mechanical requirements.

thatthatis• 13 years ago

Last week on the front page of reddit: "I was cleaning up my office today and I found a bunch of 'Save' buttons" -- http://i.imgur.com/0R9EUmx.jpg

http://sl.reddit.com/r/funny/comments/1b22bl/i_was_cleaning_...

grinich• 13 years ago

App should just save automatically.

Usually when people use save, they actually want to take an action. (ie: exporting the file somewhere, sending it to someone, etc.)

This thread should focus on identifying those actions and finding more universal ways to make them ubiquitous.

What if there was a universal "send this" or "invite someone to collaborate" button?

whatshisface• 13 years ago

Then you would have to have millions of buttons for the millions of things people do with files. The beauty of the filesystem is that a single function (save) can be extended by other programs into many things. (Source control, file transfer, editing in another program, ect.)

morsch• 13 years ago

The fact that you don't manually save does not mean the files aren't represented on a file system. Source control, file transfer and editing in another program can work unchanged.

Though you would need to worry about atomicity when having a file open in two editors constantly "auto-saving" the document; you'd need some way to synchronise state. Probably easiest to make file write access exlusive by default.

jessriedel• 13 years ago

> What if...

Are you talking about the "share" button? On Android this is three dots in an equilateral triangle, with two of three sides connected by a line.

Aloha2• 13 years ago

That's a great idea if we all had a versioning file system (or for that matter if the filesystem could be a bit more abstract from the actual bits on the disk), most of us do not. Because there are many cases I can think of where you don't wanna save.

kstenerud• 13 years ago

> App should just save automatically.

Oh god please no. Apps that save automatically are the worst idea ever. I want to be able to make exploratory modifications, and then commit to disk AT A TIME OF MY CHOOSING. The computer doesn't know what I'm thinking, and it can't tell the difference between "messing around" content vs "serious" content.

I can see it now: I hit undo a bunch of times to get back to a previous state, copy some content that I wanted to bring back, then redo a bunch of times to get back, except I fatfinger it and hit paste by mistake. Now my whole redo path is gone, and I can't even reload to the state I was at before hitting undo thanks to the braindead program that "helpfully" saved my document behind my back.

Or even worse: I make some exploratory changes, then decide after changing a LOT of things that it won't work. The app crashes/the computer dies, whatever. I reopen the app and it's saved all the changes I don't want anymore. Maybe if I'm lucky it would have saved an undo path (unlikely), but even then, how far do I have to undo to get back to the sane state I was in?

Save means "I'm sure this is what I want. Persist these changes".

csihar• 13 years ago

Personally, I think in a perfect world there would be a more widespread distinction between "save" (something that happens automatically whenever changes are made, to "save" the data from some unexpected calamity like power failure) and "commit" (what you're talking about, which most people think of as "saving"). I doubt it would realistically catch on any time soon outside of tech circles, though, due to the confusion it could cause the average user - "New, open, print, commit, exit... now where the hell is the damn save button?!"

kybernetikos2• 13 years ago

Exactly. Save itself is the problem. Every change you make should be by default persisted. You shouldn't 'save' a current state, you should make named revisions you can roll back to easily.

fyi802• 13 years ago

> How can this immensely vital symbol be communicated in a timeless form so we never have to go through this again?

How about by picking a form that will always be in the past, and already well-documented and broadly understood, instead of trying to guess which of today's fads will be remembered?

mhuffman• 13 years ago

I think they should get away from the word "save" and focus on the word "store". It abstracts the final location, and would be easier to "icon-ize".

jspiros• 13 years ago

Is this necessary? We use plenty of symbols the origin of which have since become obsolete and mostly forgotten. Almost everyone is familiar with the meaning of arrows, for example, but not many people are immediately conscious of how it derives its shape from an archery context. The shape has transcended its origins and now simply refers to a context; the same can be true of floppy disks for save (and I'd argue, already is, as I'm sure there are young people now who are aware of what the symbol means but might not be familiar with its originating technology).

ChikkaChiChi4• 13 years ago

Maybe I'm getting old, but seeing conversations like this irritate me. All I see in that wall of text are activity indicators, upload icons, and "TO THE CLOUD!!!" icons.

Internet Comment Designers seem to think that skeuomorphism (a word they love using to tell the world 'LOOK, I KNOW BIG WORDS SO I MUST BE GOOD AT THINGS') must always be a bad thing...as if using the icon to save as a floppy disk is somehow less confusing to the average person than a circle with line, space, longer line, space, shorter line, space, rest of circle is somehow more intuitive.

People use & all the time and don't know what it means. Hell, @ doesn't even have a clear definition! But people know what it means, and that's what matters.

How come people don't use a hard disk as a save icon? How come the icon of a CD didn't catch on as a "Burn" action?

Its not because these actions are any less actionable than "saving" to a floppy disk. Its because you can clearly tell WHAT a floppy is compared to other donut looking objects, and that is what matters!

You don't need to flatten the UI or make something you think looks like an IEC symbol (protip: the symbol you all use for on/off is IEC 5009 symbol for "standby"). All you need to do is make sure that the symbol is unique enough that it can't be confused for anything else. Having the added back story that it used to "be" something else makes it trivia fodder in 50 years.

Yes, Apple is stupid for making their calendar look like a book. No, I am not a knuckle-dragging cave man for thinking a floppy disk is a good symbol for "commit to disk."

Get off my damned lawn.

jacalata2• 13 years ago

Absolutely. Anyway, if skeumorphism is bad, and the floppy icon is so unrecognisable as to be abstract (which appears to be the 'problem' these designers think needs solving), doesn't that mean the floppy icon is now good?

dragonwriter• 13 years ago

> Anyway, if skeumorphism is bad, and the floppy icon is so unrecognisable as to be abstract (which appears to be the 'problem' these designers think needs solving), doesn't that mean the floppy icon is now good?

The short answer is "No."

The long answer is that the skeumorphism is bad argument is generally that trying to imitate some kind of physical analog of the computerized process you are doing isn't an effective way of presenting a UI, in part because it imposes additional constraints that aren't native to the medium you are using (limiting your ability to fully utilize the medium you are using) and that it relies on experience with the particular physical analog to provide user understanding of the UI.

An icon that is functionally abstract because it references something that is outside of most users experience would be an example of the problem, not something that somehow flips it on its head and so becomes good.

(OTOH, the use of the floppy-disk-image-as-save-icon is so ubiquitous in software that it is probably a useful image that is well recognized, but that's neither because it originates as a skeumorph or because it is abstract now, but because it is ubiquitous in the digital realm, independent of its origin or current relation to user's non-digital experience.)

fryguy2• 13 years ago

Isn't the standby mode appropriate for power switches that are momentary toggle switches that started in ATX cases, as opposed to the on/off button which would be appropriate for the AT cases, where the switch is an actual power switch?

ChikkaChiChi4• 13 years ago

Yes but you see it in use incorrectly all the time (including in that thread).

In fact, the Windows 8 machine I'm on (shudder) actually represents "Shut Down" using the standby icon.

xsmasher• 13 years ago

FYI this is not skeuomorphism, it's more like anachronism. Different 50-cent word.

ChikkaChiChi4• 13 years ago

Excellent catch and you just taught me 50-cent word. I love it.

To be fair, I did just go back and search and anachronism had been used but skeuomorphism was not. Looks like I've been spending too much time on HN and Reddit!

mjcohen• 13 years ago

Use a drawing of the universal media, punched magnetic tape.

joeld42• 13 years ago

What's so bad about a floppy disk icon? Even if the kids today don't know what that is, they still know the icon means save. We recognize a pawnbroker's symbol or a barber pole without knowing where they came from.

marssaxman• 13 years ago

Funny, I have never before seen or heard of the "pawnbroker's symbol". I looked it up and I guess you mean the three circles hanging from a line. Is it a regional thing, I wonder? Here in the western USA, the only sign I would associate with a pawnbroker is "dingy neon". I wonder if the traditional sign is still used in areas which had pawnbrokers before the invention of lighted signage.

epo• 13 years ago

Certainly British, and probably European, usage. And yes, it predated electricity by quite some time, in fact said (http://en.wikipedia.org/wiki/Pawnbroker) to date back to the origins of banking in Italy.

Jach• 13 years ago

It doesn't need to be redesigned. I hate this trend of getting rid of very clear text and using nothing but "intuitive" icons that are "universally" understood, and only sometimes making the text available on hover/hold. Using both icon and text is fine, but text is way more important and unambiguous and should always be visible. Especially with the resolution and screen real estate modern displays have.

weix• 13 years ago

Using animation is a good idea, but do we really need a redesign?

endlessvoid942• 13 years ago

I think the idea of "save" may even go away. For example, there's no save button on google docs.

Computers should never lose your work, you shouldn't have to instruct it.

Udo• 13 years ago

Yet there is value in being able to decide when a versioning point should be created. This is actually a huge annoyance for me when I'm using Apple's apps that are "always and continually auto-saved". Yes, automatic integrity is nice (when it works), but not being able to make certain decisions about a file's state is pretty limiting.

endlessvoid942• 13 years ago

That's certainly true, but I'd argue for 99% of the time, automatic saving is what you want.

Aloha2• 13 years ago

This seems to me to be like proposing a square wheel because round ones are unattractive.

If you have a universal cultural idiom, I think it means you won the war of conveying a concept.

lifeisstillgood• 13 years ago

I disagree that no-one is ever likely to replace a floppy icon - the argument is based on the idea that everyone today knows what the floppy icon means.

everyone is only 1 billion people with a USA influenced cultural history and a Microsoft influenced PC history.

FirefoxOS stands a good chance of reaching a new billion people, and some mobile device will, and what will the chinese-ubuntu choose for save? There are going to be 10bn people alive in 2050 (I hope!) and 9bn of them have not seen a floppy disk icon.

It might be that we stick with the icon and everyone starts spelling skeuomorphism wrong. But is it likely?

So I quite like the discussion shown here. There are a couple of good ideas. And the new devices, then new mental models of synching local and remote storage, are going to need new iconography. Will these guys do it? Only if they buy a domain, produce high quality glyphs with open discussions, make it free and blog about it incessantly - then maybe when the next big thing comes along, they might just reach out and take the easy icon set. That would be nice.

grannyg00se• 13 years ago

"The Save symbol is years overdue for a rethink."

Why?

tekromancr• 13 years ago

I thought it was interesting. Not because I think the save button needs a redesign, but because it was fun to watch the design process. I think that everyone that is genuinely complaining in these comments need to chill out a bit. They admitted that the whole thing was academic.

Arzh• 13 years ago

The floppy disc rendering is already a timeless symbol for the 'Save' action. The first thing you think about when seeing it is 'Save' not 'I need to get my disc out.'

Also most apps save automatically and usually use an animation of something spinning, so you're already a tad too late.

n3rdy• 13 years ago

This must be what older generations felt like when music kept getting redefined by younger generations.

Here I am, screaming at my screen "Why can't you whipper snappers just leave it the way it is! I like the floppy disk icon! This is the devils work I tell you! You're going to ruin the internet!!"

pubby• 13 years ago

What's next, redesigning half of the English language because it contains so many words derived from Latin?

It doesn't matter where icons, words, or any identifier comes from so long as everyone understands it. If you're creating a new icon then it's a good idea to make the design intuitive as this improves its chance for adaption, but doing so to an ubiquitous icon such as "save" is just counter-productive.

zyglobe• 13 years ago

Do you really think about floppy disks when you save something? Most people don't. That's what makes it an effective symbol. You don't have to think, decipher, or read. Everyone has learned it and has become more productive by it. Why change that? Would it be wise to modernize traffic symbols as well? If you're going to try to force users to learn something new, there better be something in it for them (I don't see what that would be) and you would need just about every developer to agree upon and use this new symbol (good luck), otherwise you've pretty much asked Christians to change the cross symbol to a new modern torture device.

shanmoorthy• 13 years ago

In my concept of the future there will be no "Save", but instead any input/document will be passively cached locally in volatile storage, and archived incrementally on a non-volatile medium... without any active user input. In which case you'd only need an icon for "New", "Open" and "Delete".

If you're talking about representing a change of state (volatile to non-volatile), then borrow from Chemistry where a change from liquid to gas is represented by an arrow up, and a change from liquid to solid is represented by an arrow down. You could use the Unicode character U+21DF, a symbol that's already on every computer. Inversely you could use U+21DE to indicate "Load".

Redesigning the Save Symbol

Related Stories