1. Interfaces Grficas.

Introduccin.
En el presente trabajo se menciona ms a fondo el tema de las Interfaces Grficas de Usuario, as como los criterios de su uso mientras se abordan temas como principios de composicin, colores de uso, disposicin, alineaciones, espaciados y el uso de algunos de sus controles funcionales.

Objetivos.
Conocer los elementos que se deben considerar en la generacin de las Interfaces
Grficas de Usuario.

Tener presente los elementos de control que podr incluir en las Interfaces. Conocer algunas de las propiedades y eventos de los elementos mencionados. Conocer algunos ejemplos de aplicacin de los elementos mencionados.

Antecedentes.
Tipos de Interfaces (Front-end, back-end). Bsicamente existen dos tipos de interfaces, las interfaces estticas y las interfaces dinmicas. Las interfaces estticas son aquellas que no tienen cambio y son difciles de modificar y por su ubicacin pueden ser:
De propsito especial (stand-alone). Centralizado (novell). Distribuido (internet).

Las interfaces dinmicas son aquellas que cambian de acuerdo a los requerimientos del usuario y por su uso pueden ser:
Front-End. Back-End.

Interfaz Front-End. Es una aplicacin donde los usuarios interactan directamente con las funciones del sistema, cubre todas las interfaces con las cuales un usuario interacta con los sistemas, ya sean locales o remotos, sus funciones principales son:
Diseo de formatos. Presentacin. Lgica de la aplicacin. Manipulacin de datos. Herramientas de consulta. Utileras/mens

Interfaz Back-End. Es un conjunto de elementos (programas) que sirven como complemento de una interfaz Front-End. Ayuda en la administracin, control y configuracin de los sistemas teniendo un acceso directo a los recursos (base de datos, comunicaciones, servidores, etc.), que el sistema requiere, entre sus funciones principales se tienen:
Administracin de la memoria. Seguridad. Manejo de base de datos. Procesamiento remoto.
Tema III Interfaces Grficas.

Pgina 1

3.1. Interfaces Grficas Orientadas al Usuario.

Un GUI es una representacin grfica en la pantalla del ordenador de los programas, datos y objetos, as como de la interaccin con ellos. En general, las GUI presentan informacin en reas rectangulares en la pantalla llamadas ventanas. Las ventanas se pueden sobreponer. Al usuario se le permite manipular la ventana y su contenido, puede cambiar el tamao y la posicin. Las ventanas pueden contener objetos los cuales pueden ser seleccionados haciendo clic con el botn del ratn una vez que el indicador del ratn se encuentra sobre el dibujo del objeto al cual se le llama icono. El tamao total de una ventana puede ser reducido a un icono, y el usuario puede restablecer la ventana a su tamao normal. GUI`s avanzados eliminan completamente la necesidad de teclear comandos, permitindole al usuario seleccionar comandos desde mens usando el ratn o teclas de funcin. Las ventanas tambin pueden contener barras de desplazamiento y botones. En la programacin con GUI`s se debe estar atento para aceptar y procesar eventos asncronos iniciados por el usuario o por el sistema. Un GUI proporciona al usuario las herramientas para realizar sus operaciones, ms que una lista de las posibles operaciones que el ordenador es capaz de hacer, las caractersticas de estas Interfaces Graficas de Usuario son:
Posee un monitor grfico de alta resolucin. Posee un dispositivo apuntador (tpicamente un ratn). Promueve la consistencia de la interfaz entre programas. Los usuarios pueden ver en la pantalla los grficos y textos tal como se vern impresos. Sigue el paradigma de la interaccin objeto-accin. Permite la transferencia de informacin entre programas. Se puede manipular en la pantalla directamente los objetos y la informacin. Provee elementos de interfaz estndar como mens y dilogos. Existe una muestra visual de la informacin y los objetos (iconos y ventanas). Proporciona respuesta visual a las acciones del usuario. Existe informacin visual de las acciones y modos del usuario/sistema (mens, paletas). Existen controles grficos (widgets) para la seleccin e introduccin de la informacin. Permite a los usuarios personalizar la interfaz y las interacciones. Proporciona flexibilidad en el uso de dispositivos de entrada (teclado/ratn). Una caracterstica importante es que el GUI permite manipular los objetos e informacin de la pantalla, no slo presentarla.

