Hi,

There are different topics discussed here:

Similar icons

Similar icons are not bad thing per se, provided that (a) they are distinguishable, and (b) the similarities and differences create a system that makes sense (in which case facilitate learnability).

For example, the Facebook app for Android (view example) shows the following icons: three lines (hamburger) to represent a list of options, a human silhouette to represent friend request notifications, and the human silhouette with three lines to represent your list of friends.

In our case, a callout represents a message, a smiling face is a user, and a smiling face within a callout represents sending a message of gratitude to a user. So I think that it makes sense for the representations of such elements to have much in common.

The relevant question here in my opinion is whether this system works. For that, personally I really like to evaluate icons in context: ask a user a task that requires identifying, understanding, and using the icons, and identify problems.

Faces in icons

Faces are a powerful tool to attract our attention, so they should be used with caution.

Many sites use your own picture to represent you as a user. Seeing your own picture is very effective to attract your attention. Using a face to represent the user goes along those lines as an alternative to use profile pictures.

A face also adds a human touch. Chrome or YouTube use them in error messages. The Android contacts and the messaging app icons may be the closest examples to our context (use of faces related to communicating with people).

The flag icon

Adding a face to the flag icon was just an attempt I did to extend the system (that probably went too far). The rationale was just to present "thank" and "report" as alternative actions. Although we want to move from a mental model of voting (e.g., thumbs up/down), I wanted to keep the UI compatible with users that came with that mental model.

If a regular flag is used, actions will look independent (and not helping to understand one another). However, it provides two bigger benefits: (a) avoid having too many faces, (b) consistency with flag icons used in other contexts. So I'm happy to replace this with the standard one.

Pau

On Wed, Oct 23, 2013 at 1:38 AM, Quiddity <pandiculation@gmail.com> wrote:

On 13-10-22 03:54 PM, Brandon Harris wrote:

        On my desk there is a book called “Understanding Comics”.  It has a whole section that goes into how various degrees of fidelity with comic drawings, icons, and photographs create empathic connections.

        I would encourage everyone to read this.  Your take away is likely going to be that you shouldn’t show any kind of facial features at all, nor should you pick a color for your icon other than black, white, or grey.  

Seconded. This is one those books I believe everyone should be assigned once in middle school, and again in high school. It is dripping with insights. I've gifted a few copies to teacher-friends.

_______________________________________________
Design mailing list
Design@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/design

--

Pau Giner

Interaction Designer

Wikimedia Foundation

_______________________________________________
Design mailing list
Design@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/design