Interfaz gráfica de usuario 2015-2016

65
Interfaz gráfica de usuario Ms. Ing. Jairo E. Márquez D. La interfaz de usuario es el medio con que el usuario puede comunicarse con una máquina o computador, y comprende todos los puntos de contacto entre el usuario y el equipo, normalmente suelen ser fáciles de entender y fáciles de accionar. Las interfaces básicas de usuario son aquellas que incluyen elementos tales como menús, ventanas, teclado, ratón, beeps e incluso sonidos que el computador emite. En general, son todos aquellos canales por los cuales se permite la comunicación entre el ser humano y el computador. Tipos de interfaces de usuario [1] Dentro de las Interfaces de Usuario se distinguen tres tipos: A) Una interfaz de hardware, a nivel de los dispositivos utilizados para ingresar, procesar y entregar los datos: teclado, ratón y pantalla visualizadora. B) Una interfaz de software, destinada a entregar información acerca de los procesos y herramientas de control, a través de lo que el usuario observa habitualmente en la pantalla. C) Una interfaz de Software-Hardware, que establece un puente entre la máquina y las personas, permite a la máquina entender la instrucción y a el hombre entender el código binario traducido a información legible. Funciones principales Puesta en marcha y apagado. Control de las funciones manipulables del equipo.

Transcript of Interfaz gráfica de usuario 2015-2016

Page 1: Interfaz gráfica de usuario 2015-2016

Interfaz gráfica de usuario

Ms. Ing. Jairo E. Márquez D.

La interfaz de usuario es el medio con que el usuario puede comunicarse con una máquina o computador, y comprende todos los puntos de contacto entre el usuario y el equipo, normalmente suelen ser fáciles de entender y fáciles de accionar.

Las interfaces básicas de usuario son aquellas que incluyen elementos tales como menús, ventanas, teclado, ratón, beeps e incluso sonidos que el computador emite. En general, son todos aquellos canales por los cuales se permite la comunicación entre el ser humano y el computador.

Tipos de interfaces de usuario [1]

Dentro de las Interfaces de Usuario se distinguen tres tipos:

A) Una interfaz de hardware, a nivel de los dispositivos utilizados para ingresar, procesar y entregar los datos: teclado, ratón y pantalla visualizadora.

B) Una interfaz de software, destinada a entregar información acerca de los procesos y herramientas de control, a través de lo que el usuario observa habitualmente en la pantalla.

C) Una interfaz de Software-Hardware, que establece un puente entre la máquina y las personas, permite a la máquina entender la instrucción y a el hombre entender el código binario traducido a información legible.

Funciones principales

Puesta en marcha y apagado. Control de las funciones manipulables del equipo.

Page 2: Interfaz gráfica de usuario 2015-2016

Manipulación de archivos y directorios. Herramientas de desarrollo de aplicaciones. Comunicación con otros sistemas. Información de estado. Configuración de la propia interfaz y entorno. Intercambio de datos entre aplicaciones. Control de acceso. Sistema de ayuda interactivo.

Tipos de interfaces de usuario

Según la forma de interactuar del usuario: Atendiendo a como el usuario puede interactuar con una interfaz, existen varios tipos de interfaces de usuario:

Interfaces alfanuméricas (intérpretes de mandatos) que solo presentan texto.

Interfaces gráficas de usuario (GUI, graphics user interfaces), las que permiten comunicarse con el ordenador de una forma muy rápida e intuitiva representando gráficamente los elementos de control y medida.

Interfaces táctiles, que representan gráficamente un "panel de control" en una pantalla sensible que permite interaccionar con el dedo de forma similar a si se accionara un control físico.

Según su construcción: Pueden ser de hardware o de software:

Interfaces de hardware: Se trata de un conjunto de controles o dispositivos que permiten la interacción hombre-máquina, de modo que permiten introducir o leer datos del equipo, mediante pulsadores, reguladores e instrumentos.

Interfaces de software: Son programas o parte de ellos, que permiten expresar nuestros deseos al ordenador o visualizar su respuesta.

Valoración

El principal objetivo de una interfaz de usuario es que éste se pueda comunicar a través de ella con algún tipo de dispositivo, conseguida esta comunicación, el segundo objetivo que se debería perseguir es el de que dicha comunicación se pueda desarrollar de la forma más fácil y cómoda posible para el usuario, sin embargo, las interfaces no siempre son intuitivas tal como es el caso de las interfaces de línea de órdenes (CLI o Command Line Interface)1, que se encuentran por ejemplo en algunos sistemas

1 La CLI es un método que permite a las personas dar instrucciones a algún programa informático por medio de una línea de texto simple. Las CLI pueden emplearse interactívamente, escribiendo instrucciones en alguna especie de entrada de texto, o pueden utilizarse de una forma mucho más automatizada (batch = es un archivo de procesamiento por lotes.), leyendo comandos desde un archivo de scripts. Las CLI son parte fundamental de los Shells o Emuladores de Terminal. Aparecen en todos los desktops (Gnome, KDE, Windows) como un método para ejecutar aplicaciones rápidamente. Aparecen como

Page 3: Interfaz gráfica de usuario 2015-2016

operativos como los NOS de los Routers o algunos shell de Unix, DOS, etc. Estas interfaces son las primeras que utilizaron los ordenadores y están anticuadas, aunque los nostálgicos las siguen prefiriendo porque se saben de memoria los comandos. También es importante reconocer las interfaces de línea de órdenes, como el mejor medio para que el administrador del sistema pueda llevar a cabo tareas complejas, de ahí que se sigan utilizando y todo sistema operativo disponga de un intérprete de comandos (shell en Unix, consola o símbolo del sistema en Windows) como parte fundamental de la interfaz del usuario.

Diagrama del proceso de entrada/salida y procesamiento entre un humano y una máquina. Tomado de http://es.wikipedia.org/wiki/Interfaz_de_usuario#/media/File:Linux_kernel_and_gaming_input-output_latency.svg

Piense en el ejemplo de crear un usuario en un sistema: disponemos de un programa que activaremos con doble clic del ratón y rellenaremos una serie de datos en una ventana de diálogo. Mucho más fácil que recordar el comando y las opciones para hacerlo. Ahora imagine que es el administrador de un sistema que debe crear 200 usuarios, lo cual se hace engorroso y poco práctico. Esto se soluciona creando lo que se llaman

interfaz de lenguajes interpretados tales como Java, Python, Ruby o Perl. También se utilizan en aplicaciones cliente-servidor, en DBs ( Postgres, MySQL, Oracle), en clientes FTP, etc. Las CLI son un elemento fundamental de aplicaciones de ingeniería tan importantes como Matlab y Autocad. La contraparte de CLI es la interfaz gráfica de usuario (GUI) que ofrece una estética mejorada y una mayor simplificación, a costa de un mayor consumo de recursos computacionales, y, en general, de una reducción de la funcionalidad alcanzable. Las CLI son usadas por muchos programadores y administradores de sistemas como herramienta primaria de trabajo, especialmente en sistemas operativos basados en Unix; en entornos científicos y de ingeniería, y un subconjunto más pequeño de usuarios domésticos avanzados. En dispositivos portables y PDAs (como el iPhone), las CLI no se utilizan, debido a lo complejo que resulta ingresar datos de texto, o por la ausencia total de teclados. Fuente de consulta. Línea de comandos. [En línea] Consultado el 15 de enero de 2011. http://es.wikipedia.org/wiki/L%C3%ADnea_de_comandos.

Page 4: Interfaz gráfica de usuario 2015-2016

"scripts" o programitas que realizan tareas en un SO. Son ficheros BAT en Windows y shell scripts en Unix/Linux. Estos programitas utilizan el conjunto de comandos que ofrece el sistema. Además, no todo se puede hacer a través de la interfaz gráfica, hay ciertas funciones para usuarios avanzados y administradores que sólo es posible realizarlas mediante comandos.

El diseño de la interfaz es crítico para el manejo del equipo, hay algunas muy bien diseñadas que incorporan controles intuitivos y de fácil manejo, en cambio existen otras que no se entienden bien y el usuario no acierta a manejarlas correctamente sin estudiar un manual o recibir formación del experto.

Es importante tener en cuenta como es la relación entre el usuario y la máquina, que se resume en la siguiente figura.

Los estándares de la interfaz son relativamente recientes.

Algunos de los más importantes son:

- ISO/IEC 9126: Evaluación de productos software: características de calidad y directrices para su uso.

- ISO 9241: requisitos ergonómicos para trabajar con terminales de presentación visual (VDT).

- ISO/IEC 10741: interacción de diálogos. - ISO/IEC 11581: símbolos y funciones de los iconos. - ISO 11064: diseño ergonómico de centros de control. - ISO 13406: requisitos ergonómicos para trabajar con presentaciones visuales

basadas en paneles planos. - ISO 13407: procesos de diseño centrados en la persona para sistemas

interactivos.

Sobre estas normas se explican en forma general al final de este documento.

Algunos aspectos que menciona la ISO 9241 a tener en cuenta son:

Requisitos de la presentación visual Requisitos de teclado Diseño de estaciones de trabajo y requisitos de las posturas Requisitos para la visualización con reflejos Requisitos para colores visualizados Requisitos para dispositivos de entrada no-teclado Principios de diálogos Presentación de información Diálogos de menús Diálogos de manipulación directa Diálogos para completar formularios

Page 5: Interfaz gráfica de usuario 2015-2016

Guías de estilo [2]

Para asegurar la consistencia de las diferentes partes de un sistema o de una familia de sistemas, es fundamental para los desarrolladores basar sus diseños en un conjunto de principios y directrices. Por este motivo, es tan importante para las organizaciones que desarrollan software disponer de una guía que puedan seguir sus desarrolladores. Estas guías se denominan guías de estilo, las cuales varían mucho en sus objetivos. Pueden ser de dos tipos: Estas guías aseguran una mejor usabilidad mediante la consistencia que imponen. En el lenguaje industrial se hace referencia a las guías de estilo como el look and feel.

1. Guías de estilo comerciales. Contienen directrices que se concretan a muy bajo nivel. Son producidas por fabricantes de software y hardware, y que en general disponen de estándares de facto. Por ejemplo: Apple, Motif, OS/2, Windows X, Open Look, Common Desktop Environment (CDE), Java Swing.

2. Guías de estilo corporativas. Ayudan a las empresas a dar un mismo estilo a todos sus productos. Si una organización desea desarrollar su propio estilo corporativo, primero debe escoger una guía de estilo comercial. Esta guía se aumenta con unas características propias que produzcan una imagen coherente de la organización.