Para usar un GUI, los usuarios deben conocer (o aprender) una serie de conceptos: organizacin del sistema (ficheros, directorios en Win95), diferentes tipos de iconos y efecto de las acciones sobre ellos, elementos bsicos de una ventana, uso de los controles del GUI, uso del ratn. Los GUI usan el estilo objeto-accin, en contraposicin al, accin-objeto de los CUI o las interfaces de men. El usuario selecciona un objeto, y despus la accin a realizar sobre dicho objeto. Los objetos son el principal foco de atencin del usuario, lo cual resulta ms natural y prximo a su modelo mental.

Tema III Interfaces Grficas.

Pgina 2

3.2. Criterios de Uso.

El proceso de incluir tantas funciones en un solo programa gener un grave problema: cmo poner todas estas posibilidades en manos del usuario, sin obligarlo a hacerse de un complejo manual o a tomar un curso especializado. La solucin vino con el uso de interfaces grficas. La interfaz de usuario, o interfaz grfica de usuario, es la forma como aparecen en pantalla los comandos de un programa: por medio de botones, colores, smbolos y ventanas. La interfaz tiene dos principales "misiones": la primera es informar al usuario acerca de los elementos que tiene a su disposicin y para qu sirven, y la segunda es brindar la posibilidad de elegir entre las distintas opciones. Dado entonces ser necesario el uso de un Interfaz de Usuario, cuando el uso del sistema requiera de: Conocer instrucciones complejas.
El manejo de innumerables opciones de eventos a aplicar a los objetos. Entre otras.

3.3. Principios de Composicin en el Diseo de las Ventanas.

Al disear Interfaces de Usuario deben tenerse en cuenta diversos factores como son:
1) Humanos. 2) Adecuacin. 3) Motivacin. 1) Humanos.

Las habilidades cognitivas y de percepcin de las personas, y adaptar el programa a ellas. As, una de las cosas ms importantes que una interfaz puede hacer es reducir la dependencia de las personas de su propia memoria, no forzndoles a recordar cosas innecesariamente (por ejemplo, informacin que apareci en una pantalla anterior) o a repetir operaciones ya realizadas (por ejemplo, introducir un mismo dato repetidas veces). La persona tiene unas habilidades distintas de la mquina, y sta debe utilizar las suyas para soportar las de aquella. Debern tenerse en cuenta las siguientes opciones:

Velocidad de Aprendizaje.- Se pretende que la persona aprenda a usar el sistema lo ms pronto posible. Velocidad de Respuesta.- El tiempo necesario para realizar una operacin en el sistema. Tasa de errores.- Porcentaje de errores que comete el usuario. Retencin.- Cunto recuerda el usuario sobre el uso del sistema en un perodo. de tiempo. Satisfaccin.- Se refiere a que el usuario est a gusto con el sistema.

2) Adecuacin
Tema III Interfaces Grficas.

Pgina 3

 Caractersticas Fsicas.- Cada persona tiene diferentes caractersticas fsicas. Hay

algunas personas que no les gustan los teclados mientras que a otras s. Es por eso que hay teclados ergonmicos. Lo mismo sucede con el mouse. Ambiente.- El lugar donde va a ser usado el sistema. Cada interfaz tiene que adecuarse al lugar. Visibilidad.- Tomar en cuenta la cantidad de iluminacin del lugar. Se refleja el brillo en la pantalla? Personalidad.- De acuerdo a la edad, nivel socio-econmico, etc. Cultura.- Los japoneses no tienen las mismas pantallas, ventanas, etc. Este factor es importante si el mercado para el sistema es a nivel internacional.

Segn la funcin tenemos: 3) Motivacin

Sistemas Vitales.- Son de vida o muerte; muchas personas dependen de ellos. Ejemplo: un sistema para reactores nucleares. Este sistema trabaja en tiempo real, y es de suma importancia la seguridad y efectividad del mismo. Sistemas Comerciales e Industriales.- Sirven para aumentar la productividad y vender ms. Sistemas de Oficina, Hogar y Juegos.- Factor importante: el mercado a quien est dirigido; tienen que ser muy amigables y satisfacer al cliente. Sistemas de Investigacin.- Realizan tareas muy especficas y tratan de imitar el medio en el que se desenvuelve el usuario.

