Changes

Jump to navigation Jump to search
no edit summary
Line 1: Line 1:  
<noinclude>
 
<noinclude>
{{Translation | lang = es | source = Design_Team/Human_Interface_Guidelines/The Sugar Interface/Icons | version = 42166 | source_display = OLPC-HIG-Icons}}
+
{{Translation | lang = es | source = Human_Interface_Guidelines/The Sugar Interface/Icons | version = 32566 | source_display = HIG-Icons}}
 
</noinclude>
 
</noinclude>
 
<div style="background-color: #FFF; margin-left:auto; margin-right: auto; width: 95%;">
 
<div style="background-color: #FFF; margin-left:auto; margin-right: auto; width: 95%;">
Line 7: Line 7:  
   | c_section=The Sugar Interface | c_page=Icons
 
   | c_section=The Sugar Interface | c_page=Icons
 
   | n_page=Colors}}
 
   | n_page=Colors}}
 +
{{TOCright}}
 
<!--  
 
<!--  
   Line 15: Line 16:  
{{anchor|Icons}}
 
{{anchor|Icons}}
 
<!--===Iconos===-->
 
<!--===Iconos===-->
==={{:Design Team/Human Interface Guidelines/The Sugar Interface/Icons/lang-es/title}}===
+
==={{:Human Interface Guidelines/The Sugar Interface/Icons/lang-es/title}}===
    
{{anchor|Categories of Icons}}
 
{{anchor|Categories of Icons}}
Line 22: Line 23:  
{{anchor|The XO}}
 
{{anchor|The XO}}
 
=====El XO=====
 
=====El XO=====
 