Common User Access (CUA)

Es un estándar de facto desarrollado por IBM y Microsoft en la que se definen los componentes de la interfaz que deben mantenerse entre aplicaciones. Por lo cual se establece dos objetivos clave, relacionados con la usabilidad y consistencia de la aplicación y entre aplicaciones.

El desarrollo de la GUI implica unos principios básicos de diseño como son:

a. Los usuarios tienen el control del diálogo.

Los usuarios tienen que desarrollar un modelo conceptual de la interfaz. Uso de metáforas: Metáfora del escritorio: los usuarios ven carpetas y

documentos, no programas y archivos. El sistema establece la asociación datos-programas

Sistema dirigido por el usuario Consistencia Hacer la interfaz transparente

b. Modelo gráfico.

Page 6: Interfaz gráfica de usuario 2015-2016

Las aplicaciones comparten la pantalla. Cada una tiene asignada una parte o ventana. Por lo que se habla de una ventana

activa: aquella con la que el usuario interacciona. Niveles del modelo gráfico:

Presentación Acciones Interacción

c. Presentación

Representa el aspecto visual de la interfaz. Las aplicaciones tienen dos tipos de elementos que hay que presentar:

Objetos. Cualquier cosa que el usuario pueda manipular, además, es el centro de atención del usuario.

Acciones. Permiten al usuario crear o manipular objetos, los cuales se realizan mediante combinaciones de menús y cajas de diálogo.

d. Acciones

En este punto se incorporan los menús desplegables

Menús en cascada (no más de dos niveles)

Cajas de diálogo: Presentan/recogen información y maneja una ventana móvil de tamaño fijo.

Aparece durante el procesamiento de una acción del usuario cuando se requiere información para completarla.

Page 7: Interfaz gráfica de usuario 2015-2016

Se utilizan puntos suspensivos (...) tras el nombre del botón o elemento de menú que abre la caja.

No usan menús. Usan botones para llamar a las acciones

Botones: confirmar (Aceptar), cancelar, aplicar, ayuda o anterior, siguiente, cerrar.

Tipos de cajas de diálogo:

No modal. Permite a los usuarios continuar con su trabajo sin completar el diálogo.

Modal. Requiere que los usuarios completen la caja de diálogo antes de continuar.

Page 8: Interfaz gráfica de usuario 2015-2016

Caja de mensajes: Es un tipo especial de caja de diálogo que se utiliza exclusivamente para mostrar mensajes a los usuarios.

e. Interacción. Es el nivel a través del cual los usuarios interactúan con los componentes de la interfaz. Consta de:

Selección de objeto: Los usuarios apuntan a un objeto que desean manipular y lo seleccionan de manera visible.

Ejecución de la acción: Se selecciona una opción de menú y si es preciso se completa con una caja de diálogo. La ejecución de la acción debe ser visualizada.

Page 9: Interfaz gráfica de usuario 2015-2016

Apuntar y seleccionar: Los usuarios interactúan con los componentes de la interfaz. Apuntan a lo que desean manipular y lo seleccionan. Se utiliza tanto el teclado como el ratón. El teclado y el ratón tienen una indicación visual para indicar al usuario dónde se encuentra.

Indicación visual:

Teclado: Selección de campos (caja de líneas discontinuas). Entrada de campos (cursor de texto)

Mouse: Un puntero indica la posición del mouse.

f. Énfasis. Trata de realzar la importancia de algunos elementos de interacción para que el usuario cuando interacciona pueda saber:

Foco de la entrada Opciones disponibles y no disponibles Estado actual de las opciones Tipos de énfasis:

a. Énfasis de cursor b. Énfasis de selección c. Énfasis de no disponible d. Énfasis del estado actual

Selección:

Selección con el ratón: Clic, doble clic, mayús+clic, Ctrl+clic, arrastrar y seleccionar.

Page 10: Interfaz gráfica de usuario 2015-2016

Selección con el teclado: Tabulación, flechas, mayús y Ctrl (selección), Alt (menús).

g. Acciones comunes.

La consistencia en acciones comunes es importante para reforzar el modelo conceptual del usuario

Existen acciones que son comunes a la mayoría de las aplicaciones, y que CUA define: Abrir archivo, Imprimir, Tipo de letra.

h. Componentes. CUA define una serie de componentes y describe sus propiedades.

Botones de radio (radio button)

Botones de comprobación (check button)

Botones pulsables (push button)

Page 11: Interfaz gráfica de usuario 2015-2016

Caja de grupo (group box ) Campo de texto (text box ) Caja de lista (list box ) Caja de combinación (combo box )

i. Indicador de progreso: Cambio del puntero y ventana de progreso de la acción Control de desplazamiento.

j. Ayuda: Permite resolver las dudas de los usuarios.

Interacción Tecla F1 Seleccionando el botón de ayuda Seleccionando el menú de ayuda

Tipos de ayuda Ayuda contextual Tutorial Glosario

Aspectos a tener en cuenta en el diseño de la Interfaz Gráfica [3]

El sistema debe presentar la información clara al usuario, es decir, mostrar un título adecuado por cada pantalla, minimizando el uso de abreviaturas y proporcionando una retroalimentación de información clara.

El sistema debe ser consistente a lo largo de sus pantallas. Se puede lograr consistencia por medio de: Ubicación de títulos, fecha, hora y mensajes de operador, en todas las

pantallas. Saliendo de cada pantalla mediante la misma opción (a través de enlaces,

botones o pulsando sobre un gráfico determinado). El uso de colores de manera homogénea para todas las pantallas. El uso de iconos para operaciones establecidos de manera similar.

Page 12: Interfaz gráfica de usuario 2015-2016

El Sistema debe realizar un reconocimiento de la aceptación de entrada, es decir, el reconocimiento que la entrada está en la forma correcta.

El sistema debe informar de forma clara y explícita del problema con los datos ingresados en los casos que sea necesario.

Los usuarios deben saber cuándo su petición está completa y si pueden efectuar nuevas solicitudes. Para ello, el sistema debe desplegar un mensaje de retroalimentación.

El sistema debe mostrar mensajes que ha de incluir regreso a la definición de la petición para que el usuario pueda revisar si los datos fueron ingresados correctamente, en lugar de dar comandos que no pueden ser ejecutados.

El título de la página debe permitir al usuario identificar claramente en qué lugar del sistema se encuentra ubicado.

En caso de interfaces secuenciales se debe permitir al usuario acceso a la siguiente o anterior interfaz de la guía consecutiva.

Las páginas deben tener como tamaño máximo una pantalla y media, tomando como base una pantalla que tiene una resolución de 800 x 600 pixeles (Esto específicamente para el desarrollo de software).

Los campos de solo lectura debe aparecer sombreados, mientras que los campos editables serán de fondo blanco. Otra característica de los campos no editables es que al estar deshabilitados no reciben el enfoque.

El enfoque de los controles van de arriba hacia abajo y de izquierda a derecha, se tendrá en cuenta que los campos no editables no recibirán el enfoque.

Guías de estilo para la Web Diseñar para la Web es diferente de diseñar interfaces de usuario tradicionales, donde algunos principios son aplicables, pero la Web tiene sus particularidades. Una característica importante de la Web es la falta de interfaces de usuario comunes. La prioridad es conseguir una interfaz atractiva, diferente de las otras. Para afrontar este problema varias empresas y organismos han publicado sus guías de estilo Web como son:

Apple IBM Sun W3C Yale Center for Advanced Instructional Media

Page 13: Interfaz gráfica de usuario 2015-2016

National Cancer Institute (NIC). Es importante tener en cuenta, que el diseño de la interfaz gráfica de usuario es un elemento que debe permitir al usuario realizar su trabajo de una manera más sencilla y óptima. Lo que significa que la GUI debe ayudar al usuario no estorbar su trabajo.

Script (informática) [4]

Un script (guión) o archivo de órdenes o archivo de procesamiento por lotes es un programa usualmente simple, que por lo regular se almacena en un archivo de texto plano. Los script son casi siempre interpretados, pero no todo programa interpretado es considerado un script. El uso habitual de los scripts es realizar diversas tareas como combinar componentes, interactuar con el sistema operativo o con el usuario. Por este uso es frecuente que los Shells sean a la vez intérpretes de este tipo de programas.

En el sistema operativo, los archivos script suelen ser identificados por el sistema a través uno de los siguientes encabezamientos en el contenido del archivo:

#!/bin/bash ; #!/bin/ksh ; #!/bin/csh

Aunque en entornos *NIX la mayoría de los scripts son identificados por dicho encabezamiento, también pueden ser identificados a través de la extensión ".sh", siendo ésta quizá menos importante que el encabezamiento, ya que casi todos los sistemas no necesitan dicha extensión para ejecutar el script, por lo tanto, esta suele ser añadida por tradición, o más bien, es útil para que el usuario pueda identificar estos archivos a través de una interfaz de línea de comandos.

Difieren de los programas de aplicación, debido a que los últimos son más complejos; además, los scripts son más bien un programa que le da instrucciones a otros más avanzados.

En Windows y DOS

En el sistema operativo DOS, a los guiones creados para ser interpretados por cmd.exe o el obsoleto COMMAND.COM se les conoce como archivos "BATCH" (procesamiento por lotes) y acaban en .bat. En el sistema operativo Windows, existen varios lenguajes de scripting como Visual Basic Script, JavaScript, WScript, Batch Script, etc... Son lenguajes sin interfaz y generalmente derivan en lenguajes de programación más complejos como JAVA o Visual Basic 6...

En diseño web

Los scripts en Internet se pueden clasificar en scripts del lado del cliente y del lado del servidor.

Page 14: Interfaz gráfica de usuario 2015-2016

Scripts del lado del cliente

Los scripts del lado del cliente se deben incluir con el tag <script>, incluyendo el atributo type con el tipo MIME2.

2 Multipurpose Internet Mail Extensions o MIME (extensiones multipropósito de correo de internet) es una serie de convenciones o especificaciones dirigidas al intercambio a través de Internet de todo tipo de archivos (texto, audio, vídeo, etc.) de forma transparente para el usuario. Una parte importante del MIME está dedicada a mejorar las posibilidades de transferencia de texto en distintos idiomas y alfabetos. En sentido general las extensiones de MIME van encaminadas a soportar:

Texto en conjuntos de caracteres distintos de US-ASCII; adjuntos que no son de tipo texto; cuerpos de mensajes con múltiples partes (multi-part); información de encabezados con conjuntos de caracteres distintos de ASCII.