3.4. Color.
Para mencionar el tema de los colores en las Interfaces de Usuario es sumamente necesario describir el punto de la psicologa que se aplica a los colores. La Psicologa del Color es el campo de estudio que est dirigido a analizar el efecto del color en la percepcin y la conducta humana. Se ha hablado desde diferentes campos como la literatura (en las obras del alemn Goethe), la pintura (el trabajo pictrico y terico de Kandisnky), y por supuesto la psicologa. Llegando a la conclusin de que los colores desprenden diferentes expresiones en s mismos, capaces de influir en el ambiente y transmitir diversas sensaciones. Colores y su Sensacin:
Rojo. Usado con moderacin, el rojo es excelente para centrar la atencin de las personas. Est relacionado con el fuego y sugiere calor y excitacin. Rosa. Las mezclas de rojo con blanco producen un alto efecto relajante, se asocia con el romanticismo y la feminidad, por tanto distrae la mente de trabajos serios y de responsabilidad. Naranja. Por ser ms clido que el amarillo acta como estimulante de las personas tmidas y tristes. Simboliza entusiasmo y exaltacin, usado en pequeas cantidades suele ser muy benfico, pero en amplias extensiones se convierte en impulsivo y agresivo, por esto es mejor evitarlo en lugares u ocasiones donde se requiera concentracin. Blanco. Por ser la suma o sntesis de todos los colores, el blanco simboliza la unidad, el absoluto, la inocencia. Ayudar a despejar la mente y aunque puede cansar la vista tambin activa el intelecto a la vez que relaja.
Tema III Interfaces Grficas.

Pgina 4

Negro. El negro representa el poder, la elegancia, la formalidad, la muerte y el misterio. Es el color ms enigmtico y se asocia al miedo y a lo desconocido ("el futuro se presenta muy negro", "agujeros negros"...). El negro representa tambin autoridad, fortaleza, intransigencia. Tambin se asocia al prestigio y la seriedad. Verde. Es aconsejado para salones de nios de preescolar y primaria. Es el color de la vida vegetal y de la primavera, de lo que crece y da frutos, por tanto ayuda a generar nuevas ideas y a ser creativos. En salones de estudiantes adolescentes no es aconsejable pues representa a Peter Pan, el nio que nunca quiso crecer. Amarillo. Se asocia con gran inteligencia. Es un color clido, es el color de la luz, del sol, de la accin, del poder. Los tonos del amarillo suelen interpretarse como joviales, afectivos y excitantes. Azul. El azul representa la profundidad, por tanto es un tono introspectivo y sedante. Este color se aconseja, por ejemplo, para materiales de estudio, como forros de libros, cubiertas y rayados de cuadernos, pues ayuda a la concentracin en las tareas y hace el trabajo agradable por su efecto sedante. Prpura. El prpura aporta la estabilidad del azul y la energa del rojo. Se asocia a la realeza y simboliza poder, nobleza, lujo y ambicin. Sugiere riqueza y extravagancia. El color prpura tambin est asociado con la sabidura, la creatividad, la independencia, la dignidad. Gris. Iguala todas las cosas y no influye en los otros colores. Puede expresar elegancia, respeto, desconsuelo, aburrimiento, vejez. Es un color neutro y en cierta forma sombro. Ayuda a enfatizar los valores espirituales e intelectuales.

Debido a esto ser necesario que se elija correctamente el color a utilizar en la Interfaz de Usuario que estemos generando.

3.5. Disposicin de la Ventana.

En el diseo de las ventanas de una aplicacin o sitio web, se debe tomar en cuenta los actitudes de los usuarios. Un estudio realizado con la utilizacin de la tecnologa Eye-Tracking la cual permite hacer un seguimiento de donde se dirige la visin de las personas cuando navegan por un sitio. Mientras evaluaron los movimientos de ojo de los participantes a travs de varios diseos de pginas de inicio noticiosas, los investigadores del Eyetrack III notaron un patrn comn: los ojos primero se fijaban con ms frecuencia en la parte superior izquierda de la pgina, luego se quedaban en esa rea antes de ir de izquierda a derecha. Slo despus de leer con atencin la porcin superior de la pgina por algn tiempo hicieron que sus ojos exploraran ms abajo. Las ventanas de las GUI pueden estar organizadas de dos formas: Organizacin Esttica. Los controles se disponen fsicamente en la interfaz posicionndolos absolutamente, es decir, el programador debe poner sus dimensiones y posicin en la ventana. Si se permite que el usuario pueda redimensionar la ventana, se debe capturar el evento window-resize, y luego cambiar explcitamente el tamao y la posicin de cada control. Mientras se hace esto, hay ver que los controles todava tienen una buena presentacin, no se traslapan y continan contenidos entre los lmites de la ventana.

