Allan Day
aday@gnome.org
Calum Benson
Adam Elman
Seth Nickell
Colin Robertson
Orgnizar elementos dentro de una interfaz de usuario.
Daniel Mustieles
daniel.mustieles@gmail.com 2011 - 2021
Alex Puchades
alex94puchades@gmail.com 2015
Nicolás Satragno
nsatragno@gnome.org 2013
Benjamín Valero Espinosa
benjavalero@gmail.com 2011
Jorge González
jorgegonz@svn.gnome.org 2009
Rosa Elena Pérez
rozydicemiau@gmail.com 2014
Oscar Rafael Arachi
arachi910@gmail.com 2014 - 2015
Miguel Ajuech
miguel.ann.28@gmail.com 2014
Adrián Pérez Domínguez
adrian@aztli.org 2015
Celina Osorio Ochoa
chelinoska@gmail.com 2015
Dario Amigon Espinoza
daramigon@gmail.com 2015
Yenisei Ramírez Pérez
yeniseirape@gmail.com 2015
José Roberto Ramíres Mendoza
aczella@gmail.com 2015
Bernardo Sánchez Romero
b.sanchez.rom@gmail.com 2015
Emmanuel Márquez Juárez
resident3333@gmail.com 2015
David Romero Serrano
lemi136@hotmail.com 2015
Omar Garcia Guzman
garciag.omar91@gmail.com 2015
Edilberto Huerta Niño
edilberto.huerta0290@gmail.com 2015

# Distribución visual

El diseño visual de controles, información y contenido influye en que tan fácil de comprender es su aplicación, así como lo bien que se ve. Es importante reconocer que el diseño visual tiene un fuerte impacto en cuanto trabajo esta implicado en usar una aplicación - diseños pobres resultan en que usuarios tengan que poner un esfuerzo adicional, mientras que buenos diseños requieren menos esfuerzo.

Un buen estilo visual hace que la aplicación sea más atractiva y amable visualmente.

Seguir estos lineamientos de diseño visual le ayudara a producir una aplicación que sea agradable, fácil de comprender y eficiente de usar.

# Guías Generales

Un punto de alineación es una línea imaginaria vertical u horizontal a través de su ventana que toca el borde de una o más etiquetas o controles en la ventana. Minimice el número de estas: cuantas menos existan, más limpio y simple aparecerá su diseño, y más fácil de entender será para las personas.

Alinee el contenido y controles en su diseño con exactitud. El ojo es muy sensible para alinear y desalinear objetos. Si los elementos visuales no se alinean, sera difícil para algunos el analizarlos. Los elementos que no se alinean por completo serán motivo de distracción.

Sea consistente. Use la misma cantidad de espacio siempre.

Organice controles e información relacionada en grupos, y use espacio para diferenciarlos. Esto hace una interfaz mucho más fácil de leer y entender.

Como regla de oro, deje espacio entre los elementos en incrementos de 6 píxeles, aumentando hasta que la relación entre los elementos relacionados se vuelva mas distante.

Entre las etiquetas y componentes asociados, deje 12 píxeles horizontales.

Para espaciado vertical entre grupos de componentes, 18 píxeles es adecuado.

Se recomienda un espacio de 18 píxeles entre el contenido de una ventana de diálogo y el borde de la ventana.

Sangre los elementos 12 píxeles para resaltar la jerarquía y la asociación.

Evite usar marcos con bordes visibles para separar grupos de controles — use el espaciado y las cabeceras en su lugar.

Espaciado y alineación incorrectos:

Espaciado y alineación correctos:

Espaciado correcto, con unidades (píxeles):

# Alineación de las etiquetas

Si es posible, justifique las etiquetas a la derecha (vea el diagrama a continuación). Esto evitará vacíos grandes entre las etiquetas y sus controles asociados. Este tipo de justificación a la derecha no es posible si ha sangrado los controles: en este caso, se debe usar la justificación a la izquierda en su lugar.

# Jerarquia visual

Organice los elementos visuales de arriba a abajo y de izquierda a derecha. Esta es la dirección en que la gente de occidente tiende a leer una interfaz, así los elementos en la parte superior izquierda se encontrarán primero. Este orden da jerarquía a las interfaces: aquellos componentes que se ven primero se percibe que tienen prioridad sobre aquellos que vienen después. Por esta razón, deberá colocar los controles dominantes arriba y a la izquierda de los controles y contenido que ellos afectan. Los encabezados son un patrón de diseño clave en este sentido.