Prácticamente todos los mensajes de correo electrónico escritos por personas en Internet y una proporción considerable de estos mensajes generados automáticamente son transmitidos en formato MIME a través de SMTP [Simple Mail Transfer Protocol (SMTP) Protocolo Simple de Transferencia de Correo]. Los mensajes de correo electrónico en Internet están tan cercanamente asociados con el SMTP y MIME que usualmente se les llama mensaje SMTP/MIME.

Las órdenes básicas de SMTP:

HELO, para abrir una sesión con el servidor MAIL FROM, para indicar quien envía el mensaje RCPT TO, para indicar el destinatario del mensaje DATA, para indicar el comienzo del mensaje, éste finalizará cuando haya una línea únicamente

con un punto. QUIT, para cerrar la sesión RSET Aborta la transacción en curso y borra todos los registros. SEND Inicia una transacción en la cual el mensaje se entrega a una terminal. SOML El mensaje se entrega a un terminal o a un buzón. SAML El mensaje se entrega a un terminal y a un buzón. VRFY Solicita al servidor la verificación del argumento. EXPN Solicita al servidor la confirmación del argumento. HELP Permite solicitar información sobre un comando. NOOP Se emplea para reiniciar los temporizadores. TURN Solicita al servidor que intercambien los paquetes.

De los tres dígitos del código numérico, el primero indica la categoría de la respuesta, estando definidas las siguientes categorías:

2XX, la operación solicitada mediante el comando anterior ha sido concluida con éxito 3XX, la orden ha sido aceptada, pero el servidor está pendiente de que el cliente le envíe nuevos

datos para terminar la operación 4XX, para una respuesta de error, pero se espera a que se repita la instrucción 5XX, para indicar una condición de error permanente, por lo que no debe repetirse la orden

Una vez que el servidor recibe el mensaje finalizado con un punto puede almacenarlo si es para un destinatario que pertenece a su dominio, o bien retransmitirlo a otro servidor para que finalmente llegue a un servidor del dominio del receptor.

Page 15: Interfaz gráfica de usuario 2015-2016

Generalmente se usa JavaScript, pero se puede usar VBScript. Tiene como objetivo, por lo general, AJAX o manipulación del DOM.

SHELL: El término Shell se emplea para referirse a programas que proveen una interfaz de usuario para acceder a los servicios del SO. Estos pueden ser gráficos o de texto simple, dependiendo del tipo de interfaz que empleen. Los Shells están diseñados para facilitar la forma en que se invocan o ejecutan los distintos programas disponibles en el computador.

Hay varias clases de Shell, como son:

Bourne Shell

Es un programa informático cuya función consiste en interpretar órdenes. Incorpora características tales como control de procesos, redirección de entrada/salida, listado y lectura de ficheros, protección, comunicaciones y un lenguaje de órdenes para escribir programas por lotes o scripts. Fue el intérprete usado en las primeras versiones de Unix y se convirtió en un estándar de facto.

Objetivos

Esquema de elementos involucrados en una línea de órdenes.

Los principales objetivos de Bourne Shell eran aprovechar dos características claves del Kernel de la versión 7:

la lista de parámetros (argumentos) mucho más larga, limitada a 8192 bytes (anteriormente 127).

Fuente de consulta. Multipurpose Internet Mail Extensions [En línea] consultado el 30 de julio de 2013. http://es.wikipedia.org/wiki/MIME Simple Mail Transfer Protocol [En línea] http://es.wikipedia.org/wiki/Simple_Mail_Transfer_Protocol. Consultado el 25 de junio de 2011.

Page 16: Interfaz gráfica de usuario 2015-2016

las variables de entorno. Éstas eran una nueva característica de la versión 7, que permitía pasar mucha información a los programas a través del arranque.

La Bourne Shell fue la primera en destacar la convención de usar el descriptor de archivo para mensajes de error, permitiendo un control mucho mayor del programa durante la creación del script, manteniendo los mensajes de error separados de la información.

Korn Shell (ksh) [5]

Es un programa informático cuya función consiste en interpretar órdenes por líneas. Fue escrito para el proyecto de contenido libre GNU y su código se encuentra disponible bajo los términos de la Licencia Pública General. Se encuentra disponible en la mayoría de las distribuciones GNU/Linux y para otros sistemas operativos basados en Unix. Fue desarrollado por David Korn de los Laboratorios AT&T Bell en los comienzos de los 80s. Es totalmente compatible con

el Bourne Shell y también incluye muchos elementos del intérprete de comandos C, como historia de órdenes.

La principal ventaja de ksh sobre otros intérpretes de comandos tradicionales de Unix, es su uso como lenguaje de programación. Desde su concepción, se le agregaron gradualmente muchas capacidades, mientras se mantenía amplia compatibilidad con el Bourne Shell.

La versión ksh93 soporta arreglos asociativos y aritmética de punto flotante integrada. Sus funciones avanzadas para manejar archivos de comandos lo pusieron a la par con lenguajes de programación especializados como awk y Perl.

Para uso interactivo, ksh provee la habilidad de editar la línea de órdenes en modo WYSIWYG, usando la tecla cursor-arriba para llamar a una orden previamente usada, y luego editar la orden como si los usuarios estuvieran en modo línea. Dos modos están disponibles, compatible con vi y emacs.

ksh siempre intenta respetar el Shell Language Standard (POSIX 1003.2 : "Shell and Utilities Language Committee").

Emacs es un editor de texto con una gran cantidad de funciones, muy popular entre programadores y usuarios técnicos. GNU Emacs es parte del proyecto GNU, activamente desarrollado. Es la versión más popular de Emacs. El manual de GNU Emacs lo describe como "un editor extensible, personalizable, auto-documentado y de tiempo real." Es la versión más compatible y portada de las implementaciones de Emacs. La última versión estable, liberada el 08 de mayo de 2010, es la 23.2.

Page 17: Interfaz gráfica de usuario 2015-2016

Algunas personas hacen distinción entre la palabra en mayúsculas "Emacs", usada para referirse a versiones derivadas del programa creado por Richard Stallman (particularmente GNU Emacs y XEmacs), y la palabra en minúsculas "emacs", que es usada para referirse al gran número de reimplementaciones de Emacs. La palabra "emacs" es pluralizada frecuentemente en inglés como emacsen por analogía con "oxen". Por ejemplo, el paquete compatible de Emacs para Debian se llama emacsen-common. El único plural proporcionado por el Collins English Dictionary es emacsen.

En la cultura de Unix, Emacs es uno de los dos principales contendientes en las tradicionales guerras de editores, el otro es vi.

cmd.exe es el intérprete de comandos en OS/2 y sistemas basados en Windows NT (incluyendo Windows 2000, Windows XP, Windows Server 2003, Windows Vista y Windows 7). Es el equivalente de command.com en MS-DOS y sistemas de la familia Windows 9x.

A diferencia de su antecesor (command.com), este programa es tan sólo una aplicación, no es una parte del sistema operativo y no posee la función de cargar la configuración.

Muchas funciones que se realizan desde la interfaz gráfica de algún SO son enviadas al cmd que es el encargado de ejecutarlas. Esto no es del todo cierto en Windows debido a que hay muchas más opciones realizables que no son enviadas al cmd y se ejecutan mediante scripts.

Comandos del Cmd.exe

CD Permite cambiar de un directorio activo a otro. DEL Permite eliminar archivos. DEFRAG Desfragmenta y optimiza un disco. DIR Permite ver todos los ficheros y directorios de la ruta en la que nos

encontramos. FC Compara dos ficheros y verifica que las copias son exactas. FIND Busca una cadena de texto en uno o más archivos. FINDSTR Busca cadenas de texto en archivos. FOR Ejecuta un comando para cada archivo en un conjunto de archivos. FORMAT Da formato a un disco para usarse con Windows. FTYPE Muestra o modifica los tipos de archivo utilizados en una asociación de

archivos. GOTO Direcciona el intérprete de comandos de Windows a una línea en un

programa por lotes. GRAFTABL Permite a Windows mostrar un conjunto de caracteres extendidos

en modo gráfico. HELP Proporciona información de ayuda para los comandos de Windows. IF Ejecuta procesos condicionales en programas por lotes. LABEL Crea, cambia o elimina la etiqueta del volumen de un disco. MD Crea un directorio. MKDIR Crea un directorio. MODE Configura un dispositivo de sistema. MORE Muestra la información pantalla por pantalla. MOVE Mueve uno o más archivos de un directorio a otro en la misma unidad.

Page 18: Interfaz gráfica de usuario 2015-2016

PATH Muestra o establece una ruta de búsqueda para archivos ejecutables. PAUSE Suspende el proceso de un archivo por lotes y muestra un mensaje. POPD Restaura el valor anterior del directorio actual guardado por PUSHD. PRINT Imprime un archivo de texto. PROMPT Cambia el símbolo de comandos de Windows. PUSHD Guarda el directorio actual y después lo cambia. RD Elimina un directorio. RECOVER Recupera la información legible de un disco dañado o defectuoso. REGEDIT Abre el editor de registros REM Graba comentarios en archivos por lotes o CONFIG.SYS. REN Cambia el nombre de uno o más archivos. RENAME Cambia el nombre de uno o más archivos. REPLACE Reemplaza archivos. RMDIR Elimina un directorio. SET Muestra, establece o elimina variables de entorno de Windows. SETLOCAL Inicia la localización de cambios del entorno en un archivo por

lotes. SHIFT Cambia posición de modificadores reemplazables en archivos por lotes. SORT Ordena las entradas. START Inicia otra ventana para ejecutar un programa o comando. SUBST Asocia una ruta de acceso con una letra de unidad. SYS Crea un disco de sistema. TIME Muestra o establece la hora del sistema. TITLE Establece el título de la ventana de una sesión de CMD.EXE. TREE Muestra gráficamente la estructura de directorios de una unidad o ruta de

acceso. TYPE Muestra el contenido de un archivo de texto. VER Muestra la versión de Windows. VERIFY Comunica a Windows si debe comprobar que los archivos se escriben

de forma correcta en un disco. VOL Muestra la etiqueta del volumen y el número de serie del disco. XCOPY Copia archivos y árboles de directorios.

Nota: se recomienda para profundizar más sobre el tema tratado de cmd. http://technet.microsoft.com/es-es/library/bb491071(en-us).aspx

Interfaz gráfica de usuario GUI (graphical user interface) [6]

Es un programa informático que actúa de interfaz de usuario, utilizando un conjunto de imágenes y objetos gráficos para representar la información y acciones disponibles en la interfaz. Su principal uso, consiste en proporcionar un entorno visual sencillo para permitir la comunicación con el SO de un computador o máquina.