Organizacin Dinmica. Se hace necesario disponer de una estructura que decida cmo mover y redimensionar los controles basada en un patrn
Tema III Interfaces Grficas.

Pgina 5

predeterminado, sin la intervencin del programador. Han existido varias propuestas para enfrentar esta situacin, y la forma recomendada de lidiar con diseos complicados hoy da es mediante el uso de sizers (dimensionadores). Los controles son organizados de manera dinmica por el algoritmo de los sizers.

Elementos de una ventana.

Barra de Ttulo: donde aparece el nombre de la ventana (Calculadora de GNOME). El botn a la izquierda es para Miniaturizar, el botn a la derecha para Cerrar. Arrastrando con el ratn sobre la barra de ttulo se desplaza la ventana. Con clic derecho sobre el ttulo se despliega el men de ventana. Barra de Tamao: en la parte inferior de la ventana. Arrastrando el ratn sobre las secciones de las puntas cambia el tamao de la ventana en direccin diagonal u horizontal hacia un lado u otro; arrastrando con el ratn sobre la seccin central se cambia el tamao slo en direccin vertical. rea Cliente: donde se muestra la aplicacin en s, en este caso la calculadora. Barra de Mens. Los mens son listas de comandos, atributos, o cualquier tipo de elementos, agrupados de forma estructurada normalmente inscritos dentro de una barra de mens o de un rea especfica en la interfaz, los cuales pueden ser activados y posibilitan la ejecucin de los tems que contienen obteniendo una respuesta inmediata al respecto. Iconos. Los iconos en el contexto de las interfaces grficas son signos esquemticos que representan algn tipo de fichero, carpeta, aplicacin, o dispositivos de un sistema informtico. Los iconos, tal cual se ha defendido en la primera parte de este trabajo, son signos interactivos y por lo tanto inscritos en una gramtica especial que debe ser aprendida por el usuario. Los iconos usados en el interfaz, provienen principalmente de la representacin metafrica realizada en el PARC inscritos dentro de la metfora del escritorio. A su vez stos se inspiran en los signos desarrollados en la comunicacin grfica de las seales viales y dems signos codificados por la cultura occidental hasta hoy. Etiquetas Textuales. Un elemento no menos importante en la interaccin con los ordenadores a travs de las interfaces grficas son los signos textuales. La tipografa digital podra constituir un trabajo de investigacin en s y constituye un campo relativamente reciente an no excesivamente investigado. Botones. Un botn es un objeto de control sobre la interfaz que posibilita introducir un dato de confirmacin al sistema. Acta como metfora visual y funcional de los botones incluidos en los dispositivos tecnolgicos. Su gramtica visual tiene ya un recorrido histrico con posibilidad de ser estudiada. Botones en forma de radio (RadioBottons). Son botones redondos que posibilitan ser sealados a travs de la accin del usuario. Normalmente son usados en formularios o mens, para dar eleccin a elegir un tem de una lista. Botones de confirmacin (checkbox). Son botones similares a los botones de radio, pero con forma cuadrada. Se representan de forma hueca, y suelen ser usados para seleccionar tems en una lista. Cuadros de Texto. Los elementos de entrada de texto, nos indican en qu lugar del interfaz puede ser usado el teclado. Cuando todo el interfaz se convierte en escritorio, surgen las aplicaciones especficas que permiten introducir texto. Pero existen partes de ciertas aplicaciones que requieren un rea que posibilite la introduccin de informacin textual por parte del usuario. En este contexto es en el que los campos de texto cobran sentido. Combo de texto (combo box). El combo de texto, es un elemento formado en un estado inicial por un campo de texto y una pestaa. El usuario puede introducir texto sobre el campo, pero si pulsa la pestaa despliega una ventana completa con elementos de
Tema III Interfaces Grficas.

Pgina 6

navegacin incluida. Es un elemento combinado que dispone de varias posibilidades de interaccin y de acceso a la informacin introducida.

