La Interfaz Gráfica de Usuario, conocida en inglés como Graphical User Interface (GUI) es la forma en que un usuario puede interactuar con un dispositivo informático sin introducir comandos de texto en una consola. Es un entorno visual amigable que permite al usuario realizar cualquier acción sin necesidad de tener conocimientos de programación.


Un ejemplo del GUI son los entornos Windows, MacOs o Android, gracias a los cuales se pueden enviar comandos a través de gestos o movimientos de ratón, sin necesidad de introducir ningún código.

                     EVOLUCCION:


Una de las primeras novedades que se integró cuando se empezó a usar la GUI fue el ratón o mousse. Hoy, en sí, es el elemento más corriente que encontramos a la hora de usar un ordenador o dispositivo informático.



En la actualidad los elementos visuales de una interfaz son cada vez más intuitivos. Los diseñadores se esfuerzan en que el usuario pueda ser capaz de hacer uso de ellos sin un aprendizaje previo.

La claridad de la interfaz evita que el usuario cometa errores y da una perfecta experiencia al usuario. Claridad significa que la información es transmitida de manera precisa.

 

Concisa

En perfecta simbiosis y armonía con la cualidad anterior, la información debe ser clara y concisa para que el usuario la capte de la manera más eficiente posible.

 

Coherente

La coherencia ayudará a tus usuarios a desarrollar patrones de uso, y poco a poco, aprenderán la función de los diversos botones, iconos y otros elementos propios de la interfaz. El usuario debe sentirse cómodo manejando la interfaz de usuario.

 

Legible

Usa un lenguaje simple para ayudar a la rápida lectura por parte del usuario. Esto ayudará también a que el usuario se acostumbre más rápidamente a las diversas funciones que posee la interfaz.

 

Interactiva

Una buena interfaz tiene que ser rápida y además ofrecer información al usuario sobre las tareas que se están realizando en tiempo real.

 

Flexible

Una buena interfaz debería posibilitar al usuario restaurar aquellos elementos que hayan sido borrados. Lo ideal es que la interfaz de usuario genere copias de seguridad.

 

Familiar

El usuario debe sentirse familiarizado con la mayoría de los elementos. Además, es muy importante es ofrecer atajos hacia los elementos más utilizados.

 

Eficiente

Una interfaz en la que el usuario sea capaz de lograr lo que desea al momento, sin molestarlo con opciones adicionales sobre lo que desea hacer, que demoran el proceso y dañan la experiencia del usuario.

 

Atractiva

Además de funcionalidad, la interfaz de usuario ha de ser atractiva, ya que cada vez más personas están pendientes del diseño.

 

La funcionalidad de acoplamiento de ventanas es similar al acoplamiento de ventanas que usa la interfaz gráfica de usuario de Visual Studio.

Las barras de control ahora son paneles:

Las barras de control ahora se conocen como paneles y derivan de la clase CBasePane. En versiones anteriores de MFC, la clase base de las barras de control.

Normalmente, la ventana de marco principal de la aplicación se representa mediante la clase CFrameWndEx o la clase CMDIFrameWndEx. El marco principal se denomina sitio de acoplamiento. Los paneles pueden tener uno de tres tipos de elementos primarios: un sitio de acoplamiento, una barra de acoplamiento o una ventana minimarco.


Sitio de acoplamiento:

El sitio de acoplamiento (o ventana de marco principal) posee todos los paneles y ventanas minimarco de una aplicación. El sitio de acoplamiento contiene un miembro CDockingManager. Este miembro mantiene una lista de todos los paneles que pertenecen al sitio de acoplamiento. La lista está ordenada de modo que los paneles creados en los bordes exteriores del sitio de acoplamiento se coloquen al principio de la lista. Cuando el marco vuelve a dibujar el sitio de acoplamiento, recorre en bucle esta lista y ajusta el diseño de cada panel para incluir el rectángulo delimitador actual del sitio de acoplamiento. Puede llamar AdjustDockingLayout o RecalcLayout cuando tenga que ajustar el diseño de acoplamiento, y el marco redirigirá esta llamada al administrador.

Barras de acoplamiento

Cada ventana de marco principal puede colocar barras de acoplamiento a lo largo de sus bordes. Una barra de acoplamiento es un panel que pertenece a una clase CDockSite. Las barras de acoplamiento pueden aceptar objetos derivados de CPane, como barras de herramientas. Para crear barras de acoplamiento cuando se inicialice la ventana de marco principal, llame a EnableDocking. Para habilitar las barras de ocultación automática, llame a EnableAutoHideBars. EnableAutoHideBars crea objetos CAutoHideDockSite y los coloca junto a cada barra de acoplamiento.

Cada barra de acoplamiento se divide en filas de acoplamiento. Las filas de acoplamiento se representan mediante la clase CDockingPanesRow. Cada fila de acoplamiento contiene una lista de barras de herramientas. Si un usuario acopla una barra de herramientas o la mueve de una fila a otra dentro de la misma barra de acoplamiento, el marco crea una fila y cambia el tamaño de la barra de acoplamiento en consecuencia, o bien coloca la barra de herramientas en una fila existente.

Ventanas mini marco:

Un panel flotante reside en una ventana minimarco. Las ventanas minimarco se representan mediante dos clases: la clase CMDITabInfo (que puede contener un solo panel) y la clase CMultiPaneFrameWnd (que puede contener varios paneles). Para hacer que un panel sea flotante en el código, llame a CBasePane::FloatPane. Una vez que un panel sea flotante, el marco creará automáticamente una ventana minimarco, la cual se convertirá en el elemento primario del panel flotante. Cuando el panel flotante se acopla, el marco restablece su elemento primario y el panel flotante se convierte en una barra de acoplamiento (en el caso de las barras de herramientas) o en un sitio de acoplamiento (en el caso de los paneles redimensionables).

Contenedores:

Todos los paneles redimensionables, cuando se acoplan entre sí, se mantienen en contenedores. Los contenedores se representan mediante la clase CPaneContainer. Cada contenedor tiene punteros a su panel izquierdo, panel derecho, subcontenedor izquierdo, subcontenedor derecho y al separador entre la parte izquierda y la derecha. (Izquierda y derecha no hacen referencia a los lados físicos, sino que identifican las ramas de una estructura de árbol). De esta manera, podemos crear un árbol de paneles y separadores, lo que permite lograr diseños complejos de paneles a los que se les puede cambiar el tamaño juntos. La clase CPaneContainer mantiene el árbol de contenedores, así como dos listas de los paneles y controles deslizantes que residen en este árbol. Normalmente, los administradores de contenedores de panel se insertan en controles deslizantes predeterminados y ventanas minimarco que incluyen varios paneles.

El diseño de interfaz es importante por varias razones. Cabe destacar el hecho de que proporciona la primera impresión del usuario en la aplicación, por lo tanto, debe fortalecer la identidad de la marca. Por la misma razón, debe ser simple e intuitivo, evitando que el primer contacto del usuario sea impulsado por la frustración.