Habitualmente las acciones se realizan mediante manipulación directa, para facilitar la interacción del usuario con la computadora. Surge como evolución de los intérpretes de comandos que se usaban para operar los primeros SO y es pieza fundamental en un entorno gráfico. Como ejemplos de interfaz gráfica de usuario, cabe citar los entornos de escritorio:

Windows:

Page 19: Interfaz gráfica de usuario 2015-2016

Las interfaces antiguas de Windows se caracterizaban por su sencillez y el clásico tema gris de Windows 95, mientras que en las versiones más recientes las interfaces evidencian más colores, estilos y modos de personalización. Desde la versión de Windows 7 para atrás la interfaz tiene elementos comunes como:

Barra de tareas: estas se ubican en la parte inferior de la vista de Escritorio y permite:

1. Ver los íconos de acceso directo a los programas favoritos, o los que más usa.

2. Ubicar en Ventanas los archivos, carpetas y programas abiertos o que se estén usando.

También, dentro de la barra de tareas está ubicado el botón de inicio de Windows, este ícono representa una ventana y despliega todo el contenido del sistema operativo Windows.

1. Botón de Inicio

Permite acceder de manera inmediata a la lista desplegable que contiene todos los programas o software instalados en el computador o a cualquier ubicación del equipo. Por ejemplo, el disco duro o el panel de configuraciones.

2. Menú de programas

Es una lista de todos los programas y aplicaciones que se encuentran instalados en el computador.

Page 20: Interfaz gráfica de usuario 2015-2016

Windows 8 [7]

La diferencia más grande de Windows 8 con sus versiones anteriores es el diseño de su interfaz. En esta versión del sistema operativo de Microsoft desaparece el menú de inicio habitual e introduce una Pantalla de inicio que es el principal centro de manejo de Windows 8. Allí se encuentran las aplicaciones que comúnmente se usan y se puede organizar de la manera que más se ajuste a las necesidades del usuario.

Pantalla Windows: Windows 8 está diseñado para que se pueda configurar el computador por medio de una cuenta de Microsoft, lo que permite enlazar la PC a diferentes servicios como Outlook, Xboxlive, Windows Store, SkyDrive y otros. Además cuenta con la Tienda Windows. Desde allí se puede descargar aplicaciones pagas o gratuitas.

También existen cambios en otros aspectos como: los programas incorporados de seguridad que buscan la protección y el cuidado del equipo y archivos, la forma de apagar el equipo, la recuperación del sistema y la manera cómo se utilizan los comandos del teclado, el mouse y la pantalla, en el caso de un equipo táctil.

En el 2015 Microsoft anunció al público las siguientes novedades: [8]

Page 21: Interfaz gráfica de usuario 2015-2016

Como SO base para distintos dispositivos como PC, desktop, tablets, Xbox y Windows Phone.

Posibilidad de instalar la ROM de Windows Phone 10 en algunos dispositivos Android.

Regreso del Menú Inicio, la mitad derecha de este podrá mostrar algunas apps modernas con posibilidad de expandirse para todas las instaladas; además estas apps se mostrarán como ventanas en la interfaz.

Múltiples escritorios, con animaciones.

DirectX 12, que proporcionará mejoras de rendimiento y optimizará el consumo energético.

Action Center, un lugar donde todas las notificaciones estarán en un solo sitio, en la barra de tareas.

Cortana, el asistente personal de Microsoft está integrado en el sistema de búsquedas e indización, con acceso a información en el equipo y también en internet.

Streaming de videojuegos de Xbox One, los usuarios podrán tener acceso a su propio catálogo de videojuegos desde cualquier dispositivo Windows 10.

Juego cruzado, Windows 10 permitirá que usuarios que poseen un juego específico en diferentes plataformas (Xbox One/PC) puedan jugar entre sí.

Se han cambiado iconos del sistema, tal es el caso de Mi equipo, las carpetas y el panel de control entre otros que ahora tendrán un diseño más plano, cumpliendo con el estándar Modern UI que Microsoft introdujo con Windows 8.

Calculadora mejorada con conversión de monedas.

Rediseño del Panel de control y ahora es una app moderna.

Compatibilidad con Raspberry PI.

Símbolo del Sistema soporta atajos de teclado, Como CTRL+C, CTRL+X, CTRL+V.

El nuevo menú inicio se podrá redimensionar e incluso pasar a pantalla completa para obtener algo parecido a la pantalla de inicio de Windows 8 y Windows 8.1.

Traerá consigo Windows Connect Now para crear redes WiFi sin necesidad de software adicional.

Se podrá mantener la sesión iniciada simultáneamente en varios dispositivos, o sea podemos comenzar a trabajar en un PC y en un momento determinado reanudar en un tablet. Este servicio solo estará disponible con una conexión a internet y una cuenta Microsoft.

Page 22: Interfaz gráfica de usuario 2015-2016

Se podrá cambiar el color de algunos Tiles, tal como en Windows Phone.

Saldrá al mercado con el nuevo navegador de Microsoft con nombre en clave de Spartan.

Instalador de paquetes a través de Símbolo del sistema parecido a los distintos gestores de paquetes del terminal de GNU/Linux.

Será posible la actualización desde Windows 7, 8 y 8.1 incluso aunque no se esté en propiedad de una licencia original de Windows, aunque esto no hará que la licencia pase a ser legal, sino que seguirá en el mismo estado a como estaba en la anterior versión del sistema operativo.

GNU/Linux-Ubuntu [9]

Ubuntu es un sistema operativo basado en GNU/Linux y que se distribuye como software libre, el cual incluye su propio entorno de escritorio denominado Unity. Su nombre proviene de la ética homónima, en la que se habla de la existencia de uno mismo como cooperación de los demás.

Está orientado al usuario novel y promedio, con un fuerte enfoque en la facilidad de uso y en mejorar la experiencia de usuario. Está compuesto de múltiple software normalmente distribuido bajo una licencia libre o de código abierto. Estadísticas web sugieren que la cuota de mercado de Ubuntu dentro de las distribuciones Linux es, aproximadamente, del 49%,3 4 y con una tendencia a aumentar como servidor web.5 y un importante incremento activo de 20 millones de usuarios para fines del 2011.6

Después de iniciar sesión Ubuntu muestra los atajos de teclado en Unity.

Page 23: Interfaz gráfica de usuario 2015-2016

Para actualizar la interfaz gráfica en Ubuntu, se pueden ejecutar las siguientes instrucciones:

sudo su dpkg --configure -a apt-get -f install apt-get update apt-get dist-upgrade apt-get install --reinstall ubuntu-desktop apt-get autoremove apt-get clean reboot

Mandriva [10]

Mandrake o Mandriva Linux fue una distribución Linux publicada por la compañía francesa Mandriva destinada tanto para principiantes como para usuarios experimentados, orientada a computadoras personales y servidores con un enfoque a los usuarios que se están introduciendo al mundo de Linux y al software libre.

La primera edición se basó en Red Hat Linux v5.1 y escogió el entorno gráfico de KDE v1.0. Desde entonces siguió su propio camino, separado de Red Hat e incluyó numerosas herramientas propias o modificadas, fundamentalmente dirigidas a facilitar la configuración del sistema. La última versión estable de Mandriva Linux fue denominada Hydrogen, y fue publicada el 28 de agosto de 2011.

Principales características

Basada en la distribución Red Hat. Disponible oficialmente para 2 arquitecturas: Intel x86, AMD64. Actualizable a través de repositorios.

Page 24: Interfaz gráfica de usuario 2015-2016

Frecuencia de presentación de 6 meses para las versiones estables, con actualizaciones en materia de seguridad hasta 18 meses después de su lanzamiento.

Entornos de escritorio: Gnome y Kde pudiendo añadirse xfce, Blackbox entre otros.

Navegador web: Mozilla Firefox. Formato de paquetes rpm. Disponible en DVD, Versión Free Ediciones gratuitas y pagadas

Herramientas de Mandriva [11] Sistema de gestión y herramientas de configuración

Centro de Control de Mandriva - herramienta de configuración. LogDrake - vista y los registros del sistema de búsqueda. DrakConsole - abrir una consola como usuario raíz (root). DrakCronAt - programa de calendario. DrakBackup - copias de seguridad de configuración del sistema y de usuario. DrakBoot - configura cómo arranca el sistema, y selecciona el tema gráfico para

utilizar durante el arranque. DrakFloppy - para producir disquetes de arranque. DrakAutoInst - configura una repetición de instalación automática. DrakStats - recuperar las estadísticas sobre los paquetes instalados rpm. Relacionados con el hardware

DiskDrake - herramienta de gestión de disco duro. XFDrake - herramienta de configuración de X.org. Harddrake - configura el hardware del sistema.

Page 25: Interfaz gráfica de usuario 2015-2016

DrakxTV - configura tarjeta de sintonizador de TV. DrakKeyboard - configurar el diseño de teclado. Drakmouse - configurar el dispositivo señalador (ratón, touchpad) Printerdrake - configurar la impresora. Scannerdrake - configurar escáner. DrakUPS - herramienta de configuración para monitorizar sistemas de alimentación

ininterrumpida (SAI o UPS). DrakSound - configurar una tarjeta de sonido no ISA. Drakfax - herramienta de configuración de fax. LsPciDrake - herramienta de la CLI a la lista de bus PCI y los dispositivos USB

(parte del paquete ldetect). Relacionados con el servidor

DrakTermserv - configurar un servidor de terminal rfbdrake - herramienta para control remoto de otro sistema bajo Linux, UNIX o

Windows. Drakpxelinux - un asistente para crear un servidor PXE. Drakwizard - asistente para realizar la configuración básica de Apache 2 (httpd),

DNS (BIND), DHCP (DHCP-server), FTP (proftpd), OpenSSH (openssh-server), servidores Proxy o NTPD.

Relacionados con la red

Drakconnect - configuración y gestión de las interfaces de red. Drakroam - configuración y gestión de las interfaces de red inalámbrica. NetApplet - applet de usuario para acceder a las propiedades de conexión de red. net_monitor - controlar las conexiones de red. Drakproxy - configurar un servidor proxy para web. DrakGw - configurar la conexión compartida a Internet con otros equipos locales. DrakVpn - configurar una conexión de red privada virtual. Gestión de usuarios relacionados

UserDrake - herramienta de gestión de usuarios. Drakauth - herramienta de configuración para seleccionar el método de

autenticación. Relacionados con el entorno gráfico