Disposicin de los elementos:

Cmo se colocan los elementos en la pantalla. Induce relaciones entre elementos. Permite dar ms importancia a ciertas cosas.

3.6. Alineacin.
La alineacin de los objetos tiene una gran importancia en el diseo de las interfaces, ya que en la mayora de las lenguas occidentales se lee de izquierda a derecha, de arriba hacia abajo. Esa misma regla se tiene que tomar en cuenta en alineacin de los diferentes objetos en la pantalla que adems tienen que estar acomodados en orden, para que la interpretacin de las funcionalidades sea ms fcil para el usuario. Por ejemplo si alguien se sienta delante un escritorio bien ordenado, ser mucho ms eficiente su trabajo, si encontrara un escritorio desordenado, lleno de objetos encimados. Eso mismo pasa con la alineacin de los objetos contenidos en las ventanas de los programas. Deben estar diseados con mucho cuidado tomando en cuenta las costumbres de los usuarios. Dicho sea de paso tambin deber un orden de tabulacin correcto para que el usuario pueda navegar entre las diferentes opciones sin necesidad del uso del ratn. La Alineacin ayuda a conseguir equilibrio, armona, unidad y modularidad. Una alineacin exacta y consistente es la manera ms fcil de mejorar la esttica de la interfaz

3.7. Espaciado.
El manejo del espacio es de gran relevancia pues deben acoplarse las funciones de fondo, navegacin, ventana de informacin y orientacin, que son aspectos bsicos que se deben clarificar y explicar durante el inicio de la interfaz para que no se conviertan en factores distractores o hasta molestos a travs del recorrido de la interfaz.

3.8. Mens.
Un men es una lista de opciones que se muestran en la pantalla o en una ventana de la pantalla para que los usuarios elijan la opcin que deseen (vase ejemplo). Los mens permiten dos cosas: navegar dentro de un sistema, presentando rutas que llevan de un sitio a otro, y seleccionar elementos de una lista, que representan propiedades o acciones que los usuarios desean realizar sobre algn objeto. Las interfaces de mens aparecen cuando el ordenador se vuelve una herramienta de usuario y no slo de programadores. Las actuales interfaces grficas orientadas a los usuarios utilizan este tipo de interfaces (los distintos estilos de interfaces no son mutuamente exclusivos).

Tema III Interfaces Grficas.

Pgina 7

Aunque no hay estndares definidos para la Usabilidad, depende en cierta forma del espacio donde se desenvuelve el navegante. Pero lo importante en este caso es que el usuario no se deje consumir ni dominar por el sitio, es decir que sea l mismo que tome el control de la navegacin por medio de un aprendizaje sencillo y el dominio de los elementos necesarios, para encontrar finalmente y en el menor tiempo posible, lo que busca. Ejemplo de un men drop down de una aplicacin.

3.9. Cuadros de texto, botones, tablas, etiquetas etctera.

En la generacin de Interfaces Grficas de Usuario, se emplean distintos elementos de control, y para este caso se toma como referencia la coleccin de controles de Visual Basic. 3.9.1. TextBox.
Las aplicaciones utilizan el control TextBox para que los usuarios puedan escribir una cadena. El control TextBox puede enmascarar los datos correspondientes a contraseas si el dispositivo del usuario admite esta funcionalidad. Un control TextBox debe colocarse en un control Form o Panel, o dentro de la plantilla de un control de una pgina Web de ASP.NET Mobile.

Cuadros de Texto.

3.9.2. Botones. 3.9.2.1. Botones de Comando. CommanButton.

Los botones de comando suelen emplearse para iniciar un evento que lleva a cabo una accin, como cerrar un formulario, moverse a otro registro, imprimir un informe, etc. Utilice el control CommandGroup para crear un conjunto de botones de comando que pueden manipularse individualmente o como grupo.
Utilice la propiedad Caption para especificar el texto que aparece en un botn de comando. Utilice la propiedad Picture para especificar una imagen para un botn de comando. Puede elegir un botn de comando al hacer clic en l y si est establecida la propiedad Default en el valor verdadero (.T.), al presionar la tecla ENTRAR cuando est seleccionado el botn de comando. Si la propiedad Cancel del botn de comando se establece en el valor verdadero (.T.), puede elegir el botn de comando al presionar la tecla ESC.

