What do each of these symbols have in common? They are all trying to convey the exact same action - share! Sharing to a social network or via email is a ubiquitous action nowadays but designers have still not been able to reach a consensus on what symbol to use to represent it. Not only does each major platform use a different icon, but they've each witnessed changes over the years.
I have spent sometime thinking about this, trying to figure out which symbol best conveys sharing to the user.
Uploader - iOS 7
I first saw this share icon when Apple announced iOS 7 on stage at WWDC 2013. I immediately re-created it only to discover that other people hated the new symbol.
The primary issue is that the iOS 7 share icon looks far too much like an upload symbol. If you place it side by side with the symbol for downloading, it's immediately apparent that the iOS 7 share icon is quite confusing. The upward pointing arrow is the exact inverse of the download icon and the natural assumption is that it represents the opposite, uploading.
The Outgoing Tray - Pre-iOS 7
The share icon from previous versions of iOS has been around for many years and is still being used in Mac OS X Mavericks (Mac OS X Yosemite will use the same share symbol as iOS 7's). Overall, it is a well designed symbol. It points outwards from a tray, signifying sharing. Since it has been around for a long time since the first iPhone, people have gradually become familiar with it.
Three Dots - Android Share Symbol
The Android share icon is a simple three dots with lines joining them. The same symbol is also used by ShareThis, a popular plugin for developers to share to all the popular social networks. It looks like a graph with nodes and vertices connecting them. It does not really convey any meaning at the first glance, but if I were to venture a guess, the designer is trying to represent the idea of the single node on the left spreading out to two others on the right. Overall, the idea of this design is not immediately intuitive and the association of sharing with this symbol is purely because users have learned what it means over time. I suspect that Apple only users may have trouble recognizing this symbol.
A totally unscientific experiment reveals that 7 out of the top 10 Google results for "share icon" are reminiscent of Android's take on sharing.
The Y - Old Android
Prior to Honeycomb, this share symbol was used across Android devices. It represents a single point spreading outwards in two directions. This symbol is not widely used now, but I still really like this symbol because the arrows represent outward motion, much like the act of sharing, and also because it is vertically symmetrical. I do think that this is one of the best representations of the concept of sharing purely based on its shape.
On the left is the original Android share icon. There are other slight variations of the same symbol.
The Circle - Windows 8
The Windows 8 share symbol, is reminiscent of the Ubuntu logo and is used widely across the OS and on Windows Phone devices. This is another completely abstract icon with no evident meaning to it. Without its accompanying label, a first time user would likely be very confused about the function of this icon.
The Gift - Windows Phone 7
The Windows Phone 7 share icon of a present or gift is an odd, but fun choice. The concept behind the icon is obvious - a gift that you can share. However, the issue is that you don't really share presents, you give them away.
This icon was interesting and refreshing, but feels too unfamiliar to users. The first time I saw it, I had no clue what it did. This symbol was short-lived for about a year and a half before Windows Phone adopted the new Windows 8 share icon.
The Hands - Open Share Icon
Shareaholic attempted to create an universal share symbol that designers could use. The Open Share Icon was described thusly:
The Open Share icon conveys the act of sharing by visually representing one hand passing an object to another hand, as in "pass it on" or "sharing". The icon also represents an "eye", as in "look at this".
Overall, it is an interesting concept and idea. Although it is fairly distinct, most users would not recognize the hands at first glance. If the hands are not immediately distinguishable, then the icon loses its meaning. Unfortunately, it doesn't seem to have caught on and is rarely used on sites in the wild.
Frustrated with all the different versions of share icons on various platforms, many designers have tried to create a "universal" share symbol. These are some other icons that I have come across:
The Spread
Some designers use the idea of spreading to represent sharing. It represents the idea of network effects quite well, but I find it overly complex and cluttered to be a good share icon.
The Graph Diagram
Some share icons consists of varied circle sizes with lines joining to the center dot. These icons look too much like graph diagrams. They may be a good representation of chemical elements bonding, but they definitely do not represent the concept of sharing well.
The Open Hand
Many years ago, the open hand symbol was used on shared network folders. Certain old enterprise software still uses the open hand symbol as the share action. However, those share actions usually denote sharing settings to a local area network, not sharing to social platforms.
Many People
The many people symbol is usually used to mean sharing with specific collaborators or team members. I have never seen it used in the context ofsharing to a social platform before.
Milkshake!
Sometimes, the best way to solve a design problem is to ask a non-designer. For this issue, I asked my housemate, a non-designer: "What comes to mind first when you think of sharing? How would you represent the action of sharing with a symbol?" He proceeded to draw a drink, which he explained was a milkshake, with two straws.
The sketch by my friend
The milkshake icon is a really fun idea. It signifies the action of sharing quite well. However, there are two potential issues with this symbol. It is a bit jarring to have a milkshake amidst all the other icons that we usually use. More importantly, this symbol seems to convey a very specific sharing concept, i.e., sharing the same object between two people. However, in the sharing context that we are discussing, it's almost always the idea of sharing to many other platforms.
I drew a vector milkshake icon for fun.
All the share icons
Summary of all the share icons discussed
Which icon should you use?
It is unlikely that we will see a convergence to a single share symbol. Apple will not start using Android's design language, Google is not going to implement Microsoft's design, nor is Microsoft going to use another platform's share icons. Since each of the big three OS companies individually has huge device market share, users will likely interact with at least three different types of symbols that represent the same action.
The best icon is the one that users are most familiar with.
The best icon is not the one that is the simplest, nor the one that makes the most sense. Instead, the best icon is one with which most users are already familiar. An effective icon is one that requires minimum effort for the user to translate that symbol to an action.
You should use the share icon depending on the platform for which you're building.
If you are developing on Apple iOS 7, you should use the share icon that is already in use on that platform, the 'Uploader'. Similarly, your Android app should use the 'three dots'.
What if I just want to use the same symbol for all platform?
If you want to pick a single universal share icon for your app or site regardless of the platform, the "Outgoing Tray" or the "3 dots" icons would be your best bet because they are the most recognized share icons today. However, I would recommend the "Outgoing Tray" over the "3 dots" because even for someone who has never interacted with an Apple product before, the outgoing tray icon still manages to convey the act of sharing. The 3 dots is far more abstract in its representation.
In a year's time, iOS 7's "Uploader" (which will be used in iOS 8 and Mac OS X Yosemite) and Windows 8 "Circle" will probably become the more recognized share icons.
Best concept
If I were to evaluate each of the share icons not by its familiarity with users or popularity among apps, but purely based on design, my vote would go to the "Y icon". This icon is the least abstract, and the most straightforward way to represent an outward action, much like sharing something. It is highly distinct, and also vertically symmetrical. Unfortunately, it hasn't yet been adopted widely.
Today, I still use the "Outgoing Tray" as my default go-to share icon. Let me know which icon you use in your app or site in the comments below or on Twitter.
扫一扫
682
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