MandrivaUpdate - herramienta gráfica para la gestión de paquetes. Urpmi - paquete de herramientas de gestión de la línea de comandos o actualización

de Mandriva Linux con urpmi Mandrivaonline - actualización de Mandriva Linux en línea. FIBRIC - asistente de instalación accesible por navegador web. draklive - herramienta de desarrollo para crear su propia distribución LiveCD.

Herramientas de seguridad

ms - herramienta seguridad de Mandriva

Page 26: Interfaz gráfica de usuario 2015-2016

Draksec - Interfaz gráfica para ms DrakPerm - afina los permisos de seguridad del sistema DrakFirewall - configurar un firewall personal. Herramientas varias

DrakBug - herramienta de reporte de errores interactivo con varias computadoras. Drakbt - es un software BitTorrent y comprobador de estado de archivos torrent. DrakFirsttime - interfaz de configuración por vez primera del sistema, del asistente

de arranque. Drakloop - herramienta para permitir a los usuarios montar sistemas de archivos

cifrados de bucle invertido. Drakoo - asistente de formato de archivo para ejecutar OpenOffice.org y que

permite al usuario elegir el formato de archivo predeterminado para usar. DrakSync - herramienta gráfica para la sincronización de directorios en máquinas

diferentes. Packdrake - constructor sencillo de archivos indexados y extractor que usó métodos

de compresión estándar.

Debían [12]

Debian o Proyecto Debian1, es una comunidad conformada por desarrolladores y usuarios, que mantiene un sistema operativo GNU basado en software libre. El sistema se encuentra precompilado, empaquetado y en un formato deb para múltiples arquitecturas de computador y para varios núcleos.

Page 27: Interfaz gráfica de usuario 2015-2016

Debian no vende directamente su software, lo pone a disposición de cualquiera en Internet, aunque sí permite a personas o empresas distribuirlo comercialmente mientras se respete su licencia.3[13]

Mac OS X

Es un entorno operativo basado en Unix, desarrollado, comercializado y vendido por Apple Inc. Ha sido incluido en su gama de computadoras Macintosh desde el año de 2002.

3

Page 28: Interfaz gráfica de usuario 2015-2016

Línea de tiempo de los sistemas operativos de Mac OSX [14]

iOS

Los elementos de control consisten de deslizadores, interruptores y botones. La respuesta a las órdenes del usuario es inmediata y provee una interfaz fluida. La interacción con el sistema operativo incluye gestos como deslices, toques, pellizcos, los cuales tienen definiciones diferentes dependiendo del contexto de la interfaz. Se utilizan acelerómetros internos para hacer que algunas aplicaciones respondan a sacudir el dispositivo (por ejemplo, para el comando deshacer) o rotarlo en tres dimensiones (un resultado común es cambiar de modo vertical al apaisado u horizontal).

Page 29: Interfaz gráfica de usuario 2015-2016

Opensuse

Es el nombre de la distribución y el proyecto libre auspiciado por SUSE Linux GmbH (una división independiente de The Attachmate Group), y AMD para el desarrollo y mantenimiento de un sistema operativo basado en Linux.

openSUSE comparte muchas características con SUSE Linux Enterprise, ofreciendo por ejemplo: [16]

AppArmor: otorga permisos a las aplicaciones en función de cómo se ejecutan e interaccionan con el sistema.

YaST: una aplicación que openSUSE utiliza para administrar el sistema e instalar software.

Xen: software de virtualización.

KDE y GNOME.

Compiz: un escritorio 3D que corre sobre Xgl.

Línea de tiempo

Page 30: Interfaz gráfica de usuario 2015-2016

Alienware

Tiene la reputación de ofrecer lo último en tecnología para ordenadores personales y portátiles que se especializan en edición de vídeo, edición digital de audio, y particularmente en juegos de ordenador.

Page 31: Interfaz gráfica de usuario 2015-2016

Windows Phone

Android

Page 32: Interfaz gráfica de usuario 2015-2016

Blackberry

Xbox

Page 33: Interfaz gráfica de usuario 2015-2016

En el contexto del proceso de interacción persona-ordenador, la interfaz gráfica de usuario es el artefacto tecnológico de un sistema interactivo que posibilita, a través del uso y la representación del lenguaje visual, una interacción amigable con un sistema informático.

Tipos de interfaces gráficas de usuario

PUI's y Zooming user interface

Los GUIs se encuentran en juegos de computadora, y los GUIs avanzados basados en realidad virtual ahora son usados con más frecuencia en las investigaciones. Muchos

Page 34: Interfaz gráfica de usuario 2015-2016

grupos de investigación en Norteamérica y Europa están trabajando actualmente en la interfaz de enfoque del usuario o ZUI (Zooming User Interface), que es un adelanto lógico de las GUI, mezclando 3D con 2D ó "2D y medio objetos vectoriales de una D".

“En términos generales un ZUI es un tipo de interfaz gráfica de usuario diseñada para un entorno gráfico donde los usuarios pueden cambiar la escala del área visualizada para ver más detalles o menos, y navegar a través de diferentes documentos. Los elementos de información aparecen directamente en un escritorio virtual (normalmente creado usando gráficos vectoriales), en lugar de las ventanas convencionales. Los usuarios pueden desplazarse por la superficie virtual en dos dimensiones y dar zoom en objetos de su interés con el fin de ampliar y revelar más detalles.

Cuando se cambia el nivel de detalle presente en el objeto cambia de tamaño para adaptarse a la información pertinente en el tamaño actual, en lugar de ser una vista proporcional de todo el objeto, se llama zoom semántico.” [17]

Ejemplo de una ZUI. Tomado de http://en.wikipedia.org/wiki/Zooming_user_interface

Algunos consideran el paradigma ZUI como sucesor flexible y realista para la interfaz gráfica de ventanas tradicional, siendo un Post-WIMP interfaz. Pero poco esfuerzo se gasta actualmente en desarrollo Zuis, mientras que se están haciendo esfuerzos para desarrollar otros tipos de interfaces gráficas de usuario.

"Touchscreen user interface" [18]

Algunos GUIs son diseñados para cumplir con los rigurosos requisitos de los mercados verticales. Éstos se conocen como "GUIs de uso específico." Un ejemplo de un GUI de uso específico es el ahora familiar Touchscreen o Pantalla Táctil (pantalla que al ser tocada efectúa los comandos del ratón en el software)4.

4 Es una pantalla que mediante un toque directo sobre su superficie permite la entrada de datos y órdenes al dispositivo. A su vez, actúa como periférico de salida, mostrándonos los resultados introducidos previamente. Este contacto también se puede realizar con lápiz u otras herramientas similares. Actualmente hay pantallas táctiles que pueden instalarse sobre una pantalla normal. Así pues, la pantalla

Page 35: Interfaz gráfica de usuario 2015-2016

Otros ejemplos de GUIs de uso específico, relacionados con el Touchscreen son los cajeros automáticos, los kioscos de información y las pantallas de monitoreo y control en los usos industriales, que emplean un sistema operativo de tiempo real (RTOS). Los teléfonos móviles y los sistemas o consolas de juego también emplean el Touchscreen. Además la domótica no es posible sin una buena interfaz de usuario, o GUI.

Pantallas tipo Touchscreen

Hay diferentes tecnologías de implementación de las pantallas táctiles:

Resistiva

Una pantalla táctil resistiva está formada por varias capas. Las más importantes son dos finas capas de material conductor entre las cuales hay una pequeña separación. Cuando algún objeto toca la superficie de la capa exterior, las dos capas conductoras entran en contacto en un punto concreto. De esta forma se produce un cambio en la corriente eléctrica que permite a un controlador calcular la posición del punto en el que se ha tocado la pantalla midiendo la resistencia. Algunas pantallas pueden medir, aparte de las coordenadas del contacto, la presión que se ha ejercido sobre la misma.

táctil puede actuar como periférico de entrada y periférico de salida de datos, así como emulador de datos interinos erróneos al no tocarse efectivamente

Page 36: Interfaz gráfica de usuario 2015-2016

Las pantallas táctiles resistivas son por norma general más accesibles pero tienen una pérdida de aproximadamente el 25% del brillo debido a las múltiples capas necesarias. Otro inconveniente que tienen es que pueden ser dañadas por objetos afilados. Por el contrario no se ven afectadas por elementos externos como polvo o agua, razón por la que son el tipo de pantallas táctiles más usado en la actualidad.

Es importante anotar que es más barata la fabricación de las pantallas táctiles resistivas que las capacitivas, aunque no ofrecen la propiedad multitouch, es decir que al presionar con más de un dedo, el dispositivo captará la posición de sólo uno de ellos. Además las pantallas táctiles resistivas se descalibran con el paso del tiempo, por lo que toca recalibrarlas periódicamente.

Capacitivas

Una pantalla táctil capacitiva está cubierta con un material, habitualmente óxido de indio y estaño que conduce una corriente eléctrica continúa a través del sensor. El sensor por tanto muestra un campo de electrones controlado con precisión tanto en el eje vertical como en el horizontal, es decir, adquiere capacitancia.

El cuerpo humano también se puede considerar un dispositivo eléctrico en cuyo interior hay electrones, por lo que también dispone de capacitancia. Cuando el campo de capacitancia normal del sensor (su estado de referencia) es alterado por otro campo de capacitancia, como puede ser el dedo de una persona, los circuitos electrónicos situados en cada esquina de la pantalla miden la 'distorsión' resultante en la onda senoidal característica del campo de referencia y envía la información acerca de este evento al controlador para su procesamiento matemático.

Page 37: Interfaz gráfica de usuario 2015-2016

Los sensores capacitivos deben ser tocados con un dispositivo conductivo en contacto directo con la mano o con un dedo, al contrario que las pantallas resistivas o de onda superficial en las que se puede utilizar cualquier objeto. Las pantallas táctiles capacitivas no se ven afectadas por elementos externos y tienen una alta claridad, pero su complejo procesado de la señal hace que su coste sea elevado. La mayor ventaja que presentan sobre las pantallas resistivas es su alta sensibilidad y calidad. [19]

De Onda Acústica Superficial

La tecnología de onda acústica superficial (denotada a menudo por las siglas SAW, del inglés Surface Acoustic Wave) utiliza ondas de ultrasonidos que se transmiten sobre la pantalla táctil. Cuando la pantalla es tocada, una parte de la onda es absorbida. Este cambio en las ondas de ultrasonidos permite registrar la posición en la que se ha tocado la pantalla y enviarla al controlador para que pueda procesarla.