3.9.2.2.

Botones de Opcin.

RadioButton, OptionButton.
El control OptionButton de Visual Basic 6.0 se ha reemplazado por el control RadioButton de formularios Windows Forms
Tema III Interfaces Grficas.

Pgina 8

en Visual Basic 2005. Los nombres de algunas propiedades, mtodos, eventos y constantes son diferentes y, en algunos casos, existen diferencias de comportamiento. Diferencias conceptuales
En Visual Basic 6.0, el evento Click del control OptionButton slo se produca cuando su propiedad Value se cambiaba a True. En Visual Basic 2005, el evento CheckedChanged del control RadioButton se produce cada vez que el valor de la propiedad Checked cambia a True o False.

3.9.2.3.

Casillas de Verificacin.

CheckBox.
El control CheckBox de los formularios Windows Forms indica si una condicin determinada est activada o desactivada. Se utiliza habitualmente para presentar al usuario una seleccin de tipo S/No o Verdadero/Falso. Puede utilizar grupos de casillas de verificacin para mostrar mltiples opciones entre las cuales el usuario puede elegir una o ms. Es similar al control RadioButton aunque en este caso puede seleccionarse cualquier nmero de controles CheckBox agrupados.

3.9.3. DataGridView.

Tablas.

El control DataGridView proporciona una forma eficaz y flexible de mostrar datos en formato de tabla. Puede utilizar el control DataGridView para mostrar vistas de slo lectura de una cantidad pequea de datos o puede ajustar su tamao para mostrar vistas modificables de conjuntos muy grandes de datos. Puede ampliar el control DataGridView de varias maneras para crear comportamientos personalizados en las aplicaciones. Por ejemplo, puede especificar mediante programacin sus propios algoritmos de ordenacin y crear sus propios tipos de celdas. Puede personalizar con facilidad la apariencia del control DataGridView seleccionando entre varias propiedades. Se pueden utilizar muchos tipos de almacenes de datos como origen de datos o el control DataGridView puede operar sin tener ningn origen de datos enlazado.

3.9.4. Label.

Etiquetas.

Un control Label es un control grfico que muestra texto que no puede cambiarse directamente. Sin embargo, puesto que un control Label tiene un amplio conjunto de propiedades, eventos y mtodos en comn con otros controles, puede responder a eventos y cambiarse dinmicamente en tiempo de ejecucin. Para asignar una tecla de acceso a una etiqueta, incluya una barra inversa y un signo menor que (\<) en el ttulo justo delante del carcter que desee designar como tecla de acceso. Cuando se muestre la etiqueta, este carcter aparecer subrayado. Al presionar la tecla de acceso de una etiqueta se activa el siguiente control en el orden de tabulacin. Utilice la propiedad TabIndex para asignar un orden de tabulacin a una etiqueta.
Tema III Interfaces Grficas.

Pgina 9

3.9.5. Otros. 3.9.5.1. Cuadros de Lista. ListBox.

El control ListBox permite a los usuarios seleccionar uno o varios elementos de una lista predefinida. Se diferencia de un control DropDownList en que puede mostrar varios elementos a la vez y, de manera opcional, permite que el usuario pueda seleccionar varios elementos.

3.9.5.2.

Cuadros Combinados.

