Human Interface Guidelines/The Sugar Interface/Colors/lang-es

From Sugar Labs
< Human Interface Guidelines‎ | The Sugar Interface‎ | Colors
Revision as of 15:24, 20 July 2009 by FGrose (talk | contribs)
(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)
Jump to navigation Jump to search
  Traducción de HIG-Colors original  
  english | español | 한국어   +/- cambios  

Colores

Dando Significado al Color

Sugar maneja a los colores de manera diferente que un IU típica: los colores son usados en la interfaz para representar a los individuos con quienes se esta interactuando en la malla, no las actividades u objetos que son usados. Los chicos personalizan sus laptops y su presencia en la malla seleccionando un esquema bi-color. Todas las actividades, objetos y comentarios pertenecientes a un chico tomaran sus colores—aun cuando aparecen en las laptops de otros chicos en la malla—formando un identidad visual que se agrega al nombre y atributos.

Sugar treats color differently than the typical UI: colors are used in the interface represent the individuals who are interacting within the mesh, not the activities or objects they are using. Children personalize their laptops and their presence on the mesh by selecting a dual-tone color scheme. All of the activities, objects, and comments belonging to a child take on her own colors—even when they appear on the laptops of other children on the mesh—forming a visual identity that supplements her name and attributes.

Este tratamiento del color se extiende aun dentro de las actividades. Por ejemplo, en la actividad Web una facilidad para compartir enlaces incita al chico a navegar la web en forma grupal, compartiendo páginas útiles o interesantes entre ellos. Cada objeto URL publicado para que otros lo vean aparecerá en los colores del chico que lo publicó. De modo similar, las burbujas de chat en la Cartelera tomaran sus colores. De igual modo, cualquier objeto, texto u otro elemento de la interfaz dentro de una actividad que se corresponda a un chico en particular tiene que ser mostrado con sus colores. Cuando la pantalla funcione en una escala de grises, esta identidad visual es menos evidente. Sin embargo, diferencias sustanciales en valores, según el Sistema Munsell, asegura que los XOs mantengan un nivel de diferenciación visual aun ante la ausencia de color.

This color treatment extends even within activities. For instance, in the Web activity a link-sharing feature encourages children to browse the web in groups, sharing interesting or useful pages with each other. Each URL object posted for the others to view appears in the colors of the child who posted the link. Similarly, chat bubbles on the Bulletin Board take on the children's colors. Likewise, any object, text, or other interface element within your activities that corresponds to a particular child should be rendered in this manner. When the display runs in grayscale mode, this colored visual identity is less apparent. However, significant differences in value, according to the Munsell System, ensure that the XOs retain a level of visual distinction even in the absence of color.

Con el objetivo de mantener un grado de pureza en este sistema, los elementos de la interfaz, botones y otros iconos que pertenezcan únicamente a la actividad y no a cualquier chico deberán siempre que fuese posible mantenerse dentro de una escala de grises. Si bien el eliminar el color como mecanismo visual puede parecer contra-intuitivo, en realidad favorece que la forma de un icono indique claramente su funcionalidad. Dado que las laptops también funcionaran en escala de grises, formas netamente diferentes serán esenciales ante la ausencia de la información cromática, y por lo tanto limitar los iconos de las actividades desde un principio a una escala de grises asegura su compatibilidad en ambos modos. Adicionalmente, cabe resaltar que el método tradicional de "agrisar" los botones o controles inactivos directamente no funcionara en la laptop y deben ser evitados. En su lugar, hay que adherirse a los lineamientos para iconos inactivos

To maintain a degree of purity to this system, interface elements, buttons, and other icons that belong solely to the activity and not to any particular child should remain in grayscale to the extent possible. While removing color as a primary visual clue may seem counter-intuitive, it does encourage the icon's form to clearly indicate its function. Since the laptops will also run in grayscale mode, clearly distinct shapes become essential in the absence of chroma information, and so limiting activity icons to grayscale by default ensures compatibility in both modes. Additionally, keep in mind that the traditional method of "graying-out" inactive buttons and controls simply will not function on the laptops and must be avoided. Instead, please adhere to the guidelines for inactive icons.