El funcionamiento de estas pantallas puede verse afectado por elementos externos. La presencia de contaminantes sobre la superficie también puede interferir con el funcionamiento de la pantalla táctil.

Infrarrojos

Las pantallas táctiles por infrarrojos consisten en una matriz de sensores y emisores infrarrojos horizontales y verticales. En cada eje los receptores están en el lado opuesto a los emisores de forma que al tocar con un objeto la pantalla se interrumpe un haz infrarrojo vertical y otro horizontal, permitiendo de esta forma localizar la posición

Page 38: Interfaz gráfica de usuario 2015-2016

exacta en que se realizó el contacto. Este tipo de pantallas son muy resistentes por lo que son utilizadas en muchas de las aplicaciones militares que exigen una pantalla táctil.

Galga Extensiométrica [20]

Una galga extensiométrica o extensómetro es un sensor, para medir la deformación, presión, carga, torque, posición, entre otras cosas, que está basado en el efecto piezorresistivo, el cual es la propiedad que tienen ciertos materiales de cambiar el valor nominal de su resistencia cuando se lea somete a ciertos esfuerzos y se deforman en dirección de los ejes mecánicos.

Un esfuerzo que deforma la galga producirá una variación en su resistencia eléctrica, esta variación puede ser por el cambio de longitud, el cambio originado en la sección o el cambio generado en la resistividad. La galga extensiométrica hace una lectura directa de deformaciones longitudinales en cierto punto del material que se está analizando. La unidad que lo representa es épsilon, esta unidad es adimensional y expresa el cambio de la longitud sobre la longitud inicial.

En su forma más común, consiste en un estampado de una lámina metálica fijada a una base flexible y aislante. La galga se adhiere al objeto cuya deformación se quiere estudiar mediante un adhesivo, como el cianoacrilato. Según se deforma el objeto, también lo hace la lámina, provocando así una variación en su resistencia eléctrica. Habitualmente una galga extensiométrica consiste en un alambre muy fino, o más comúnmente un papel metálico, dispuesto en forma de rejilla, que se puede unir por medio de soldadura a un dispositivo que pueda leer la resistencia generada por la galga. Esta forma de rejilla permite aprovechar la máxima cantidad de material de la galga sujeto a la tensión a lo largo de su eje principal. Las galgas extensiométricas también pueden combinarse con muelles o piezas deformables para detectar de forma indirecta los esfuerzos.

Idealmente, las galgas deberían ser puntuales para así poder medir esfuerzos en puntos concretos. En la práctica las dimensiones de la galga son apreciables, por lo tanto se supone que el punto de medida es el centro geométrico de la galga. Si se pretenden medir vibraciones, es necesario que la longitud de las ondas de esas vibraciones sea bastante mayor que la longitud de la galga. Las galgas pueden estar cementadas en una placa pequeña o dos elementos presionan el alambre que transporta la electricidad.

Las galgas tienen ciertas características, unas físicas y otras en cuanto a su funcionamiento. Entre las físicas se encuentra su tamaño, peso y materiales con los que

Page 39: Interfaz gráfica de usuario 2015-2016

fue fabricada; es pequeña y dura, lo que facilita la velocidad con que genera las respuestas; éstas son muy importantes, puesto que el resultado correcto depende de estos aspectos. Existen también características que dependen de la fabricación de la galga, por ejemplo, la temperatura del funcionamiento y el factor de la galga, éste indica la sensibilidad que tiene el sensor. También la resistencia de la galga, el coeficiente de temperatura, la prueba de fatiga y el coeficiente de expansión lineal; son características necesarias para conocer bajo qué circunstancias la galga arroja los resultados adecuados.

Los materiales que suelen utilizarse para fabricar galgas son alambres muy pequeños de aleaciones metálicas, como por ejemplo constantán (Níquel 60%-Cobre 40%), nicrom, Chromel (Níquel-Cromo), aleaciones (Hierro-Cromo-Aluminio), elementos semiconductores como el silicio y el germanio o grabado en laminillas metálicas delgadas. Es por ello que las galgas se clasifican en dos tipos: las metálicas y las semiconductoras.

Cuando se utilizan galgas extensiométricas la pantalla tiene una estructura elástica de forma que se pueden utilizar galgas extensiométricas para determinar la posición en que ha sido tocada a partir de las deformaciones producidas en la misma. Esta tecnología también puede medir el eje Z o la presión ejercida sobre la pantalla. Se usan habitualmente en sistemas que se encuentran expuestos al público como máquinas de venta de entradas, debido sobre todo a su resistencia al vandalismo.

Imagen Óptica

Es un desarrollo relativamente moderno en la tecnología de pantallas táctiles, dos o más sensores son situados alrededor de la pantalla, habitualmente en las esquinas. Emisores de infrarrojos son situados en el campo de vista de la cámara en los otros lados de la pantalla. Un toque en la pantalla muestra una sombra de forma que cada par de cámaras puede triangularizarla para localizar el punto de contacto. Esta tecnología está ganando popularidad debido a su escalabilidad, versatilidad y asequibilidad, especialmente para pantallas de gran tamaño.

Page 40: Interfaz gráfica de usuario 2015-2016

Tecnología de Señal Dispersiva

Este sistema utiliza sensores para detectar la energía mecánica producida en el cristal debido a un toque. Unos algoritmos complejos se encargan de interpretar esta información para obtener el punto exacto del contacto. Esta tecnología es muy resistente al polvo y otros elementos externos, incluidos arañazos.

Como no hay necesidad de elementos adicionales en la pantalla también proporciona unos excelentes niveles de claridad. Por otro lado, como el contacto es detectado a través de vibraciones mecánicas, cualquier objeto puede ser utilizado para detectar estos eventos, incluyendo el dedo o uñas. Un efecto lateral negativo de esta tecnología es que tras el contacto inicial el sistema no es capaz de detectar un dedo u objeto que se encuentre parado tocando la pantalla.

Reconocimiento de Pulso Acústico

Introducida en el año 2006, estos sistemas utilizan cuatro transductores piezoeléctricos situados en cada lado de la pantalla para convertir la energía mecánica del contacto en una señal electrónica. Esta señal es posteriormente convertida en una onda de sonido, la cual es comparada con el perfil de sonido preexistente para cada posición en la pantalla. Este sistema tiene la ventaja de que no necesita ninguna malla de cables sobre la pantalla y que la pantalla táctil es de hecho de cristal, proporcionando la óptica y la durabilidad del cristal con el que está fabricada. También presenta las ventajas de funcionar con arañazos y polvo sobre la pantalla, de tener unos altos niveles de precisión y de que no necesita ningún objeto especial para su utilización.

Page 41: Interfaz gráfica de usuario 2015-2016

Especificaciones HID (dispositivo de interfaz humana) [21]

Las pantallas táctiles se encuentran definidas dentro de la especificación de dispositivos HID para puerto USB como digitalizadores, junto con dispositivos como touchpads y tabletas digitalizadoras entre otros. Las pantallas táctiles se identifican con el usage ID 04. En el protocolo HID, existe 2 entidades: el "host" y el "dispositivo". El dispositivo es la entidad que directamente interactúa con un humano, como lo hace un teclado o un ratón. El host se comunica con el dispositivo y recibe datos de entradas del dispositivo en las acciones ejecutadas por el humano. Los datos de salidas van del host al dispositivo y luego al humano. El ejemplo más común de un host es un computador pero algunos celulares y PDAs también pueden ser hosts.

La especificación del protocolo incluye los campos utilizados para el manejo de este tipo de dispositivos. Algunos de los más interesantes para el manejo de las pantallas táctiles son:

Tip Pressure: que representa la fuerza por un transductor, habitualmente un estilete o también un dedo.

Barrel Pressure: fuerza que ejerce el usuario en el sensor del transductor, como por ejemplo un botón sensible a la presión en el puntero de manejo.

In Range: que indica que el transductor se encuentra en el área donde la digitalización es posible. Se representa por un bit.

Touch: indica si un dedo está tocando la pantalla. El sistema suele interpretarlo como un clic de botón primario.

Untouch: indica que el dedo ha perdido contacto con la superficie de la pantalla. Se interpreta como la acción de soltar el botón primario.

Page 42: Interfaz gráfica de usuario 2015-2016

Tap: indica que se ha realizado un toque con el dedo en la pantalla, levantándolo rápidamente sin prolongar el contacto. Se interpreta como un evento provocado por un botón.

Los objetivos principales y subyacentes de la definición de clase HID son:

Ser lo más compacto posible para ahorrar espacio de datos del dispositivo. Permitir la aplicación de software para omitir información desconocida. Ser extensible y robusto. Que soporte la anidación y las colecciones. Ser autodescriptivo para permitir aplicaciones de software genéricas.

El estándar del HID fue desarrollado por una comisión de trabajo con representantes de varias empresas, esta lista de participantes puede ser encontrada en el documento "Device Class Definition for Human Interface Devices (HID)". El concepto de un autodescribible protocolo libre, fue inicialmente concebido por Mike Van Flandern y Manolito Adan, cuando se encontraban trabajando en el proyecto llamado Raptor en Microsoft e independientemente por [Steve McGowan] mientras trabajaba en el protocolo de un dispositivo para Access Bus en Forte. Después de comparar notas en la conferencia de Consumer Game Developer, Steve y Mike aceptaron colaborar en un nuevo estándar para el emergente Universal Serial Bus ([USB]).

HID comunes:

Teclado Mouse, Trackball. Touchpad, Pointing Stick Graphics Tablet Joystick

HID menos comunes:

Driving simulator devices and flight simulator devices have HIDs such as gear sticks, steering wheels and pedals.

Nintendo Power Glove Dance pad Wii Remote

La mayoría de los SO reconocen dispositivos estándares USB HID, como lo son los teclados y los ratones, sin necesidad de un controlador especial. Cuando se conectan, generalmente se despliega un mensaje en la pantalla diciendo que "un dispositivo HID-compliant ha sido reconocido"

En comparación, este mensaje usualmente no aparece para los dispositivos que son conectados a conectores de 6 pines [PS/2] lo cuales preceden al USB. El conector PS/2

Page 43: Interfaz gráfica de usuario 2015-2016

no soporta [plug-and-play], lo que significa que conectar un teclado o ratón PS/2 con el computador encendido no siempre funcionará. Además, PS/2 no soporta el protocolo HID. [22]

Smarter Objects. Aunque está en etapa de desarrollo, sin lugar a dudas será implementado en pocos años. La idea de desarrollo consiste en proyectar una interfaz gráfica en un dispositivo móvil AR, con lo cual, permite a los usuarios a controlar de forma remota algunos objetos tales como las manijas de las puertas, la radio y sistemas de iluminación entre otros.