ComboBox.
Cuando se selecciona un control ComboBox, se abre y muestra una lista de elementos en la que se puede elegir uno. Un control ComboText combina las caractersticas de un control TextBox y un control ListBox. Se puede escribir la informacin en la parte del cuadro de texto o seleccionar un elemento en la parte de cuadro de lista del control. Para deshabilitar un elemento de un cuadro combinado, inserte al principio de la expresin una sola barra diagonal inversa ("\"). A causa de esta funcionalidad, las barras invertidas se tratan de forma diferente para este control. Por cada barra diagonal inversa que necesite mostrar en el texto, deber insertar dos. Por ejemplo, el cdigo siguiente contiene un elemento de cuadro combinado que incluye una ruta UNC.

3.9.5.3.

Marco.

GroupBox.
Los controles GroupBox de formularios Windows Forms se utilizan para proporcionar un agrupamiento identificable para otros controles. Normalmente, los cuadros de grupo se utilizan para subdividir un formulario por funciones. Por ejemplo, podra tener un formulario de pedido que especifique opciones de envo, como el servicio de transporte urgente que se va a utilizar. La agrupacin de todas las opciones en un cuadro de grupo ofrece al usuario una pista visual lgica. Los
Tema III Interfaces Grficas.

Pgina 10

controles GroupBox y Panel son similares; sin embargo, el control GroupBox es el nico de los dos que muestra un ttulo, y el control Panel es el nico de los dos que puede tener barras de desplazamiento.

3.9.5.4. ContextMenuStrip.

Men.
un men

El control ContextMenuStrip proporciona contextual que se asocia a un control.

3.10. Glosario de Propiedades de los Controles.

Propiedad Accelerator Establece o recupera la tecla de aceleracin para un control. Sintaxis objeto.Accelerator [= String] Propiedad Alignment Especifica la posicin de un control con respecto a su ttulo. Sintaxis objeto.Alignment [= fmAlignment] Propiedad AutoSize Especifica si un objeto cambia de tamao automticamente para mostrar todo su contenido. Sintaxis objeto.AutoSize [= Boolean] Propiedad AutoTab Especifica si se produce una tabulacin automtica cuando el usuario escribe el nmero mximo permitido de caracteres en un control TextBox o en la parte del cuadro de texto de un control ComboBox. Sintaxis objeto.AutoTab [= Boolean] Propiedad AutoWordSelect Especifica si una palabra o un carcter es la unidad bsica utilizada para extender la seleccin. Sintaxis objeto.AutoWordSelect [= Boolean] Propiedad BackColor Especifica el color de segundo plano del objeto. Sintaxis objeto.BackColor [= Long] Propiedad BackStyle Devuelve o establece el estilo de fondo para un objeto. Sintaxis objeto.BackStyle [= fmBackStyle] Propiedad Cancel Devuelve o establece un valor indicando si un botn de comando es el botn Cancelar en un formulario. Sintaxis
Tema III Interfaces Grficas.

Pgina 11

objeto.Cancel [= Boolean] Propiedad Caption Texto descriptivo que identifica o describe a un objeto. Sintaxis objeto.Caption [= String] Propiedad ControlTipText Especifica el texto que se muestra cuando el usuario mantiene brevemente el puntero del mouse sobre un control sin hacer clic. Sintaxis objeto.ControlTipText [= String] Propiedad Default Designa el botn de comando predeterminado de un formulario. Sintaxis objeto.Default [= Boolean] Propiedad Enabled Especifica si un control puede recibir el enfoque y responder a eventos generados por el usuario. Sintaxis objeto.Enabled [= Boolean] Propiedad ForeColor Especifica el color de primer plano de un objeto. Sintaxis objeto.ForeColor [= Long] Propiedades Height y Width El alto o el ancho, en puntos de un objeto. Sintaxis objeto.Height [= Single] objeto.Width [= Single] Propiedades Left y Top La distancia entre un control y el borde izquierdo o superior del formulario que lo contiene. Sintaxis objeto.Left [= Single] objeto.Top [= Single] Propiedad Locked Especifica si se puede editar un control. Sintaxis objeto.Locked [= Boolean] Propiedad MatchRequired Especifica si un valor introducido en la parte de texto de un control ComboBox debe coincidir con una entrada de la parte de lista existente del control. El usuario puede introducir valores no coincidentes, pero no puede abandonar el control hasta que se introduzca un valor coincidente. Sintaxis objeto.MatchRequired [= Boolean] Propiedad MaxLength Especifica el nmero mximo de caracteres que un usuario puede introducir en un control TextBox o ComboBox. Sintaxis objeto.MaxLength [= Long] Propiedad MouseIcon Asigna un icono personalizado a un objeto. Sintaxis objeto.MouseIcon = LoadPicture( ruta) Propiedad MousePointer Especifica el tipo de puntero del mouse mostrado cuando el usuario sita el mouse sobre un objeto en particular. Sintaxis objeto.MousePointer [= fmMousePointer] Propiedad MultiLine
Tema III Interfaces Grficas.

Pgina 12

Especifica si un control puede aceptar y mostrar mltiples lneas de texto. Sintaxis objeto.MultiLine [= Boolean] Propiedad Name Especifica el nombre de un control u objeto, o el nombre de una fuente asociada al objeto Font. Sintaxis Para el objeto Font Font.Name [= String] Para todos los dems controles y objetos objeto.Name [= String] Propiedad PasswordChar Especifica si se muestran los caracteres marcadores de posicin en lugar de los caracteres introducidos en un control TextBox. Sintaxis objeto.PasswordChar [= String] Propiedad Picture Especifica el mapa de bits que se muestra en un objeto. Sintaxis objeto.Picture = LoadPicture( ruta ) Propiedad RowSource Especifica el origen que proporciona una lista para un control ComboBox o ListBox. Sintaxis objeto.RowSource [= String] Propiedad ScrollBars Especifica si un control, formulario o pgina tiene barras de desplazamiento verticales, horizontales o ambas. Sintaxis objeto.ScrollBars [= fmScrollBars] Propiedad TabIndex Especifica la ubicacin de un nico objeto en el tab order. Sintaxis objeto.TabIndex [= Integer] Propiedad TabStop Indica si un objeto puede recibir el enfoque cuando el usuario presiona la tecla TAB para ir al mismo. Sintaxis objeto.TabStop [= Boolean] Propiedad Text Devuelve o establece el texto en un control TextBox o del rea editable de un control ComboBox. Cambia la fila seleccionada en un control ListBox. Sintaxis objeto.Text [= String] Propiedad TextAlign Especifica cmo se alinea el texto en un control. Sintaxis objeto.TextAlign [= fmTextAlign] Propiedades Left y Top La distancia entre un control y el borde izquierdo o superior del formulario que lo contiene. Sintaxis objeto.Left [= Single] objeto.Top [= Single] Propiedad Value Especifica el estado o el contenido de un control determinado. Sintaxis objeto.Value [= Variant] Propiedad Visible Especifica si un objeto es visible o est oculto. Sintaxis objeto.Visible [= Boolean]
Tema III Interfaces Grficas.

Pgina 13

Propiedades Height y Width El alto o el ancho, en puntos de un objeto. Sintaxis objeto.Height [= Single]
objeto.Width [= Single]

3.11. Conclusin.
Con cada uno de los temas abordados a lo largo de este trabajo de investigacin, se han alcanzado los conocimientos necesarios para que inicie en la creacin de Interfaces Grficas de Usuario, siempre tomando en cuenta los elementos que pueden ser utilizados, su distribucin, alineacin, justificacin de colores, as como la herramienta que necesito emplear para cada caso. Tan solo resta iniciar con mis primeros usos de algn lenguaje de programacin, si as se desea puede ser Visual Basic que fue la opcin utilizada para la descripcin de los controles.

3.12. Referencias.
http://www.monografias.com/trabajos6/inus/inus.shtml http://www.itistmo.edu.mx/Pag%20Informatica/APUNTES_archivos/page0006.htm http://fcaenlinea1.unam.mx/clases_virtuales/informatica/1267.html http://www.mailxmail.com/curso-informatica-administracion-publica-3/interfaz-grafica http://www.xtec.es/~aromero8/acuarelas/pscologia.htm http://es.wikipedia.org/wiki/Psicolog%C3%ADa_del_color http://nuestrapizarra.zobyhost.com/2010/10/15/diseno-de-interfaz-usando-sizers/ http://www.chr5.com/investigacion/investiga_igu/igu_aproximacion_semio-cognitiva_by_chr5.pdf http://www.azc.uam.mx/cyad/procesos/uea_s/mat_didac/web/gui_design.pdf http://msdn.microsoft.com/es-es/library/f9wh6174(VS.80).aspx http://msdn.microsoft.com/es-es/library/cc483405(VS.71).aspx http://msdn.microsoft.com/es-es/library/kd7e4yte(VS.80).aspx http://msdn.microsoft.com/es-es/library/dzddyc7z(VS.80).aspx http://msdn.microsoft.com/es-es/library/e0ywh3cz(VS.80).aspx http://msdn.microsoft.com/es-es/library/cc466030(VS.71).aspx http://msdn.microsoft.com/es-es/library/cc295286.aspx http://msdn.microsoft.com/es-es/library/cc483401(VS.71).aspx http://msdn.microsoft.com/es-es/library/scx9dha5(VS.80).aspx http://msdn.microsoft.com/es-es/library/ms229641(VS.80).aspx

Tema III Interfaces Grficas.

Pgina 14