Contraste en el Espacio de Munsell

El esquema básico de colores de la laptop esta limitado por la necesidad de trabajar tanto en color (iluminación interna de la pantalla) y en escala de grises (modo reflectivo o solar); por lo tanto hemos elegido unos lineamientos que garanticen por lo menos un nivel de contraste no-cromático bajo todas circunstancias. Aun mas, la legibilidad del texto en todo momento se logra por medio de una combinación de colores cuyo contraste no-cromático es lo suficientemente amplio y su energía cromática es de un nivel bajo a moderado. Por esta razón, es que buscamos un contraste no-cromático de por lo menos dos pasos Munsell.

The basic color scheme for the laptop is constrained by the need to work in both color (backlight mode) and grayscale (reflective mode); thus we have chosen guidelines that ensure at least some achromatic contrast under all conditions. Further, sustained legibility of text is accomplished by a combination of colors whose achromatic contrast is large and whose chromatic energy is of low to moderate level. For this reason, we are striving for achromatic contrast of at least two Munsell value steps.

El valor normal para el Marco es de N2.5; mientras que el del fondo es N9. Por lo tanto, para mantener un contraste suficiente, los valores para los trazos de los iconos que aparecen tanto en el Marco como el fondo deben estar en el rango N5 y N7. El relleno interior de dichos iconos debe mantener un contraste no-cromático con respecto al trazo, ej. si el color del trazo de un icono tiene un valor de N5, el relleno debe ser ≤N3 o bien ≥N7.

The default value for the Frame is N2.5; the default value for the background is N9. Therefore, to maintain sufficient contrast, the line values for icons that appear on both the Frame and the background should range between N5 and N7. The interior fill of those icons should maintain achromatic contrast with the line value, e.g., the fill color for an icon with a line value of N5 should be either ≤N3 or ≥N7.

Pasos Munsell
Color
Relleno
Valor Trazo 5
N10 pasos delta 5
N9 pasos delta 4
N8 pasos delta 3
N7 pasos delta 2
N6 pasos delta 1
N5 pasos delta 0
N4 pasos delta 1
N3 pasos delta 2
N2 pasos delta 3
N1 pasos delta 4
N0 pasos delta 5

Munsell Value Steps
Fill color Line value 5
N10 delta 5 value steps
N9 delta 4 value steps
N8 delta 3 value steps
N7 delta 2 value steps
N6 delta 1 value steps
N5 delta 0 value steps
N4 delta 1 value steps
N3 delta 2 value steps
N2 delta 3 value steps
N1 delta 4 value steps
N0 delta 5 value steps

Texto Sobre Valores Normales de la Laptop
Valor
Tipografía
Marco (N2.5) Fondo (N9)
N10 pasos delta 7.5 pasos delta 1
N9 pasos delta 6.5 pasos delta 0
N8 pasos delta 5.5 pasos delta 1
N7 pasos delta 4.5 pasos delta 2
N6 pasos delta 3.5 pasos delta 3
N5 pasos delta 2.5 pasos delta 4
N4 pasos delta 1.5 pasos delta 5
N3 pasos delta 0.5 pasos delta 6
N2 pasos delta 0.5 pasos delta 7
N1 pasos delta 1.5 pasos delta 8
N0 pasos delta 2.5 pasos delta 9

Text Against Default Laptop Colors
Font value Frame (N2.5) Background (N9)
N10 delta 7.5 value steps delta 1 value step
N9 delta 6.5 value steps delta 0 value steps
N8 delta 5.5 value steps delta 1 value step
N7 delta 4.5 value steps delta 2 value steps
N6 delta 3.5 value steps delta 3 value steps
N5 delta 2.5 value steps delta 4 value steps
N4 delta 1.5 value steps delta 5 value steps
N3 delta 0.5 value steps delta 6 value steps
N2 delta 0.5 value steps delta 7 value steps
N1 delta 1.5 value steps delta 8 value steps
N0 delta 2.5 value steps delta 9 value steps