Se puede observar el video en https://vimeo.com/60138572

Brazalete que convierte la piel en una pantalla táctil Este brazalete está compuesto por 8 sensores de largo alcance, que se hayan integrados en una pulsera, la cual al colocarla en la muñeca de la mano, con un leve giro se convierte en una pantalla táctil interactiva, la cual permite interactuar al usuario como un teclado normal, donde su piel es el soporte de la GUI. La empresa startup Cicret es la pionera en el desarrollo de la pulsera inteligente, que convierte la piel del brazo en una pantalla táctil. A esta tecnología se le conoce con el nombre de “Cicret Bracelet”.

Page 44: Interfaz gráfica de usuario 2015-2016

Brazo humano en una pantalla táctil [22] Con la app Cicret se puede conectar la pulsera a un dispositivo móvil o tablet para convertir el brazo en una pantalla táctil con todas las funciones que habitualmente realizamos con nuestros dispositivos. Gracias a su diseño compacto y ergonómico será posible consultar un correo electrónico, una notificación e incluso atender una llamada entrante con manos libres, en momentos donde es difícil tener el móvil a mano, por ejemplo, cuando se está en la ducha.

Se puede observar el video en https://www.youtube.com/watch?v=9J7GpVQCfms Desde el punto de vista de la seguridad, el brazalete interactivo de Cicret es un gadget interesante para aquellos que habitualmente utilizan el dispositivo móvil mientras se mueven por la ciudad. Consultar una dirección con google maps mientras camina por la calle o atender una llamada entrante en la parada del bus será mucho más seguro, ya que permite tener el dispositivo guardado en el bolsillo evitando el riesgo que lo roben al menor descuido. Va a pasar algún tiempo hasta que este dispositivo sea una realidad al alcance de todos. La startup ha optado por la vía del crowdfunding para conseguir el millón de euros necesario para desarrollar la tecnología de Cicret Bracelet y lanzarla al mercado de los wereables. Según explican sus creadores, será necesario el 70% de la inversión total para el desarrollo del prototipo y su fabricación en serie, mientras que el 30% restante se invertirá para desarrollar la aplicación Cicret mediante la cual se conectará la pulsera a un smartphone o tablet, bajo los diferentes sistemas operativos existentes en el mercado como Android, iOS o Windows Phone.

Herramientas Web para Diseñar Interfaces (Mockups, Wireframes, Prototipos)

Para un diseñador web o un programador en la que se necesita realizar bocetos preliminares de un sitio o aplicación, es necesario tener muy en claro como debe ser el desarrollo de la interfaz gráfica. Es por ello, que se han creado varias herramientas en línea y/o de escritorio que permiten diseñar la estructura de una aplicación. A continuación se citan algunas de estas herramientas conocidas, comúnmente como Mockups, Wireframe o prototipos.

Page 45: Interfaz gráfica de usuario 2015-2016

Hot Gloo http://www.hotgloo.com/ Esta aplicación en línea está desarrollada en Flash, permitiendo crear Wireframes, además, cuenta con funciones como arrastrar y soltar elementos, etc.

Mockingbird https://gomockingbird.com/ Es una herramienta que permite crear, pre-visualizar y relacionar los wireframes creados, la igual que compartirlos con otros del equipo.

Page 46: Interfaz gráfica de usuario 2015-2016

ProtoShare http://www.protoshare.com/ Esta herramienta permite crear proyectos dinámicos que precisan de prototipos y wireframes.

Balsamiq http://balsamiq.com/products/mockups/ Es una herramienta interactiva de wireframing que es muy fácil de usar, emulando al dibujo con lápiz y papel. Permite cambiar la posición de los elementos de forma dinámica.

Page 47: Interfaz gráfica de usuario 2015-2016

Flair Builder http://www.flairbuilder.com/ Esta herramienta que emplea una plataforma cruzada, facilitando con ello un despliegue de wireframes al usuario diseñador, disponiendo de varios elementos en una sola paleta.

Cacoo https://cacoo.com/lang/es/;jsessionid=8FF51931D1E0341C304C365309176D57.6 Es una gran herramienta de trabajo para dibujo en línea que permite desarrollar varios diagramas como los gráficos de una red alámbrica, o los mapas de un sitio, además puede permitir que varios usuarios accedan a los prototipos para hacer cambios o simplemente ver el progreso, por lo que lo convierte en una herramienta de colaboración. [22]

Page 48: Interfaz gráfica de usuario 2015-2016

Serena Prototype Composer http://www.serena.com/index.php/en/products/other-products/prototype-composer/ Esta herramienta permite simular con gran precisión cómo una aplicación funcionará sin necesidad de escribir código, lo que facilita mucho el poder experimentar diversos diseños ahorrando tiempo y dinero. Esta empresa facilita un trial que permite explorar las potencialidades de este software.

MockFlow http://www.mockflow.com/ Consiste en una biblioteca de plantillas que permiten usarlas de forma libre, lo que permite mejorar la calidad visual de diseño de los wireframes. Existe una versión profesional que contiene más herramientas, la cual por supuesto tiene un costo.

Page 49: Interfaz gráfica de usuario 2015-2016

Lumzy http://www.lumzy.com/ Permite crear varios prototipos de un sitio web o una aplicación que funcionará mediante la adición de eventos a través de su panel de control. [23]

GUI Design Studio http://www.carettasoftware.com/ Esta herramienta de diseño es mucho más avanzada, dirigida a profesionales e industria del software en general. Las últimas versiones, permiten adicionar elementos personalizados y una mayor dinámica en cuanto a interacción con el sistema.

Page 50: Interfaz gráfica de usuario 2015-2016

iPlotz http://iplotz.com/index.php Esta herramienta permite crear wireframes on line, con la particularidad que el diseño no es solo plano, sino que permite navegar a través del diseño, recreando la experiencia de un sitio web real.

OmniGraffle https://www.omnigroup.com/omnigraffle/

Permite el diseño de documentos gráficos de alta calidad, mediante el uso de la técnica de líneas conectadas como diagramas. Esta herramienta permite importar y exportar archivos de Microsoft Visio.

Page 51: Interfaz gráfica de usuario 2015-2016

MockupScreens http://www.mockupscreens.com/ Esta herramienta permite el diseño de maquetas en pantalla dinámicos, donde el sistema retroalimenta la información ingresada permitiendo al diseñador establecer la calidad de su trabajo antes de empezar con el código.

Recursos para diseñar apps y GUI para dispositivos móviles

Para diseñar apps y GUI dirigidos al mercado de dispositivos móviles, es importante mirar las tendencias. A continuación se mencionan algunas webs que recopilan los mejores ejemplos en aplicaciones de iOS y Android.

Page 52: Interfaz gráfica de usuario 2015-2016
Page 53: Interfaz gráfica de usuario 2015-2016

Interfaces y recursos gratuitos Algunos recursos para diseño Responsive Sketchsheets http://zurb.com/playground/responsive-sketchsheets Permite crear tus bocetos e imprimir después cuando se esté conforme.

Page 54: Interfaz gráfica de usuario 2015-2016

iOS8 GUI PSD http://www.teehanlax.com/tools/iphone/ Permite el diseño para iphone e ipad.

Page 55: Interfaz gráfica de usuario 2015-2016

Android 4 UI Design Kit PSD http://freebiesbug.com/psd-freebies/android-4-ui-design-kit-psd/

Pixeden http://www.pixeden.com/mobile-apps

Pinterest https://www.pinterest.com/timoa/mobile-ui-ui-kit/ Muestra una diversa gama de plantillas y/o diseños, ideal para buscar inspiración en cuanto a formatos, aplicaciones, funciones y público objetivo.

Page 56: Interfaz gráfica de usuario 2015-2016

Prototipos Standin http://standin.io/ ¿Diseña sus apps desde photoshop? Stand in permite animar los botones y pantallas del diseño directamente desde Photoshop, y además muestra el resultado directamente en el móvil, o en el de su cliente, esto para que se hagan una idea lo más real posible del resultado final. [24]

Proto io https://proto.io/

Page 57: Interfaz gráfica de usuario 2015-2016

Codiga https://codiqa.com/

Fluid https://www.fluidui.com/ Fluid es gratuito y muy sencillo de crear mockups y prototipos de apps.

Marvel App https://marvelapp.com/ Sube PSDs desde la cuenta de Dropbox, por lo que permite vincular pantallas y anima las transiciones. Es gratis.

Page 58: Interfaz gráfica de usuario 2015-2016

App Cooker http://www.appcooker.com/ Permite prototipar el diseño del app directamente desde el dispositivo móvil.

Pop https://popapp.in/ Esta herramienta es similar a App Cooker, con la particularidad que permite crear los prototipos directamente desde la tablet o Smartphone.

Page 59: Interfaz gráfica de usuario 2015-2016

Normas ISO relacionadas con las GUI5 [26] Consultar periódicamente http://www.iso.org/iso/ para estar actualizado(a). ISO 13407: proceso de diseño centrado en el usuario para sistemas interactivos Define una serie de recomendaciones relativas a procesos de diseño centrados en el usuario a través de toda la vida útil de los sistemas interactivos informáticos. Esta norma está dirigida a los responsables de los procesos de diseño (los jefes de proyecto) y proporciona una guía de fuentes de información y normas que tratan del enfoque centrado en el usuario. Por lo tanto, esta norma tiene que ver con la planificación y la gestión del diseño centrada en el usuario. Aborda únicamente los aspectos técnicos del factor humano y de la ergonomía en la medida en que los jefes de proyecto necesitan comprender la adecuación e importancia de estos datos en relación al proceso de diseño en su conjunto.

5 La información ha sido adaptada en algunos apartes por el autor, respetando los conceptos e ideas expresados por la fuente.

Page 60: Interfaz gráfica de usuario 2015-2016