+
{| cellpadding="5px"
[[Image:xo_s.png|left]]
+
|<span class="plainlinks">[{{fullurle:olpc:Image:xo_s.png}} http://wiki.laptop.org/images/b/ba/Xo_s.png]</span>
 
+
|
 
Los iconos que representan Personas tienen un estatus especial en las laptops. Referidos en general como ''XOs'', ellos representan a los niños y sus laptops en el Vecindario de la malla, y por extensión al proyecto OLPC y sus objetivos de poner una laptop en las manos de cada niño. Cada niño elegirá el trazo y color para su XO, que serán los colores que se aplicarán a los íconos de cualquier Actividad u Objeto que creen.
 
Los iconos que representan Personas tienen un estatus especial en las laptops. Referidos en general como ''XOs'', ellos representan a los niños y sus laptops en el Vecindario de la malla, y por extensión al proyecto OLPC y sus objetivos de poner una laptop en las manos de cada niño. Cada niño elegirá el trazo y color para su XO, que serán los colores que se aplicarán a los íconos de cualquier Actividad u Objeto que creen.
 +
|}
 
{{ Translated text |
 
{{ Translated text |
 
The icons which represent People have special status on the laptops. Referred to generally as the XOs, they represent the children and their laptops on the mesh Neighborhood, and furthermore represent the OLPC project and its goals to place a laptop in the hands of every child. Each child will select a stroke and fill color for their XO, and their chosen colors will then apply to the icons of any Activities or Objects they create.
 
The icons which represent People have special status on the laptops. Referred to generally as the XOs, they represent the children and their laptops on the mesh Neighborhood, and furthermore represent the OLPC project and its goals to place a laptop in the hands of every child. Each child will select a stroke and fill color for their XO, and their chosen colors will then apply to the icons of any Activities or Objects they create.
Line 36: Line 38:  
=====Iconos de Objetos=====
 
=====Iconos de Objetos=====
   −
[[Image: clipping.png|left]]
+
{| cellpadding="5px"
 
+
|<span class="plainlinks">[{{fullurle:olpc:Image:clipping.png}} http://wiki.laptop.org/images/7/72/Clipping.png]</span>
 +
|
 
{{anchor|Action Icons}}
 
{{anchor|Action Icons}}
 
=====Iconos de Acciones=====
 
=====Iconos de Acciones=====
Line 43: Line 46:  
{{anchor|Active vs. Inactive Icons}}
 
{{anchor|Active vs. Inactive Icons}}
 
====Iconos Activos vs. Inactivos====
 
====Iconos Activos vs. Inactivos====
 
+
|}
 
Puede ocurrir en muchas situaciones que algunos elementos de la interfaz se encuentren inactivos. Sugar especifica un estilo visual consistente para representar los conceptos de ausencia e inactividad. Los elementos inactivos son botones que no accionables actualmente, o controles que están temporalmente deshabilitados. Los elementos ausentes son iconos de objetos que representan personas o cosas que no se encuentran actualmente presentes; por ejemplo, una descarga incompleta, o un amigo invitado que todavía no se ha unido a la actividad.
 
Puede ocurrir en muchas situaciones que algunos elementos de la interfaz se encuentren inactivos. Sugar especifica un estilo visual consistente para representar los conceptos de ausencia e inactividad. Los elementos inactivos son botones que no accionables actualmente, o controles que están temporalmente deshabilitados. Los elementos ausentes son iconos de objetos que representan personas o cosas que no se encuentran actualmente presentes; por ejemplo, una descarga incompleta, o un amigo invitado que todavía no se ha unido a la actividad.
 
{{ Translated text |
 
{{ Translated text |
Line 73: Line 76:  
{{anchor|Icon Sizes}}
 
{{anchor|Icon Sizes}}
 
=====Tamaño de Iconos=====
 
=====Tamaño de Iconos=====
[[Image: standard_icon_size.png|thumb|105px|left]]
+
{| cellpadding="5px"
 +
|<span class="plainlinks">[{{fullurle:olpc:Image:Standard_icon_size.png}} http://wiki.laptop.org/images/thumb/d/d9/Standard_icon_size.png/105px-Standard_icon_size.png]</span>
 +
|
 +
Los iconos deben ser desarrollados y guardados en un tamaño estándar (''S - standard''), aunque su tamaño y apariencia actual en la interfaz cambie dinámicamente. Cuando sean desarrollados en el tamaño estándar (''S''), los iconos deben entrar holgadamente dentro de una sub-celda de 3 x 3 segura para iconos de una celda estándar de una grilla de 75px, como esta especificado en la [[Design Team/Human Interface Guidelines/The Sugar Interface/Layout Guidelines/lang-es|sección de diagramación]].
   −
Los iconos deben ser desarrollados y guardados en un tamaño estándar (''S - standard''), aunque su tamaño y apariencia actual en la interfaz cambie dinámicamente. Cuando sean desarrollados en el tamaño estándar (''S''), los iconos deben entrar holgadamente dentro de una sub-celda de 3 x 3 segura para iconos de una celda estándar de una grilla de 75px, como esta especificado en la [[Design Team/Human Interface Guidelines/The Sugar Interface/Layout Guidelines/lang-es|sección de diagramación]].
   
{{ Translated text |
 
{{ Translated text |
 
Icons should be developed and saved at Standard (S) size, though their actual size and appearance in the interface may change dynamically.  When developed at standard size, icons should fit loosely within the 3 x 3 icon-safe subcell of a standard 75px grid cell, as specified in the [[Design Team/Human Interface Guidelines/The Sugar Interface/Layout Guidelines|layout section]].
 
Icons should be developed and saved at Standard (S) size, though their actual size and appearance in the interface may change dynamically.  When developed at standard size, icons should fit loosely within the 3 x 3 icon-safe subcell of a standard 75px grid cell, as specified in the [[Design Team/Human Interface Guidelines/The Sugar Interface/Layout Guidelines|layout section]].
 
| display = block }}
 
| display = block }}
 +
|}
    
Cabe destacar que cuando la interfaz retamaña los iconos, los bordes (o filetes) no permanecen necesariamente proporcionales al tamaño general del icono. Esto garantiza que el peso del borde permanece suficientemente visible en todos los tamaños y así poder representar su peso y color, aunque esto puede limitar la granularidad con la cual usar los bordes, que pueden fusionarse en tamaños pequeños. La siguiente tabla relaciona los varios tamaños de iconos con sus correspondientes factores de escala y el peso de los bordes. Recomendamos probar sus iconos en los tamaños XS, S, y M para poder ajustar sus apariencias para una optima legibilidad.
 
Cabe destacar que cuando la interfaz retamaña los iconos, los bordes (o filetes) no permanecen necesariamente proporcionales al tamaño general del icono. Esto garantiza que el peso del borde permanece suficientemente visible en todos los tamaños y así poder representar su peso y color, aunque esto puede limitar la granularidad con la cual usar los bordes, que pueden fusionarse en tamaños pequeños. La siguiente tabla relaciona los varios tamaños de iconos con sus correspondientes factores de escala y el peso de los bordes. Recomendamos probar sus iconos en los tamaños XS, S, y M para poder ajustar sus apariencias para una optima legibilidad.
Line 84: Line 90:  
Notice that when the interface scales your icons, strokes do not necessarily scale proportionally to the overall icon size.  This ensures that the stroke weight remains visible enough at all sizes to convey its weight and color, but it may also limit the granularity with which you use strokes, which could begin to blend together at smaller sizes.  The following chart relates the various icon sizes to their corresponding scale factors and stroke weights.  We strongly suggest that you try rendering your icons at XS, S, and M sizes in order to tweak their appearance for optimal legibility.
 
Notice that when the interface scales your icons, strokes do not necessarily scale proportionally to the overall icon size.  This ensures that the stroke weight remains visible enough at all sizes to convey its weight and color, but it may also limit the granularity with which you use strokes, which could begin to blend together at smaller sizes.  The following chart relates the various icon sizes to their corresponding scale factors and stroke weights.  We strongly suggest that you try rendering your icons at XS, S, and M sizes in order to tweak their appearance for optimal legibility.
 
| display = block }}
 
| display = block }}
 +
    
{|border=1 cellpadding=1 cellspacing=0 style="margin: 1em auto 1em auto; border: 1px #666666 solid; border-collapse: collapse; background: #f9f9f9;"
 
{|border=1 cellpadding=1 cellspacing=0 style="margin: 1em auto 1em auto; border: 1px #666666 solid; border-collapse: collapse; background: #f9f9f9;"

Navigation menu