Talk:OLPC Human Interface Guidelines/The Sugar Interface/Icons: Difference between revisions

From OLPC
Jump to navigation Jump to search
(Expressing colours in monochrome section added linking to the XOj_in_monochrome page.)
 
(24 intermediate revisions by 12 users not shown)
Line 39: Line 39:


I agree, the X is slightly disquieting, even using nicer colours. And also the "jumping child" is alone. Maybe a variation of the [http://www.ubuntu.com Ubuntu] logo would be better suited? --
I agree, the X is slightly disquieting, even using nicer colours. And also the "jumping child" is alone. Maybe a variation of the [http://www.ubuntu.com Ubuntu] logo would be better suited? --

: But the icon is not just a picture representing the project. It has a specific meaning within the user interface: A solo icon represents one person/laptop. On the activity screen, there is one icon to represent your laptop, while on the neighborhood screen, there is an icon for each laptop in your neighborhood. If you instead show a group of three people for the icon, you then draw three people per laptop, which is confusing. Alternatively, you could use a one-person icon on the activity and neighborhood screens and a three-person icon everywhere else, but that would be inconsistent and also confusing. Fundamentally, it's hard to express the concept of an individual without also expressing the concept of aloneness.

:I agree that the association with skull-and-crossbones is unfortunate, but I think it is possible to distinguish between the two. Usually skull-and-crossbones has a small X and a large head, while the XO icon has a large X and small head. The XO icon more closely abstracts the chinese icon above than it does the skull-and-crossbones. Vertically elongating the X or adding a short body line would have helped, though. —[[User:Leejc|Leejc]] 14:14, 6 March 2007 (EST)

A cross is a Christian symbol, even when oriented in an X shape. Besides appearing to be proselytzing via the interface, it becomes a good excuse for anti-Christian fanatics to sabotage the project. "The USA is sending this device to convert your children." [[User:71.241.4.147|71.241.4.147]] 21:08 16 April 2006

____

Beyond the concern of the icon looking like a skull and crossbones is the issue of... it not being a clear enough representation of the user. While conducting usability tests on the icons, as well as the entire interface, the "person" is more than 50% of the time initially confused with it as a method of "closing" out of something. The X, especially when testing individuals not from the States, represents an end point - not home.


==Developers discussion==
==Developers discussion==
Line 45: Line 55:
I made an icon editor for X0 icons. Have a look at [http://jabberworld.org/olpc/index.xml X0 icon maker] --[[User:80.109.11.235|80.109.11.235]] 14:20, 28 January 2007 (EST)
I made an icon editor for X0 icons. Have a look at [http://jabberworld.org/olpc/index.xml X0 icon maker] --[[User:80.109.11.235|80.109.11.235]] 14:20, 28 January 2007 (EST)


:Waht fun. Why don't you make a Sugar activity out of this!! But could you add a mode where the is a stroke and fill? The distinction is important to the UI. --[[User:Walter|Walter]] 16:29, 29 January 2007 (EST)
:What fun. Why don't you make a Sugar activity out of this!! But could you add a mode where the is a stroke and fill? The distinction is important to the UI. --[[User:Walter|Walter]] 16:29, 29 January 2007 (EST)


::Ok, I did some kind of outline. Stroke, fill is not possible in this case I think - but similar result. I try to improve - but I will not have access to computer for some time now. I added a zip file of the project [http://jabberworld.org/olpc.tar.gz] (copyleft). Btw. I think it's still not possible to upload svg files to the wiki. --[[User:Bz|Bz]] 21:58, 29 January 2007 (EST)
::Ok, I did some kind of outline. Stroke, fill is not possible in this case I think - but similar result. I try to improve - but I will not have access to computer for some time now. I added a zip file of the project [http://jabberworld.org/olpc.tar.gz] (copyleft). Btw. I think it's still not possible to upload svg files to the wiki. --[[User:Bz|Bz]] 21:58, 29 January 2007 (EST)


::I need to fix that (uploading SVG)... thanks. --[[User:Walter|Walter]] 23:00, 29 January 2007 (EST)
::I need to fix that (uploading SVG)... thanks. --[[User:Walter|Walter]] 23:00, 29 January 2007 (EST)

I made an XO color and shape editor (See http://www.laptop.org/xo-color.xml). I haven't made it an activity yet, so it doesn't save anything out... (I need to learn Python.) --[[User:Walter|Walter]] 11:21, 8 February 2007 (EST)

Perhaps it would be usefull for icon creators to have a svg file of the image (showing the grid, and border of icon-safe area) on top of which they could better design their icons. [[User:HoboPrimate|HoboPrimate]]

:Nevermind, it's easy to create one ourselves, just create a document sized 75x75 pixels, with 15 px spaced guidelines. Then create a thin box around the middle square of 3x3 squares. [[User:HoboPrimate|HoboPrimate]]

--
Do main Activity icons use such 3.5pt for their strokes? The Write icon stroke is actually 2.8 pt, 3.5 px in the S size.


==Expressing colours in monochrome==
==Expressing colours in monochrome==
Line 57: Line 76:
An idea for expressing colours in monochrome blocks next to an XO symbol has been suggested, with the idea that these blocks could be made visible on the screen as an option.
An idea for expressing colours in monochrome blocks next to an XO symbol has been suggested, with the idea that these blocks could be made visible on the screen as an option.


See [[XOj in monochrome]]
[[http://wiki.laptop.org/go/XOj_in_monochrome]]

== Active vs. Inactive Icons ==

I noticed that an inactive friend in Groups view appears as a grayed icon, which seems to violate the guideline. Perhaps this is a temporary situation since the active vs.inactive examples are not yet shown. --[[User:FGrose|FGrose]] 23:41, 11 February 2008 (EST)

== Icons ==

I'm looking for the safety advisory icons used on the shutdown screen and in the G1G1 package insert. The Pictogram Insert, Insert.pdf, file is not available behind it's place holder on this page, [[Hardware_Testing#Safety_Certifications]]. Could someone please help find it, or point us to the shutdown graphic file on the XO? Thank you! --[[User:FGrose|FGrose]] 23:51, 11 February 2008 (EST)
: See [[Replacing_the_shutdown_screen]] and [http://dev.laptop.org/git?p=users/cscott/act-gui;a=blob;f=images/ul_warning.png;h=aa7112ff4977835f2f76f0eb38f4ae73002984a6;hb=master ul_warning.png]. --[[User:FGrose|FGrose]] 03:28, 12 March 2008 (EDT)

Latest revision as of 18:34, 8 September 2008

XO discussion

I guess this starts the remarks on Icons for the Sugar Interface - I am surprised there is no prior entry.

The so-called "XO" icon should be redesigned: OLPC-UI-IconsForUser.jpg

It is supposed to represent the user - in an abstract iconic way - but sadly, it also looks very much like a symbol widely associated with mortality, toxicity and military killing - the skull and crossbones, cf. Skull_and_crossbones, Jolly_Roger, and Totenkopf. (The nicest associations one can offer are a parochial reference to a certain Yale University society or what SCO might say about Linux whenever Steve Ballmer has a bad hair day. <G>)

The binding of the symbol to these horrific meanings is a reflection of a biological fact about the last parts of a human corpse to decay, and is not especially tied to a particular culture.

Surely the intention was to represent a (living) human being, in particular a child, without biased reference to a particular sex, race or dress-style. I'd argue there are better designs one might use.

One example is direct use of the oldest Chinese ideograph for child/baby, as shown in the graphic above. What appears to be something of a derivative was in fact used within the logo for the International Year of the Child in 1979.

Note that a large head/torso ratio not only reflects the biology of children, but also the way in which child-made art focuses on the head in early Lowenfeld developmental stages.

Alternately, one might use variants on the "smiley-face", but avoid the Microsoft_Bob curse" by making the face either simpler or more complex.

Yet another choice would be a head-profile silhouette, cropped to include only the front of the face to avoid issues about dress and hairstyle, something not much unlike this. But this design is disfavored because it scales down poorly.

Docdtv 07:44, 1 December 2006 (EST)

Huh. And here I thought they were naming it after Sanrio's Badtz-Maru! From Wikipedia:
In Japanese "badtz" (batsu) is a term for X, the cross signifying a wrong answer. "Maru" is a term for O, or a correct answer. So, Badtz Maru not only means "bad penguin;" it is also a pun that means "wrong-correct," and is frequently represented by "XO". Indeed, with his friends Pandaba and Hana Maru, Badtz runs the mischievous XO clan.
Wrong, then right. A very nice metaphor for learning, if you ask me. --IanOsgood 20:30, 17 January 2007 (EST)

I agree, the X is slightly disquieting, even using nicer colours. And also the "jumping child" is alone. Maybe a variation of the Ubuntu logo would be better suited? --

But the icon is not just a picture representing the project. It has a specific meaning within the user interface: A solo icon represents one person/laptop. On the activity screen, there is one icon to represent your laptop, while on the neighborhood screen, there is an icon for each laptop in your neighborhood. If you instead show a group of three people for the icon, you then draw three people per laptop, which is confusing. Alternatively, you could use a one-person icon on the activity and neighborhood screens and a three-person icon everywhere else, but that would be inconsistent and also confusing. Fundamentally, it's hard to express the concept of an individual without also expressing the concept of aloneness.
I agree that the association with skull-and-crossbones is unfortunate, but I think it is possible to distinguish between the two. Usually skull-and-crossbones has a small X and a large head, while the XO icon has a large X and small head. The XO icon more closely abstracts the chinese icon above than it does the skull-and-crossbones. Vertically elongating the X or adding a short body line would have helped, though. —Leejc 14:14, 6 March 2007 (EST)

A cross is a Christian symbol, even when oriented in an X shape. Besides appearing to be proselytzing via the interface, it becomes a good excuse for anti-Christian fanatics to sabotage the project. "The USA is sending this device to convert your children." 71.241.4.147 21:08 16 April 2006

____

Beyond the concern of the icon looking like a skull and crossbones is the issue of... it not being a clear enough representation of the user. While conducting usability tests on the icons, as well as the entire interface, the "person" is more than 50% of the time initially confused with it as a method of "closing" out of something. The X, especially when testing individuals not from the States, represents an end point - not home.

Developers discussion

It'd be helpful to have the .svg files for the standard icons accessible directly from this article page. --Walter 07:19, 28 January 2007 (EST)

I made an icon editor for X0 icons. Have a look at X0 icon maker --80.109.11.235 14:20, 28 January 2007 (EST)

What fun. Why don't you make a Sugar activity out of this!! But could you add a mode where the is a stroke and fill? The distinction is important to the UI. --Walter 16:29, 29 January 2007 (EST)
Ok, I did some kind of outline. Stroke, fill is not possible in this case I think - but similar result. I try to improve - but I will not have access to computer for some time now. I added a zip file of the project [1] (copyleft). Btw. I think it's still not possible to upload svg files to the wiki. --Bz 21:58, 29 January 2007 (EST)
I need to fix that (uploading SVG)... thanks. --Walter 23:00, 29 January 2007 (EST)

I made an XO color and shape editor (See http://www.laptop.org/xo-color.xml). I haven't made it an activity yet, so it doesn't save anything out... (I need to learn Python.) --Walter 11:21, 8 February 2007 (EST)

Perhaps it would be usefull for icon creators to have a svg file of the image (showing the grid, and border of icon-safe area) on top of which they could better design their icons. HoboPrimate

Nevermind, it's easy to create one ourselves, just create a document sized 75x75 pixels, with 15 px spaced guidelines. Then create a thin box around the middle square of 3x3 squares. HoboPrimate

-- Do main Activity icons use such 3.5pt for their strokes? The Write icon stroke is actually 2.8 pt, 3.5 px in the S size.

Expressing colours in monochrome

The use of two-colour XO symbols is good for many children, yet some children may have problems with some of the colours.

An idea for expressing colours in monochrome blocks next to an XO symbol has been suggested, with the idea that these blocks could be made visible on the screen as an option.

See XOj in monochrome

Active vs. Inactive Icons

I noticed that an inactive friend in Groups view appears as a grayed icon, which seems to violate the guideline. Perhaps this is a temporary situation since the active vs.inactive examples are not yet shown. --FGrose 23:41, 11 February 2008 (EST)

Icons

I'm looking for the safety advisory icons used on the shutdown screen and in the G1G1 package insert. The Pictogram Insert, Insert.pdf, file is not available behind it's place holder on this page, Hardware_Testing#Safety_Certifications. Could someone please help find it, or point us to the shutdown graphic file on the XO? Thank you! --FGrose 23:51, 11 February 2008 (EST)

See Replacing_the_shutdown_screen and ul_warning.png. --FGrose 03:28, 12 March 2008 (EDT)