Aquí están descritas las etapas de comprensión y especificación del contexto de uso, de especificación de las exigencias relacionadas al usuario y a la organización, de la producción de soluciones y de evaluación. Además, se indica al jefe del proyecto cómo evaluar la conformidad del proceso de diseño que ha puesto en práctica, con la norma 13407. Así, éste debe probar que los objetivos de usabilidad han sido objeto de test, y que estos han sido realizados utilizando métodos válidos, y además que una cantidad apropiada de usuarios ha participado en él y son representativos de los futuros usuarios, y que los datos producto de estos test han sido tratados de manera apropiada. ISO/TR 16982: Métodos de usabilidad que soportan diseño centrado en el usuario Se presenta una lista de métodos ergonómicos que pueden ser aplicados a las diferentes etapas del ciclo de diseño, precisando sus ventajas y desventajas. Aquí se presentan los métodos implicando directamente a los usuarios finales (ej. La observación, la medida del desempeño, la técnica de los incidentes críticos, los cuestionarios, las entrevistas, las técnicas de diseño y evaluación participativa, etc.) y los métodos que no implican directamente a los usuarios finales (ej. El análisis de documentos, guías de estilo, cuadros de evaluación, criterios ergonómicos, los métodos formales {ex., KLM, GOMS, MAD*}, etc.). ISO 9241-10: Principios para diálogos Se describe principios generales de ergonomía juzgados importantes para el diseño y evaluación de diálogos entre el usuario y los sistemas de información (adaptación a la tarea, carácter auto descriptivo, control por parte del usuario, conformidad con las expectativas del usuario, tolerancia a errores, aptitud a la individualización, facilidad de aprendizaje). Estos principios pueden ser aplicados durante la especificación, el desarrollo o la evaluación de software como línea directriz general, y son independientes de cualquier técnica de diálogo específico. En este documento, cada principio está acompañado de una descripción seguida de ejemplos de puesta en práctica.

ISO 9241-11: Guía de especificaciones y medidas de usabilidad Se define la usabilidad y explica cómo identificar la información a tomar en cuenta para especificar o evaluar la usabilidad, en términos de desempeño y satisfacción del usuario. Este documento proporciona directrices para la descripción del contexto de usabilidad del software y las medidas pertinentes relativas a la usabilidad (medida de la eficacia y de la eficiencia). ISO 9241-12: Presentación de la información Se dan recomendaciones ergonómicas relativas a la presentación y a las propiedades particulares de la información presentada en pantallas de visualización. Las

Page 61: Interfaz gráfica de usuario 2015-2016

recomendaciones proporcionadas tienen como objetivo permitir al usuario ejecutar tareas de percepción de manera eficaz y satisfactoria. Aquí se aborda por lo tanto la organización de la información (ubicación de la información, adecuación de las ventanas, zonas de información, zonas de entrada/salida, grupos de información, listas, tablas, etiquetas, campos, etc.), los objetos gráficos (cursores y punteros, etc.), y las técnicas de codificación de la información (codificación alfanumérica, abreviación de códigos alfanuméricos, codificación gráfica, codificación por colores, marcadores, etc.). Es proporcionado un ejemplo de procedimiento de evaluación y conformidad. ISO 9241-13: Guía del usuario Se proporciona recomendaciones relativas a la ayuda del usuario. Las recomendaciones presentadas en esta parte están relacionadas al prompt, el feedback, el estado del sistema, la gestión de errores y la ayuda en línea. Las recomendaciones presentadas en esta parte están enfocadas a facilitar la interacción de un usuario con un programa, mejorando con ello el uso eficaz de un programa o aplicación, evitando la carga de trabajo mental inútil, proporcionando a los usuarios un medio de gestión de errores y un asistente a los usuarios con niveles de conocimiento diferente. ISO 9241-14: Diálogos de menús Se proporciona recomendaciones para el diseño ergonómico de los menús, es decir tipos de interacción en el que se presentan opciones a los usuarios bajo diferentes formas (ventanas de dialogo con casillas a marcar, botones, campos, etc.). En esta parte, numerosas recomendaciones son condicionales, es decir que sólo deberían ser aplicadas en contextos específicos (ej. Tipo particular de usuario, de tarea, de entorno, de tecnología, etc.). La aplicación de estas recomendaciones debería estar subordinada a un conocimiento de las tareas y de los futuros usuarios. Aquí se aborda entonces la estructura de los menús, la navegación en los menús, la selección y ejecución de las opciones y la presentación de los menús.

Page 62: Interfaz gráfica de usuario 2015-2016

ISO 9241-15: Diálogos de tipo lenguaje de órdenes Se proporciona recomendaciones para el diseño y evaluación de los diálogos de tipo lenguaje de órdenes, donde el usuario ingresa comandos completos o abreviados respetando la sintaxis del lenguaje de órdenes y el computador los ejecuta. En resumen, este documento aborda la estructura y la sintaxis del lenguaje de órdenes, la representación de los comandos (nombres, abreviación, teclas de función, etc.), los aspectos relativos a los modos de entrada y salida, el feedback y la ayuda.

ISO 9241-16: Diálogos de manipulación directa En los diálogos de tipo de manipulación directa, los usuarios efectúan operaciones manipulando objetos que aparecen en pantalla como si manipularan entidades físicas (ej. Puntear, desplazar, etc.). Por lo tanto, se aborda las metáforas gráficas, la apariencia de los objetos utilizados en la manipulación directa, el feedback, los dispositivos de entrada de datos, la manipulación de objetos, el punteo y la selección, el dimensionamiento, la manipulación directa de las ventanas y los iconos, etc.

Page 63: Interfaz gráfica de usuario 2015-2016

ISO 9241-17: Diálogos por cumplimentación de formularios Son diálogos en los que el usuario rellena, selecciona las entradas o modifica los campos indexados dentro de un formulario o de una ventana de diálogo, presentada por el sistema. Las recomendaciones dadas en esta parte tienen que ver con la estructura de los formularios, los campos y etiquetas, las entradas (textuales alfanuméricas, de opción, los controles, las validaciones, etc.), el feedback y la navegación en el formulario. ISO 14915: Ergonomía del software para interfaces de usuario multimedia Esta norma se compone de 4 partes. La primera es la introducción y no contiene recomendaciones. La segunda parte proporciona recomendaciones acerca del diseño de controles y la navegación (ej. controles de audio, funciones como “play”, “stop”, “pausa”, etc.). La tercera parte proporciona recomendaciones sobre medios específicos y sobre su articulación.

En cuanto a la quinta parte, esta concierne dominios de aplicación específicos como la formación asistida por ordenador, los bornes interactivos, etc. Taller

1. Revisar la información y desarrollar dos GUI empleando algunas de las herramientas de diseño citadas.

2. Realice una página web en la que se evidencie su aprendizaje conforme al punto 1 en cuanto a las GUI tomando en cuenta las normas ISO.

3. Diseñar una GUI para dispositivos móviles, en la que se incorpore varias herramientas de la web 2.0, aparte de las tradicionales redes sociales, Messenger whatsapp, youtube, etc.

Page 64: Interfaz gráfica de usuario 2015-2016

Referencias

[1] Interfaz de Usuario. (2015). Recuperado de: http://es.wikipedia.org/wiki/Interfaz_de_usuario

[2] Interacción persona-ordenador. Estándares y guías de estilo. Recuperado de: http://www.lsi.us.es/docencia/get.php?id=3360

[3] Milagro Ana. L. A. (2009). Diseño de la interfaz gráfica web en función de los dispositivos móviles. Universidad de Palermo Facultad de diseño y comunicación maestría en diseño. Buenos Aires, Agosto de 2009 Buenos aires – Argentina. Disponible en: http://www.palermo.edu/dyc/maestria_diseno/pdf/tesis.completas/43.luzardo.pdf

[4] Script. (2011). Disponible en: http://es.wikipedia.org/wiki/Shell_script.

[5] Korn. (2015). Disponible en: http://es.wikipedia.org/wiki/Korn_Shell

[6]. Arango D. L. (2014). Graphical User Interfaces in the Library Widgets. Escuela de Estadística. Universidad del Valle. http://escuelaestadistica.univalle.edu.co/archivos/conferencias2014/Graphical-User-Interfaces-in-R.pdf

[7] Newton I. Windows. Recuperado de: http://tatianablandon-cur.webnode.es/informatica/actividades/windows/

[8] Microsoft presenta el futuro de Windows. (2014) Recuperado de http://news.microsoft.com/es-xl/microsoft-presenta-el-futuro-de-windows/

[9] Ubuntu. (2015). Recuperado de: http://es.wikipedia.org/wiki/Ubuntu

[10] Mandriva. (2015). Recuperado de: http://es.wikipedia.org/wiki/Mandriva

[11]ibid

[12] Debian. (2015). Recuperado de: http://es.wikipedia.org/wiki/Debian

[13] A Brief History of Debian. Chapter 1 - Introduction -- What is the Debian Project? (2013). Recuperado de https://www.debian.org/doc/manuals/project-history/ch-intro.en.html

[14] Mac OSX. (2015). Recuperado de:http://es.wikipedia.org/wiki/OS_X

[15] iOS.Recuperado de: http://es.wikipedia.org/wiki/IOS

[16] Opensuse. (2015). Recuperado de http://es.wikipedia.org/wiki/OpenSUSE

[17] [17]Zooming user interface. (2015). Recuperado de: http://en.wikipedia.org/wiki/Zooming_user_interface

Page 65: Interfaz gráfica de usuario 2015-2016

[18] Pantalla táctil. (2014). Recuperado de: http://es.wikipedia.org/wiki/Pantalla_t%C3%A1ctil

[19] ANDROID ES CAPACITIVO O RESISTIVO. (2015). Recuperado de:http://www.androidsis.com/android-es-capacitivo-o-resistivo/

[20] Galga extensiométrica. (2015). Recuperado de: http://es.wikipedia.org/wiki/Galga_extensiom%C3%A9trica

[21] MULTIMEDIA - UNIDAD 1. Pantallas sensibles al tacto. Recuperado de: http://eskimo.webcindario.com/1.3%20Pantallas%20sensibles%20al%20tacto.html

[22] Pérez Miguel A. (2014). Brazalete que convierte tu piel en una pantalla táctil. Recuperado de: http://blogthinkbig.com/brazo-humano-en-una-pantalla-tactil/

[23] Universal Serial Bus. (2011). Recuperado de: http://www.usb.org/developers/devclass_docs/HID1_11.pdf.

[24] JF. (2015). Herramientas Web para Diseñar Interfaces (Mockups, Wireframes, Prototipos) Recuperado de: http://collectioncode.com/interes/herramientas-web-para-disenar-interfaces-mockups-wireframes-prototipos/

[25] ibid.

[26] Listado definitivo de recursos para diseñar apps móviles (2014). Recuperado de: http://www.40defiebre.com/recursos-diseno-aplicaciones-moviles/

[27] Las normas en ergonomía de software. (2015). Recuperado de: http://es.kioskea.net/faq/1632-las-normas-en-ergonomia-de-software#iso-13407-proceso-de-diseno-centrado-en-el-usuario-para-sistemas-interactivos