{"id":1441,"date":"2016-10-21T00:35:49","date_gmt":"2016-10-21T05:35:49","guid":{"rendered":"https:\/\/entretejidos.iconos.edu.mx\/thesite\/?p=1441"},"modified":"2020-02-10T16:18:13","modified_gmt":"2020-02-10T22:18:13","slug":"la-importancia-de-una-interfaz-usable-en-un-sistema-de-administracion","status":"publish","type":"post","link":"https:\/\/entretejidos.iconos.edu.mx\/thesite\/la-importancia-de-una-interfaz-usable-en-un-sistema-de-administracion\/","title":{"rendered":"La importancia de una interfaz usable en un sistema de administraci\u00f3n"},"content":{"rendered":"<p><span style=\"font-weight: 400;\">Este trabajo expone la importancia de una interfaz usable en un sistema de administraci\u00f3n. La interfaz es el medio que nos conecta con los objetos que utilizamos a diario, por eso es importante que sean f\u00e1ciles de utilizar, para que el usuario cumpla con la meta que se proponga. En este art\u00edculo se muestran los elementos principales que conforman la interfaz y la funci\u00f3n que desempe\u00f1an dentro de la misma, sin dejar de lado la usabilidad, que es la medida mediante la cual el consumidor determinar\u00e1 la facilidad de empleo\u00a0del sistema; para as\u00ed determinar cuales son los elementos m\u00e1s adecuados para el desarrollo de un sistema de administraci\u00f3n. <\/span><\/p>\n<p><span style=\"color: #000080;\">Palabras clave\u00a0<\/span><span style=\"font-weight: 400;\">Interfaz, hipertextos, usuario, usabilidad, experiencia de usuario (UX)- arquitectura de la informaci\u00f3n.<\/span><\/p>\n<p><span style=\"color: #000080;\"><i>Abstract\u00a0<\/i><\/span><i><span style=\"font-weight: 400;\">This paper discusses the importance of a usable interface management system. The interface is the medium that connects us with objects or systems we use every day; so it is important that they are easy to use, so the user reach the goal purposed. This article describes the main elements of the interface and the role within it is. Without neglecting the usability, which is the measure by which the user determine the usability of the system. To determine which are most suitable for the development of a management system elements.<\/span><\/i><\/p>\n<p><span style=\"color: #000080;\"><i>Keywords\u00a0<\/i><\/span><i><span style=\"font-weight: 400;\">Interface, hipertext, user, usability, user experience UX, information architecture.<\/span><\/i><\/p>\n<p><a href=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2020\/02\/Entretejidos-Interfaz-usable.pdf\" target=\"_blank\" rel=\"noopener noreferrer\">PDF<\/a><\/p>\n<p><!--more--><\/p>\n<p><span style=\"color: #000080;\">Introducci\u00f3n<\/span><\/p>\n<p><span style=\"font-weight: 400;\">El presente art\u00edculo expone la importancia de una interfaz usable, como base de un sistema de administraci\u00f3n. Se parte de que es un elemento que se encuentra presente en la vida cotidiana, porque d\u00eda a d\u00eda se tiene la necesidad de interactuar con diversos objetos en donde la interfaz es el medio que conecta. Espec\u00edficamente, el \u00e9xito de la interfaz gr\u00e1fica<\/span><span style=\"font-weight: 400;\"> depende del objetivo para el cual ha sido dise\u00f1ada y el tipo de usuario al que est\u00e1 dirigido, ya que debe ser clara e intuitiva para \u00e9l. En el caso de la interfaz gr\u00e1fica de un sistema de administraci\u00f3n, debe atender las necesidades espec\u00edficas de cada \u00e1rea, proporcionando al usuario las herramientas suficientes para ejecutar cualquier acci\u00f3n dentro del sistema. Por otro lado, el objetivo principal de una interfaz usable, es facilitar el manejo eficaz de la informaci\u00f3n y permitir la toma de decisiones en los momentos oportunos. Ben Shneiderman afirma \u201c\u2026 una interfaz bien dise\u00f1ada debe ser consistente, predecible y controlable &#8230;\u201d (Shneiderman 12-15) <\/span><\/p>\n<p><span style=\"font-weight: 400;\">Cabe mencionar que un sistema de administraci\u00f3n es aquel que representa el significado general de toda organizaci\u00f3n, teniendo en cuenta que al construir una empresa comercial, se debe estudiar y planificar las actividades que se realizan para un mejor control en el funcionamiento de la misma, esto con la finalidad de obtener una buena direcci\u00f3n, ejecuci\u00f3n y control de las actividades laborales. La interfaz de un sistema de administraci\u00f3n debe ser dise\u00f1ada para todo tipo de usuario, quien no necesariamente est\u00e1 familiarizado con un sistema, por ello debe ser clara y consistente para explicarse por s\u00ed misma, es decir, ser usable. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">Este art\u00edculo se limita a exponer las recomendaciones a tomar en cuenta al desarrollar una interfaz para un sistema de administraci\u00f3n, para lo cual, conocer los elementos que conforman la interfaz gr\u00e1fica es un tema prioritario. El cuestionamiento de este art\u00edculo, es el siguiente: \u00bfqu\u00e9 estructura con base en la usabilidad debe tener la interfaz de un sistema de administraci\u00f3n? Su respuesta a verificar dice que: una estructura usable, debe considerar los elementos de la interfaz, organizar im\u00e1genes e informaci\u00f3n y entonces, la comunicaci\u00f3n ser\u00e1 eficaz.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">A lo largo de este art\u00edculo se establece una definici\u00f3n de interfaz, as\u00ed como los elementos que nos ayudan a lograr un equilibrio entre funcionalidad y dise\u00f1o, adem\u00e1s de describir sus caracter\u00edsticas. Posterior a esto se habla de la experiencia de usuario. Se contin\u00faa delimitando los elementos que intervienen en el desarrollo de una interfaz para un sistema de administraci\u00f3n. Al final se define qu\u00e9 es usabilidad y los conceptos a considerar, como el dise\u00f1o centrado en el usuario. La meta es establecer cu\u00e1les son los elementos indispensables y qu\u00e9 caracter\u00edsticas deben tener al dise\u00f1ar una interfaz que permita al usuario, el correcto despliegue de la informaci\u00f3n y as\u00ed contribuya al \u00f3ptimo desempe\u00f1o de un sistema de administraci\u00f3n. <\/span><\/p>\n<p><span style=\"color: #000080;\">1. Interfaz<\/span><\/p>\n<p><span style=\"font-weight: 400;\">La interfaz es el medio con que el usuario puede comunicarse con una m\u00e1quina. A lo largo de la vida se interact\u00faa con diferentes interfaces de objetos que utilizamos a diario y en muchas ocasiones no sabemos c\u00f3mo funcionan, por la complejidad que presentan. A menudo, los objetos mal dise\u00f1ados pueden resultar dif\u00edciles de utilizar y el usuario se frustra. De ah\u00ed surge la necesidad de crear interfaces que sean simples y ayuden a llegar a un objetivo particular, ya que \u201c\u2026 los objetos bien dise\u00f1ados son f\u00e1ciles de interpretar y comprender. Contienen pistas visibles acerca de su funcionamiento.\u201d (Norman 16) Uno de los principios m\u00e1s importantes del dise\u00f1o es la visibilidad, es decir, los objetos no deben proporcionar pistas falsas de su funcionamiento; esto evitar\u00e1 la frustraci\u00f3n. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">Entonces, el \u00e9xito de la interfaz depende del objetivo para el que ha sido dise\u00f1ada y de acuerdo al tipo de usuario al que est\u00e1 dirigido porque debe ser f\u00e1cil de usar y de comprender.<\/span><\/p>\n<p><span style=\"color: #000080;\">Definici\u00f3n de Interfaz, fundamentos de dise\u00f1o<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Eric Eaton define a la interfaz gr\u00e1fica \u201c\u2026 como uno de los elementos m\u00e1s importantes cuando hablamos de dise\u00f1o&#8230;\u201d (Eaton 13) Es decir, un dise\u00f1o que no es funcional no es\u00a0un buen dise\u00f1o, lo cual implica que la interfaz gr\u00e1fica debe ser intuitiva, es decir, se debe interactuar con la misma de una forma fluida y sin contratiempos. As\u00ed es como se puede valorar el \u00e9xito de una buena interfaz, ya que el dise\u00f1o es la suma de los elementos que la conforman. Por otro lado, Javier Royo define a la interfaz como el \u00e1rea de comunicaci\u00f3n entre el hombre y la m\u00e1quina. (Royo 115) Lo cual implica que se interact\u00faa con distintos artefactos, en donde la interfaz es el medio que conecta con los objetos exteriores, por eso es una constante en la vida. En diferente sentido, Carlos Scolari define a la interfaz como un concepto paraguas, susceptible de ser interpretado desde diferentes puntos de vista; tambi\u00e9n la define como una met\u00e1fora. \u00a0\u00a0\u00a0(Scolari 1) Por eso es el intercambio entre dos partes, por ejemplo entre una empresa y el cliente. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">A partir de estas definiciones, es posible concluir que la interfaz es el espacio en el que interact\u00faan el usuario y el sistema; adem\u00e1s resulta relevante el punto de vista de Eaton, cuando dice que la interfaz es el elemento m\u00e1s importante cuando se habla de dise\u00f1o. Ya que el \u00e9xito de la interfaz surge cuando el usuario interact\u00faa con el sistema de forma intuitiva y sin complicaciones. Por lo que, cuando se hace referencia al dise\u00f1o de una interfaz, el m\u00e1s indicado para presentar un juicio es el usuario, es decir, aquella persona que interact\u00faa directamente con ella. Cabe agregar que la interfaz puede o no gustarle al usuario, pero no se debe perder de vista el objetivo principal: comunicar. Donald Norman en su libro <\/span><i><span style=\"font-weight: 400;\">La psicolog\u00eda de los objetos cotidianos<\/span><\/i><span style=\"font-weight: 400;\"> propone algunos usos que el dise\u00f1o de la interfaz debe dar al usuario:<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Limitar las acciones posibles a las que el usuario vaya a utilizar.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Hacer que las cosas sean visibles, comprendiendo el modelo conceptual del sistema, los diversos actos posibles y sus resultados para facilitar la comprensi\u00f3n del sistema.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Facilitar la evaluaci\u00f3n del\u00a0estado actual del sistema dise\u00f1ando respuestas de \u00e9ste al usuario cada vez que realice una acci\u00f3n.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Conseguir que la interfaz sea comprendida de forma natural para conseguir que la acci\u00f3n del usuario se lleve a cabo de forma satisfactoria. (Norman 103)<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Estos usos, que bien pueden identificarse como consideraciones para el dise\u00f1o, son sencillos, ya que la meta principal es no confundir al usuario para que el mensaje sea claro y le llegue de manera directa, es decir: limitar las acciones posibles. Por eso no se debe adornar el dise\u00f1o de la interfaz con m\u00e1s v\u00ednculos de los necesarios; tambi\u00e9n hacer que las cosas sean visibles; adem\u00e1s considerar que el dise\u00f1o de los botones sea coherente con la interfaz; as\u00ed como su funci\u00f3n debe ser clara para facilitar la comprensi\u00f3n del sistema. Como consecuencia, cuando el usuario realiza una acci\u00f3n, la interfaz debe devolverle una respuesta para conocer el estado y proseguir. Ver figura 1:<\/span><\/p>\n<a href=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/reproductor.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1443\" src=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/reproductor.png\" alt=\"reproductor\" width=\"817\" height=\"412\" srcset=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/reproductor.png 817w, https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/reproductor-300x151.png 300w, https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/reproductor-768x387.png 768w\" sizes=\"auto, (max-width: 817px) 100vw, 817px\" \/><\/a>\n<p><span style=\"font-weight: 400;\">A continuaci\u00f3n en la figura 2, se representa un esquema en donde se identifican las acciones destinadas al dise\u00f1ador, en relaci\u00f3n al dise\u00f1o de una interfaz y del mismo modo, las acciones del usuario para interactuar con ella.<\/span><\/p>\n<a href=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/funciones.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1444\" src=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/funciones.png\" alt=\"funciones\" width=\"759\" height=\"349\" srcset=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/funciones.png 759w, https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/funciones-300x138.png 300w\" sizes=\"auto, (max-width: 759px) 100vw, 759px\" \/><\/a>\n<p><span style=\"font-weight: 400;\">Por otro lado, el dise\u00f1o de la interfaz debe contar con los elementos necesarios como son: arquitectura de la informaci\u00f3n, tipograf\u00eda, hipertextos, hiperv\u00ednculos, color, \u00edconos, botones y men\u00fa, los cuales deben apoyar para lograr una interacci\u00f3n intuitiva. Estos elementos ser\u00e1n explicados con mayor profundidad m\u00e1s adelante. Ahora es primordial exponer las fases de desarrollo que ayudan a definir cualquier proyecto que incluya al usuario, para lo cual se utiliza el modelo establecido por Eric Eaton:<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Definir el alcance del proyecto.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Definir los objetivos estrat\u00e9gicos.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Definir las especificaciones t\u00e9cnicas.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Dise\u00f1o y producci\u00f3n. (Eaton 23)<\/span><\/p>\n<p><span style=\"color: #000080;\">Alcance del proyecto:<\/span><span style=\"font-weight: 400;\"> cuando se define el alcance del proyecto, se requiere identificar el mercado que cubrir\u00e1 el sitio web o aplicaci\u00f3n digital; de esta forma se tendr\u00e1n claras las necesidades del usuario. Al hablar de necesidades del usuario, se refiere en este art\u00edculo a un sistema de administraci\u00f3n, en donde las herramientas presentadas deben facilitarle la ejecuci\u00f3n de una tarea o acci\u00f3n. <\/span><\/p>\n<p><span style=\"color: #000080;\">Objetivos estrat\u00e9gicos<\/span><b>:<\/b><span style=\"font-weight: 400;\"> el objetivo ser\u00e1 crear una experiencia de usuario exitosa, esto se logra tomando en cuenta los siguientes factores, usabilidad + dise\u00f1o visual. El objetivo de inter\u00e9s de este texto, ser\u00e1 la utilidad de la interfaz para la comunicaci\u00f3n en un sistema de administraci\u00f3n.<\/span><\/p>\n<p><span style=\"color: #000080;\">Especificaciones t\u00e9cnicas<\/span><b>:<\/b><span style=\"font-weight: 400;\"> se refiere a una gu\u00eda de trabajo para el equipo de dise\u00f1o y producci\u00f3n, en la cual se definen los elementos de <\/span><i><span style=\"font-weight: 400;\">software<\/span><\/i><span style=\"font-weight: 400;\"> y <\/span><i><span style=\"font-weight: 400;\">hardware,<\/span><\/i><span style=\"font-weight: 400;\"> que se emplear\u00e1n en el desarrollo de una posible aplicaci\u00f3n para un sistema de administraci\u00f3n. En este trabajo se debe de entender que las recomendaciones son el uso de tecnolog\u00eda HTML5 con programaci\u00f3n en PHP, para la conexi\u00f3n con base de datos. Esto nos permite compartir informaci\u00f3n entre las \u00e1reas y mantenerla actualizada.<\/span><\/p>\n<p><span style=\"color: #000080;\">Dise\u00f1o y producci\u00f3n:<\/span><span style=\"font-weight: 400;\"> en esta fase, se debe tomar en cuenta el orden correcto del desarrollo, una vez establecidas las especificaciones t\u00e9cnicas, el alcance y las herramientas a utilizar para lograr el objetivo; la meta final es lograr un equilibrio entre el dise\u00f1o y la funcionalidad de la interfaz. Por esta raz\u00f3n es importante dise\u00f1ar todas las pantallas del sistema antes de maquetarlas con HTML5 y CSS3. Una vez establecido el flujo del sistema, se proceder\u00e1 a su programaci\u00f3n en PHP.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Entonces, se puede concluir que de acuerdo a las fases de desarrollo mencionadas por Eric Eaton, hay algunas observaciones que no se deben omitir para que el desarrollo de una interfaz sea exitosa. Por ello se propone el siguiente esquema, tomando como base el modelo establecido por Eaton, considero que estos 3 puntos nos dan una gu\u00eda que servir\u00e1 como base de inicio de cualquier proyecto orientado a un usuario. Ver figura 3.<\/span><\/p>\n<p style=\"text-align: center;\"><span style=\"color: #000080; text-align: left;\"><a href=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/Captura-de-pantalla-2016-10-14-a-las-2.16.15-p.m..png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1475\" src=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/Captura-de-pantalla-2016-10-14-a-las-2.16.15-p.m..png\" alt=\"captura-de-pantalla-2016-10-14-a-las-2-16-15-p-m\" width=\"608\" height=\"330\" srcset=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/Captura-de-pantalla-2016-10-14-a-las-2.16.15-p.m..png 608w, https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/Captura-de-pantalla-2016-10-14-a-las-2.16.15-p.m.-300x163.png 300w\" sizes=\"auto, (max-width: 608px) 100vw, 608px\" \/><\/a>2.\u00a0La experiencia del usuario (UX)<\/span><\/p>\n<p><span style=\"font-weight: 400;\">La experiencia del usuario (UX) es \u201c\u2026 el conjunto de ideas, sensaciones y valoraciones del usuario resultado de la interacci\u00f3n con un producto; es resultado de los objetivos del usuario, las variables culturales y el dise\u00f1o de la interfaz.\u201d (Bjer\u00e9n 15) Es decir, la UX no s\u00f3lo tiene que ver con la experiencia funcional, sino tambi\u00e9n con la experiencia\u00a0est\u00e9tica. Esto es el resultado del \u00e9xito en la realizaci\u00f3n de las acciones del usuario, al interactuar con la interfaz.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Por lo tanto, una interfaz debe ser f\u00e1cil de usar y de comprender. Algunas recomendaciones que ayudan a tener \u00e9xito en el dise\u00f1o de una interfaz, para que la UX sea placentera y comunique el mensaje correcto, son las siguientes:<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Ser claros y concisos en el lenguaje. No escribir sino lo estrictamente necesario y pensar que lo que escribimos se lo estamos explicando a un ni\u00f1o de corta edad.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Mostrar una navegaci\u00f3n sencilla.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Dividir la ayuda en tantas partes sean necesarias para explicar los pasos de la forma m\u00e1s sencilla posible.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Acompa\u00f1ar los textos de esquemas o ilustraciones informativas siempre que sea necesario o ayude en gran medida a aclarar un concepto. (Royo 110)<\/span><\/p>\n<p><span style=\"font-weight: 400;\">El objetivo del dise\u00f1ador es hacer visible la informaci\u00f3n para el usuario y una herramienta que puede resultar muy \u00fatil, es el empleo de modelos mentales que se activan en el usuario, mediante diferentes tipos de informaci\u00f3n presentes en la interfaz, entre ellos est\u00e1n:<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Informaci\u00f3n perceptiva (color, tipograf\u00eda, e identidad del sistema).<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Informaci\u00f3n funcional (hipertextos, \u00edconos, botones, im\u00e1genes, textos, etc.).<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Informaci\u00f3n jer\u00e1rquica, atribuyendo un orden de prioridades en los elementos de la p\u00e1gina y funciones que desempe\u00f1an sobre la misma.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Informaci\u00f3n secuencial, cuando la web y su entorno se establecen como una secuencia, el usuario lee y prev\u00e9 eventos en funci\u00f3n de la secuencia. \u00a0(Royo 127)<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Por otro lado, existen diferentes tipos de usuario dentro de los cuales se encuentra el usuario experto, el cual se define como la persona que tiene un conocimiento previo de las acciones que se realizan en la Web. Es quien cuenta con la experiencia suficiente para desenvolverse en el medio que se le presente, siempre y cuando las gu\u00edas de ayuda sean las correctas. \u201cEso se logra intentando que el usuario tenga que realizar el m\u00ednimo aprendizaje para entender el sistema, lo que equivale a tener en cuenta, conocer y utilizar de la forma m\u00e1s \u00f3ptima sus modelos mentales.\u201d (Royo 128) <\/span><\/p>\n<p><span style=\"font-weight: 400;\">Como se observa el modelo mental es importante y se debe entender como el mecanismo del pensamiento, mediante el cual un ser humano intenta explicar o comprender el funcionamiento de un sistema. \u201cEsos modelos son esenciales para ayudarnos a comprender nuestras experiencias, predecir los resultados de nuestros actos y hacer frente a acontecimientos imprevistos.\u201d (Norman 57) En ese sentido, el dise\u00f1ador es el encargado de proporcionarle al usuario los elementos necesarios, para que forme un modelo mental que le haga comprender el funcionamiento del sistema. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">Pero cuando el usuario no cuenta con ning\u00fan modelo mental se le denominar\u00e1 usuario inexperto y su reconocimiento del medio se produce por comparaci\u00f3n con otros sistemas de funcionalidad o apariencia parecida. De esta manera, el usuario lleva a cabo un proceso de aprendizaje y error mediante la informaci\u00f3n con la que interact\u00faa: por eso el usuario aprende mientras navega. Al final se forma en \u00e9l un modelo mental que basado en la familiaridad, le ayuda a cumplir sus objetivos en futuras aplicaciones. Ver figura 4. <\/span><\/p>\n<a href=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/iconosc.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1446\" src=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/iconosc.png\" alt=\"iconosc\" width=\"681\" height=\"350\" srcset=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/iconosc.png 681w, https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/iconosc-300x154.png 300w\" sizes=\"auto, (max-width: 681px) 100vw, 681px\" \/><\/a>\n<p><span style=\"font-weight: 400;\">Cuando se utilizan recursos como los que se muestran en la figura 4, es porque el dise\u00f1ador hace uso de las met\u00e1foras que se emplean en los modelos mentales, para que el usuario comprenda la acci\u00f3n que realiza con cada gr\u00e1fico; por consecuencia, si no hay tal modelo, entonces no se comprende. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">Con lo dicho se puede concluir que: la UX es un factor determinante, ya que permite conocer la eficacia de la interfaz, al atender las necesidades del usuario de una forma simple. Por ello para el desarrollo de una interfaz para un sistema de administraci\u00f3n, debe tomar como base la informaci\u00f3n af\u00edn al modelo mental de los usuarios, para que le sirva de gu\u00eda en la ejecuci\u00f3n de acciones.<\/span><\/p>\n<p><span style=\"color: #000080;\">3.\u00a0Elementos para interfaz administrativa<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Existen diferentes elementos visuales que conforman la interfaz que\u00a0ayudar\u00e1n al usuario a ejecutar acciones con un objetivo particular, cada uno de esos elementos debe cumplir una funci\u00f3n espec\u00edfica. Su\u00a0aplicaci\u00f3n correcta permitir\u00e1 al usuario ocuparse \u00fanicamente de las actividades de su inter\u00e9s y as\u00ed reducir al m\u00ednimo, el tiempo que ocupa en aprender el funcionamiento del sistema. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">A continuaci\u00f3n se definen algunos elementos que se consideran relevantes, para el desarrollo de una interfaz dirigida a un sistema de administraci\u00f3n.<\/span><\/p>\n<p><span style=\"color: #000080;\">Arquitectura de la informaci\u00f3n<\/span><\/p>\n<p><span style=\"font-weight: 400;\">La arquitectura de la informaci\u00f3n comprende los sistemas de organizaci\u00f3n y estructuraci\u00f3n de los contenidos. \u201cPuede afirmarse que de alguna manera la arquitectura de la informaci\u00f3n ha estado presente en todo intento por organizar sistem\u00e1ticamente determinados vol\u00famenes de informaci\u00f3n que son utilizados por grandes grupos de usuario.\u201d (Cout\u00edn 21)<\/span><\/p>\n<p><span style=\"font-weight: 400;\">La arquitectura de la informaci\u00f3n es de suma importancia en el dise\u00f1o de una interfaz, porque permite ordenar\u00a0el contenido y darle estructura a la informaci\u00f3n. Con esto tambi\u00e9n se refiere a la organizaci\u00f3n visual de los elementos que deben conservar un estilo de dise\u00f1o homog\u00e9neo, para todos los elementos de la interfaz (botones, enlaces de texto, color, etc.), lo cual permite al usuario familiarizarse con la interfaz y sus funciones. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">Existen diferentes clasificaciones de la estructura de la informaci\u00f3n, por ejemplo:<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Estructuras lineales: son estructuras que generan un tipo de lectura secuencial.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Estructuras jer\u00e1rquicas: permiten al usuario elegir entre un n\u00famero determinado de opciones para pasar al siguiente nivel. <\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Estructuras aleatorias: son estructuras donde el usuario no conoce de antemano el destino que le espera. (Royo 157)<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Es importante conocer qu\u00e9 tipo de estructura favorece al desarrollo de un sistema de administraci\u00f3n, por eso para el proyecto que interesa a este escrito y de acuerdo a la clasificaci\u00f3n que nos presenta Javier Royo, se toman como base dos de las estructuras antes mencionadas: la estructura lineal y la estructura jer\u00e1rquica. La estructura lineal, al ser secuencial permite que el usuario avance dentro de la interfaz, desarrollando acciones con un orden espec\u00edfico, mientras que la estructura jer\u00e1rquica permite limitar algunas acciones del usuario.<\/span><\/p>\n<p><span style=\"color: #000080;\">Tipograf\u00eda<\/span><\/p>\n<p><span style=\"font-weight: 400;\">La tipograf\u00eda facilita\u00a0un contexto, por eso debe contar con caracter\u00edsticas espec\u00edficas en todas sus aplicaciones; t\u00edtulos, subt\u00edtulos y contenido. Entre otras condiciones, los tipos de fuente muy adornados o un tama\u00f1o de fuente menor a 12 pts, no son recomendables para su lectura en pantalla, ya que resultan dif\u00edciles de leer. \u201cVerdana es el tipo de letra m\u00e1s c\u00f3moda para grandes cuerpos de texto y funciona bien con los enlaces de texto corto en HTML\u201d. (Eaton 72) Ver figura 5.<\/span><\/p>\n<a href=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/encabezados.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1447\" src=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/encabezados.png\" alt=\"encabezados\" width=\"656\" height=\"464\" srcset=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/encabezados.png 656w, https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/encabezados-300x212.png 300w\" sizes=\"auto, (max-width: 656px) 100vw, 656px\" \/><\/a>\n<p><span style=\"color: #000080;\">Hiperv\u00ednculos<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Cuando se habla de hiperv\u00ednculos, se refiere a un enlace entre dos p\u00e1ginas o aplicaciones web, estas pueden estar\u00a0dentro de un mismo sitio o bien un enlace fuera de la aplicaci\u00f3n. Los hiperv\u00ednculos suelen clasificarse en dos grandes grupos que son: hiperv\u00ednculo de texto e hiperv\u00ednculo de imagen. Una caracter\u00edstica de los hiperv\u00ednculos es que al hacer <em>clic<\/em> sobre ellos, pueden iniciar una acci\u00f3n o finalizar un proceso determinado, por ejemplo en el env\u00edo de datos.<\/span><\/p>\n<blockquote><p><span style=\"font-weight: 400;\">El hiperv\u00ednculo es una palabra o palabras que revelan un enlace a una p\u00e1gina en la ventana del explorador cuando se hace clic sobre \u00e9l [\u2026] Este tipo de elementos de la interfaz pueden pensarse como lineales: cada uno puede ser usado como un enlace entre el inicio y finalizaci\u00f3n de una tarea. (Eaton 51)<\/span><\/p><\/blockquote>\n<p><span style=\"font-weight: 400;\">Hiperv\u00ednculo de texto.- Es un enlace que se encuentra asociado a un texto, este puede estar integrado dentro de un p\u00e1rrafo o bien se puede presentar de forma aislada. \u201cPara que un enlace funcione bien, representar\u00e1 una acci\u00f3n singular, destino, o concepto, y debe ser distinguible de los elementos que la rodean\u201d. (Eaton 64)<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Los enlaces de texto se identifican f\u00e1cilmente dentro del cuerpo de texto por la cualidad que se les atribuye, al presentarse en un color distinto al texto y subrayados, a dichos\u00a0enlaces se les denomina enlaces activos. Cabe enfatizar que los enlaces visitados deben presentarse en un color distinto, de esta forma el usuario puede volver a ellos\u00a0o bien, evitarlos. \u00a0<\/span><\/p>\n<blockquote><p><span style=\"font-weight: 400;\">Debe existir un contraste en los enlaces y debemos considerar los fondos de color, ya que el enlace no debe resaltar demasiado sobre otros textos, esto nos puede comunicar un mensaje diferente. (Eaton 69)<\/span><\/p><\/blockquote>\n<p><span style=\"font-weight: 400;\">Sin embargo, un aspecto negativo de los enlaces cuando se presentan de manera desmedida dentro del texto, provocan ruido visual, dificultando la lectura para el usuario. Asimismo resulta inconveniente cuando se utilizan para dirigir\u00a0al usuario fuera del sistema. Ver figura 6.<\/span><\/p>\n<a href=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/hipervinculo.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1448\" src=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/hipervinculo.png\" alt=\"hipervinculo\" width=\"377\" height=\"339\" srcset=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/hipervinculo.png 377w, https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/hipervinculo-300x270.png 300w\" sizes=\"auto, (max-width: 377px) 100vw, 377px\" \/><\/a>\n<p><span style=\"font-weight: 400;\">Hiperv\u00ednculo de imagen.-<\/span> <span style=\"font-weight: 400;\">Es un enlace asociado a una imagen y pueden ser botones, im\u00e1genes, gr\u00e1ficos, \u00edconos, etc. Cualquier imagen que se desee puede funcionar como un enlace, siempre y cuando tenga los atributos correctos para comunicar algo al usuario. Las im\u00e1genes (casi siempre GIF y JPEG) tienen mayor potencial, al poder ofrecer mayor variedad de apariencia que el texto HTML. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">El tama\u00f1o es un atributo que le permite al usuario intuir que la imagen funciona como un enlace. Cuando las im\u00e1genes son muy grandes pierden dicha cualidad\u00a0a los ojos del usuario. \u201cLos prop\u00f3sitos de los elementos est\u00e1n m\u00e1s claros todav\u00eda cuando se les incorpora un texto o una etiqueta \u2026\u201d (Eaton 62) Estos enlaces se caracterizan en ocasiones por imitar el funcionamiento de algunas herramientas con acciones espec\u00edficas. Al colocar una etiqueta se refuerza la acci\u00f3n del gr\u00e1fico, as\u00ed se le proporciona al usuario m\u00e1s informaci\u00f3n acerca de la acci\u00f3n que realiza el gr\u00e1fico, esto reduce el tiempo que el consumidor\u00a0emplea en comprender su funcionamiento. Ver figura 7.<\/span><\/p>\n<a href=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/hipervinculoimagen.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1449\" src=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/hipervinculoimagen.png\" alt=\"hipervinculoimagen\" width=\"553\" height=\"278\" srcset=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/hipervinculoimagen.png 553w, https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/hipervinculoimagen-300x151.png 300w\" sizes=\"auto, (max-width: 553px) 100vw, 553px\" \/><\/a>\n<p><span style=\"color: #000080;\">\u00cdconos<\/span><\/p>\n<p><span style=\"font-weight: 400;\">El \u00edcono es la representaci\u00f3n gr\u00e1fica de una idea, que sobrepasa las barreras del idioma, aunque se enfrenta con la desventaja de no interpretarse de la misma forma en todas las culturas. Los \u00edconos facilitan la comprensi\u00f3n de una tarea reduciendo el tiempo de respuesta del usuario. <\/span><\/p>\n<blockquote><p><span style=\"font-weight: 400;\">Los iconos son una excelente forma de representar ideas complejas en un espacio limitado. [\u2026] Sin embargo, los iconos no son siempre aclaratorios por s\u00ed mismos [\u2026] La mayor\u00eda de los usuarios est\u00e1n incomodos por el tiempo que les lleva aprender un nuevo sistema iconogr\u00e1fico en una interfaz Web. Puede proporcionar un texto descriptivo con el icono para hacerlo m\u00e1s \u00fatil, pero har\u00e1 que el icono no sea un medio de ahorro de espacio. El icono puede aparecer solo, con un texto explicatorio que se revela cuando el rat\u00f3n pasa por \u00e9l. (Eaton 68)<\/span><\/p><\/blockquote>\n<p><span style=\"font-weight: 400;\">La etiqueta de <\/span><i><span style=\"font-weight: 400;\">alt text<\/span><\/i><span style=\"font-weight: 400;\"> (texto alternativo) puede ser una caracter\u00edstica que permita a\u00f1adirle claridad a la imagen, pero se debe tener precauci\u00f3n de no usarla como la primera fuente de definici\u00f3n o bien colocar un texto muy largo dentro de esta etiqueta alternativa; ya que si se necesita dar una explicaci\u00f3n muy completa, quiere decir que la imagen no sirve para comunicar una acci\u00f3n. Ver figura 8.<\/span><\/p>\n<a href=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/iconosacciones.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1450\" src=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/iconosacciones.png\" alt=\"iconosacciones\" width=\"628\" height=\"453\" srcset=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/iconosacciones.png 628w, https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/iconosacciones-300x216.png 300w\" sizes=\"auto, (max-width: 628px) 100vw, 628px\" \/><\/a>\n<p><span style=\"color: #000080;\">Color<\/span><\/p>\n<p><span style=\"font-weight: 400;\">El color permite darle estructura a la informaci\u00f3n, mejorando as\u00ed la percepci\u00f3n del usuario; de esta forma se pueden categorizar los elementos por su grado de importancia dentro de la interfaz. Por otro lado el color tambi\u00e9n puede tener un efecto negativo, por eso se debe considerar que en las aplicaciones para pantalla, el uso de contrastes (tonalidades\u00a0que proporcionan mayor luminosidad), es el m\u00e1s adecuado. En ese sentido, la aplicaci\u00f3n correcta del color facilitar\u00e1 la compresi\u00f3n y lectura de las alertas del sistema. Ver figura 9.<\/span><\/p>\n<a href=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/alertas.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1451\" src=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/alertas.png\" alt=\"alertas\" width=\"732\" height=\"438\" srcset=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/alertas.png 732w, https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/alertas-300x180.png 300w\" sizes=\"auto, (max-width: 732px) 100vw, 732px\" \/><\/a>\n<p><span style=\"color: #000080;\">Botones<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Los botones son el medio que permite interactuar con el sistema, a estos se les asignan tareas espec\u00edficas. Adem\u00e1s, pueden dar inicio o fin a una acci\u00f3n. <\/span><\/p>\n<blockquote><p><span style=\"font-weight: 400;\">Los botones son los elementos m\u00e1s significativos dentro de las interfaces. Casi todas las comunicaciones importantes entre el humano y el ordenador se inician, verifican o ejecutan a trav\u00e9s de un bot\u00f3n. Usamos los botones cuando respondemos a los cuadros de di\u00e1logos, al mandar mensajes, y al movernos por la web. Para la mayor\u00eda de la gente, los botones son el medio primario de interacci\u00f3n con los ordenadores. (Eaton 81)<\/span><\/p><\/blockquote>\n<p><span style=\"font-weight: 400;\">La mayor\u00eda de los botones que realizan funciones espec\u00edficas se deben cargar r\u00e1pidamente, de esta forma la persona\u00a0no tendr\u00e1 que esperar para la ejecuci\u00f3n de una tarea. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">Tambi\u00e9n la apariencia de los botones ayuda a reforzar su utilidad, es decir, deben parecer lo que son. Cabe se\u00f1alar que no deben ser muy peque\u00f1os, ya que corren el riesgo de ser ignorados; tampoco deben ser extremadamente grandes, porque su aspecto se confunde con el de gr\u00e1ficos est\u00e1ticos. En la interfaz, el tama\u00f1o de los botones debe estandarizarse, con el fin de no generar confusi\u00f3n en el usuario dentro del sistema.<\/span><\/p>\n<blockquote><p><span style=\"font-weight: 400;\">El color tiene un triple efecto en la apariencia de los botones, el primero, cualquier color aplicado a un bot\u00f3n lo sit\u00faa bastante lejos sobre un bot\u00f3n normal del sistema. Segundo, el color tiene un efecto en la autonom\u00eda del bot\u00f3n, dependiendo de su contraste con respecto al del fondo de la interfaz. Tercero, afecta al significado del bot\u00f3n. (Eaton 96)<\/span><\/p><\/blockquote>\n<p><span style=\"font-weight: 400;\">Un bot\u00f3n cumple con una doble funci\u00f3n: facilitar una operaci\u00f3n y servir de etiqueta. Tambi\u00e9n se debe considerar a los <\/span><i><span style=\"font-weight: 400;\">\u00edtems<\/span><\/i><span style=\"font-weight: 400;\"> de un men\u00fa, como botones que ayudan a interactuar con la aplicaci\u00f3n. <\/span><\/p>\n<p><span style=\"color: #000080;\">Men\u00fa<\/span><\/p>\n<p><span style=\"font-weight: 400;\">El men\u00fa es una lista gr\u00e1fica de accesos a funciones espec\u00edficas dentro del sistema. Se presenta de forma estructurada y colocado en un lugar espec\u00edfico dentro de la interfaz.<\/span><\/p>\n<blockquote><p><span style=\"font-weight: 400;\">Normalmente los men\u00fas sintetizan una estructura de elementos de forma jer\u00e1rquica por niveles, representados de modo que se muestra una lista, tanto de forma horizontal como vertical de los elementos de un men\u00fa [\u2026] (Yulenis p\u00e1rr 3)<\/span><\/p><\/blockquote>\n<p><span style=\"font-weight: 400;\">Por lo tanto, el men\u00fa es un elemento de la interfaz que permite al usuario navegar c\u00f3moda y eficazmente a lo largo del sistema, de una forma secuencial o no secuencial. Se constituye como un atajo, por lo tanto debe estar siempre visible dentro de la interfaz, ya que cumple con una funci\u00f3n espec\u00edfica. Manteniendo un orden jer\u00e1rquico, es uno de los elementos de mayor importancia dentro de la interfaz. <\/span><\/p>\n<p><span style=\"color: #000080;\">Tipos de men\u00fa<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Existen diferentes tipos de men\u00fa: men\u00fas contextuales, men\u00fas de navegaci\u00f3n (<\/span><i><span style=\"font-weight: 400;\">scroll<\/span><\/i><span style=\"font-weight: 400;\">), men\u00fas jer\u00e1rquicos y men\u00fas de inicio. En el dise\u00f1o de interfaz para un sistema de administraci\u00f3n, se propone utilizar uno jer\u00e1rquico, a continuaci\u00f3n se explican sus caracter\u00edsticas.<\/span><\/p>\n<p><span style=\"color: #000080;\">Men\u00fa jer\u00e1rquico<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Est\u00e1 exhibido en forma de \u00e1rbol, donde las opciones principales se presentan en un mismo nivel y al ir presionando las diferentes opciones, muestran su contenido. Esto permite tener jerarqu\u00eda de la informaci\u00f3n y un control en las tareas, o acciones a realizar dentro del sistema. Este tipo de men\u00fa favorece la integraci\u00f3n de asignaciones o departamentos y da continuidad al flujo de informaci\u00f3n que se presenta al usuario. Ver figura 10.<\/span><\/p>\n<a href=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/menu.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1453\" src=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/menu.png\" alt=\"menu\" width=\"526\" height=\"393\" srcset=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/menu.png 526w, https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/menu-300x224.png 300w\" sizes=\"auto, (max-width: 526px) 100vw, 526px\" \/><\/a>\n<p><span style=\"font-weight: 400;\">Con base en lo expuesto se puede decir que los elementos de la interfaz son de vital importancia, para la realizaci\u00f3n de un entorno virtual adecuado. Por eso, sus caracter\u00edsticas deben establecerse desde un inicio, para que su funci\u00f3n sea clara y el mensaje se transmita de manera correcta. Con lo dicho se infiere que la persona es el protagonista en el uso de estos elementos, por ello hay que proporcionarle las herramientas necesarias para que cumpla con la tarea asignada. Por ello, se representa en un esquema estas consideraciones, para un sistema de administraci\u00f3n. Ver figura 11.<\/span><\/p>\n<a href=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/interfazadministracion.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1452\" src=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/interfazadministracion.png\" alt=\"interfazadministracion\" width=\"551\" height=\"472\" srcset=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/interfazadministracion.png 551w, https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/interfazadministracion-300x257.png 300w\" sizes=\"auto, (max-width: 551px) 100vw, 551px\" \/><\/a>\n<p><span style=\"font-weight: 400;\">A continuaci\u00f3n se establece la importancia de la usabilidad, su definici\u00f3n y qu\u00e9 preceptos son relevantes cumplir con el objetivo de este art\u00edculo, que es crear una interfaz usable.<\/span><\/p>\n<p><span style=\"color: #000080;\">4. Usabilidad<\/span><\/p>\n<p><span style=\"font-weight: 400;\">El t\u00e9rmino usabilidad hace referencia a la rapidez y facilidad con que la persona\u00a0alcanza sus objetivos a partir del uso de una herramienta. No es algo que se puede incorporar a un proyecto cuando est\u00e1 terminado; se debe considerar en todo momento. El usuario es el protagonista en el uso del sistema y es quien determina cuando es f\u00e1cil de emplear. Por ello se considera necesario definir usabilidad y m\u00e1s adelante se establece c\u00f3mo interviene en el dise\u00f1o centrado en el consumidor<\/span><span style=\"font-weight: 400;\">.<\/span><\/p>\n<p><span style=\"color: #000080;\">Definici\u00f3n de usabilidad<\/span><\/p>\n<p><span style=\"font-weight: 400;\">No se limita a los sistemas computacionales exclusivamente, sino que es un concepto aplicable a cualquier elemento en el cual se va a producir una interacci\u00f3n entre un humano y un dispositivo. Jakob Nielsen lo define como: <\/span><\/p>\n<blockquote><p><span style=\"font-weight: 400;\">Un atributo relacionado con la facilidad de uso. M\u00e1s espec\u00edficamente, se refiere a la rapidez con que se puede aprender a utilizar algo, la eficiencia al utilizarlo, cu\u00e1n memorable es, cu\u00e1l es su grado de propensi\u00f3n al error y cu\u00e1nto le gusta a los usuarios \u2026 (Nielsen y Loranger 17 2006)<\/span><\/p><\/blockquote>\n<p><span style=\"font-weight: 400;\">Se infiere que la usabilidad es la cualidad de un elemento para ser empleado\u00a0con facilidad, puede ser un sistema o una aplicaci\u00f3n, es un atributo que est\u00e1 determinado por m\u00faltiples factores, como la interfaz, el tipo de usuario y el objetivo de la aplicaci\u00f3n.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Steve Krug la define como \u201c\u2026 una cualidad de que algo funciona bien, y como resultado evitaremos la frustraci\u00f3n del usuario\u2026\u201d. (Krug 5) Es decir, la usabilidad es asegurarse de que algo funciona de manera correcta, cabe recordar que el objetivo es que el usuario cumpla con la tarea asignada, de una forma simple y sin llegar a la frustraci\u00f3n.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">La Asociaci\u00f3n de Profesionales de Usabilidad (<\/span><i><span style=\"font-weight: 400;\">UPA<\/span><\/i><span style=\"font-weight: 400;\">), dice que la usabilidad es el grado de facilidad de uso de un <\/span><i><span style=\"font-weight: 400;\">software<\/span><\/i><span style=\"font-weight: 400;\">, <\/span><i><span style=\"font-weight: 400;\">hardware<\/span><\/i><span style=\"font-weight: 400;\"> o cualquier otro producto y la forma como se acomoda a la gente que lo usa:<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Es una cualidad o caracter\u00edstica del producto.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Es si el producto es eficiente, efectivo y satisface a quienes lo usan.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Es el nombre de un grupo de t\u00e9cnicas desarrolladas por los profesionales de usabilidad para ayudar en la creaci\u00f3n de productos usables.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Es el nombre corto para un proceso o aproximaci\u00f3n a la creaci\u00f3n de esos productos, llamado, dise\u00f1o centrado en el usuario. (Usability Professional\u00b4s Association <\/span><i><span style=\"font-weight: 400;\">UPA<\/span><\/i><span style=\"font-weight: 400;\"> 1)<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Con base en lo expuesto, se concluye que la usabilidad es un concepto que se refiere a la facilidad de uso de un sistema, aplicaci\u00f3n web o producto. En ese sentido, el objetivo de una interfaz cuyo atributo principal es la usabilidad, es crear una aplicaci\u00f3n en donde a la persona\u00a0no le tome demasiado tiempo aprender la utilizaci\u00f3n\u00a0de las herramientas y elementos propios de la interfaz, es decir, que los maneje por intuici\u00f3n. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">Puesto que el usuario es el protagonista y es quien determina si la interfaz es lo suficientemente clara y sencilla para su empleo. A continuaci\u00f3n se establecen algunos principios de usabilidad de importancia para este texto. <\/span><\/p>\n<p><span style=\"color: #000080;\">Principios b\u00e1sicos de la usabilidad<\/span><\/p>\n<p><span style=\"font-weight: 400;\">A lo largo de este art\u00edculo, se menciona la importancia de conocer al tipo de usuario y sus necesidades antes de dise\u00f1ar una aplicaci\u00f3n, lo principal es entender al usuario. \u201cUn sitio bien estructurado ofrece a los usuarios lo que quieren cuando quieren.\u201d<\/span><i><span style=\"font-weight: 400;\"> (<\/span><\/i><span style=\"font-weight: 400;\">Nielsen y Loranger 137) Hay que enfatizar que usabilidad es la facilidad de uso del sistema y quien lo determina es la persona. Por ello es necesario mostrar las siguientes recomendaciones a considerar cuando se habla de usabilidad, seg\u00fan Jakob Nielsen: <\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">1.-Visibilidad del estado del sistema. El sistema debe siempre mantener a los usuarios informados del estado del sistema.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">2.-Utilizar el lenguaje de los usuarios. Utilizar convenciones del mundo real, haciendo que la informaci\u00f3n aparezca en un orden natural y l\u00f3gico.<\/span><\/p>\n<p style=\"padding-left: 30px;\">3.-\u00a0<span style=\"font-weight: 400;\">Control y libertad para el usuario. Es importante disponer de deshacer y rehacer.<\/span><\/p>\n<p style=\"padding-left: 30px;\">4.-<span style=\"font-weight: 400;\">Consistencia y est\u00e1ndares. Seguir las normas y convenciones de la plataforma sobre la que est\u00e1 implementando el sistema.<\/span><\/p>\n<p style=\"padding-left: 30px;\">5.-<span style=\"font-weight: 400;\">Prevenci\u00f3n de errores. Generar mensajes de error.<\/span><\/p>\n<p style=\"padding-left: 30px;\">6.-<span style=\"font-weight: 400;\">Minimizar la carga de la memoria del usuario. El usuario no deber\u00eda tener que recordar la informaci\u00f3n.<\/span><\/p>\n<p style=\"padding-left: 30px;\">7.-<span style=\"font-weight: 400;\">Flexibilidad y eficiencia de uso. Las instrucciones para el uso del sistema deben ser visibles o f\u00e1cilmente accesibles siempre que se necesiten.<\/span><\/p>\n<p style=\"padding-left: 30px;\">8.-<span style=\"font-weight: 400;\">Los di\u00e1logos est\u00e9ticos y dise\u00f1o minimalista. No deben contener la informaci\u00f3n que sea inaplicable o se necesite raramente.<\/span><\/p>\n<p style=\"padding-left: 30px;\">9.-\u00a0<span style=\"font-weight: 400;\">Ayudar a los usuarios a reconocer, diagnosticar y recuperarse de los errores. Los mensajes de error se deben expresar en un lenguaje claro, se debe indicar exactamente el problema.<\/span><\/p>\n<p style=\"padding-left: 30px;\">10.-\u00a0<span style=\"font-weight: 400;\">Ayuda y documentaci\u00f3n. Aunque es mejor si el sistema se puede usar sin documentaci\u00f3n, puede ser necesario disponer de ayuda y documentaci\u00f3n. \u00c9sta tiene que ser f\u00e1cil de buscar, centrada en las tareas del usuario, tener informaci\u00f3n de las etapas a realizar y que no sea muy extensa. (Rial 1)<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Dichas\u00a0consideraciones permiten tener una gu\u00eda para verificar que el sistema tiene como fundamento la usabilidad, con la finalidad de que\u00a0el consumidor\u00a0cumpla con la tarea asignada sin llegar a la frustraci\u00f3n.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">De acuerdo a las recomendaciones antes mencionadas, se proponen las siguientes reglas de usabilidad como base en el desarrollo de una interfaz en un sistema de administraci\u00f3n:<\/span><\/p>\n<p style=\"padding-left: 30px;\">1.-<span style=\"font-weight: 400;\">El estado del sistema siempre debe estar visible para el usuario.<\/span><\/p>\n<p style=\"padding-left: 30px;\">2.-<span style=\"font-weight: 400;\">El dise\u00f1o de la interfaz debe ser claro y f\u00e1cil de entender, esto se logra con una jerarqu\u00eda visual dentro de la p\u00e1gina, siendo claros sobre lo que se puede hacer <em>clic<\/em>.<\/span><\/p>\n<p style=\"padding-left: 30px;\">3.-<span style=\"font-weight: 400;\">Omitir las palabras innecesarias, el usuario no lee, hojea.<\/span><\/p>\n<p style=\"padding-left: 30px;\">4.-<span style=\"font-weight: 400;\">Utilizar convenciones, esto permite al usuario sentir familiaridad con la aplicaci\u00f3n proporcionando pistas conocidas para \u00e9l, como por ejemplo, emplear\u00a0el icono de una impresora.<\/span><\/p>\n<p style=\"padding-left: 30px;\">5.-<span style=\"font-weight: 400;\">Darle libertad al usuario y ayudarlo generando mensajes de error que le permitan volver.<\/span><\/p>\n<p style=\"padding-left: 30px;\">6.-<span style=\"font-weight: 400;\">Ayuda y documentaci\u00f3n. Las instrucciones para el uso de tareas a realizar deben ser visibles o f\u00e1cilmente accesibles siempre que se necesiten.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Como se ha podido observar, la usabilidad tiene un papel fundamental en el desarrollo de un sistema de administraci\u00f3n y trabaja en conjunto con la interfaz, en donde se comparte un fin com\u00fan que es satisfacer al usuario. Una vez establecido esto, es necesario explicar el Dise\u00f1o Centrado en el Usuario (DCU), as\u00ed como su importancia. <\/span><\/p>\n<p><span style=\"color: #000080;\">Dise\u00f1o Centrado en el Usuario (DCU)<\/span><\/p>\n<p><span style=\"font-weight: 400;\">El DCU tiene por objeto satisfacer las necesidades del usuario.<\/span><\/p>\n<blockquote><p><span style=\"font-weight: 400;\">El Dise\u00f1o Web Centrado en el Usuario se caracteriza por asumir que todo el proceso de dise\u00f1o y desarrollo del sitio web debe estar conducido por el usuario, sus necesidades, caracter\u00edsticas y objetivos. (Hassan, Fern\u00e1ndez, Iazza 26)<\/span><\/p><\/blockquote>\n<p><span style=\"font-weight: 400;\">El DCU es un proceso en el dise\u00f1o de la interfaz que pone especial atenci\u00f3n en los objetivos de usabilidad, caracter\u00edsticas y tareas espec\u00edficas del usuario. Para ampliar la idea del t\u00e9rmino DCU, se presenta otra definici\u00f3n proporcionada por la UPA Usability Professional\u00b4s Association.<\/span><\/p>\n<blockquote><p><span style=\"font-weight: 400;\">El dise\u00f1o centrado en el usuario <\/span><i><span style=\"font-weight: 400;\">DCU<\/span><\/i><span style=\"font-weight: 400;\"> es un dise\u00f1o que focaliza el proceso en la informaci\u00f3n de los usuarios del producto. Los procesos del dise\u00f1o centrado en el usuario se centran en los usuarios mediante la planeaci\u00f3n, el dise\u00f1o y desarrollo de un producto. (UPA 2)<\/span><\/p><\/blockquote>\n<p><span style=\"font-weight: 400;\">A partir de esto, se concluye que el DCU, es aquel que tiene como finalidad satisfacer las necesidades del usuario, esto implica involucrarlo desde el inicio en el proceso de desarrollo; conocer c\u00f3mo es, qu\u00e9 necesita, para qu\u00e9 se utiliza la aplicaci\u00f3n. Esto permite establecer un panorama m\u00e1s amplio de su experiencia y el objetivo que se desea alcanzar. Adem\u00e1s: \u201cEs fundamental seguir una rigurosa metodolog\u00eda de dise\u00f1o, una actitud centrada en el usuario, en etapas iniciales y durante el dise\u00f1o, que contemple los principios que se tratan\u201d. (Fundaci\u00f3n SIDAR, 9) Ya que un buen dise\u00f1o puede representar una diferencia positiva para el usuario, facilitando el proceso de desarrollo.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">As\u00ed, se concluye que para construir una interfaz usable, es importante conocer los principios b\u00e1sicos de usabilidad y qui\u00e9n ser\u00e1 el usuario final de la aplicaci\u00f3n. Por ello es importante establecer, c\u00f3mo es el usuario, cu\u00e1les son sus necesidades y de qu\u00e9 forma interact\u00faa con la aplicaci\u00f3n para cumplir con su objetivo. A continuaci\u00f3n se proponen unos puntos fundamentales para el desarrollo de una interfaz usable: <\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Establecer los alcances y objetivos del proyecto.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Conocer al usuario (DCU).<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">El dise\u00f1o de la aplicaci\u00f3n debe ser claro y f\u00e1cil de entender.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Los elementos de la interfaz deber\u00e1n cumplir con las recomendaciones antes mencionadas.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Utilizar convenciones que nos permitan acortar la curva de aprendizaje del sistema.<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Darle libertad al usuario y control del sistema (margen de error).<\/span><\/p>\n<p style=\"padding-left: 30px;\"><span style=\"font-weight: 400;\">Proporcionarle ayuda y documentaci\u00f3n como orientaci\u00f3n de las tareas a realizar.<\/span><\/p>\n<a href=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/interfaz2.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1455\" src=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/interfaz2.png\" alt=\"interfaz2\" width=\"311\" height=\"261\" srcset=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/interfaz2.png 311w, https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/interfaz2-300x252.png 300w\" sizes=\"auto, (max-width: 311px) 100vw, 311px\" \/><\/a>\n<p><span style=\"color: #000080;\">Conclusi\u00f3n<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Seg\u00fan el planteamiento inicial<\/span> <span style=\"font-weight: 400;\">\u00bfqu\u00e9 estructura con base en la usabilidad debe tener la interfaz de un sistema de administraci\u00f3n? Su respuesta inicial se\u00f1alaba que: una estructura usable, debe considerar los elementos de la interfaz, organizar im\u00e1genes e informaci\u00f3n y entonces, la comunicaci\u00f3n ser\u00e1 eficaz. De acuerdo a la investigaci\u00f3n de este art\u00edculo se concluye que la interfaz, la usabilidad y el usuario son los tres elementos fundamentales a tomar en cuenta en la planeaci\u00f3n, dise\u00f1o y desarrollo de un sistema de administraci\u00f3n. Son elementos que comparten cualidades y caracter\u00edsticas, es decir, todos ellos forman una unidad y debe haber un equilibrio entre ellos. Sin embargo, en esa respuesta no se ten\u00eda en cuenta la importancia del usuario y su experiencia con respecto al uso del sistema de administraci\u00f3n. Ahora se sabe gracias a la investigaci\u00f3n realizada que el usuario juega un papel fundamental en el desarrollo del sistema, ya que es \u00e9l quien determina si el sistema es usable o no; es por eso que un sistema de administraci\u00f3n sin una interfaz usable no es funcional. La interfaz, la usabilidad y el usuario son factores que determinan la eficacia en el funcionamiento del sistema. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">Por lo tanto, se debe ser minucioso en el proceso de dise\u00f1o, cuidando los aspectos m\u00e1s relevantes, porque ser\u00e1 el usuario quien de la pauta para establecer los alcances y con ello definir los objetivos del proyecto, en tanto la meta final siempre sea satisfacer las necesidades y facilitar la ejecuci\u00f3n de las tareas de \u00e9l. <\/span><\/p>\n<a href=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/sistemadeadmon.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1456\" src=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/sistemadeadmon.png\" alt=\"sistemadeadmon\" width=\"794\" height=\"458\" srcset=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/sistemadeadmon.png 794w, https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/sistemadeadmon-300x173.png 300w, https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/sistemadeadmon-768x443.png 768w\" sizes=\"auto, (max-width: 794px) 100vw, 794px\" \/><\/a>\n<p><span style=\"font-weight: 400;\">Por otro lado, en la actualidad la tendencia busca crear interfaces que muestren un dise\u00f1o limpio, que centre su objetivo en el usuario. En el caso de inter\u00e9s de este trabajo, es necesario proporcionar s\u00f3lo las funciones espec\u00edficas del negocio al cual est\u00e1 dirigido el sistema de administraci\u00f3n, para planificar, controlar los recursos y los procesos de una empresa. Adem\u00e1s, tomando como premisa las consideraciones vistas a lo largo del art\u00edculo, crear sistemas de gesti\u00f3n empresarial con estructuras hechas a medida, es de vital importancia para que el usuario tenga acceso a diferentes herramientas o m\u00f3dulos y sea \u00e9l quien gestione cual es la m\u00e1s adecuada para el negocio. Porque como ya se dijo, la base de la usabilidad es el usuario. A continuaci\u00f3n se muestra en la figura 13, un ejemplo de un sistema de administraci\u00f3n de c\u00f3digo abierto, que toma como fundamento\u00a0algunas de las consideraciones mencionadas a lo largo del art\u00edculo, que son muy acertadas.<\/span><\/p>\n<a href=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/ux.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1457\" src=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/ux.png\" alt=\"ux\" width=\"639\" height=\"507\" srcset=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/ux.png 639w, https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/ux-300x238.png 300w\" sizes=\"auto, (max-width: 639px) 100vw, 639px\" \/><\/a>\n<p><span style=\"font-weight: 400;\">Dicho\u00a0sistema tiene diferentes m\u00f3dulos para el usuario, con la finalidad de cubrir las necesidades del negocio, para que \u00a0pueda acceder a ellas de una forma eficaz. El modelo de <\/span><i><span style=\"font-weight: 400;\">ODOO<\/span><\/i><span style=\"font-weight: 400;\"> se centra en ofrecer usabilidad en los diferentes m\u00f3dulos al presentar un dise\u00f1o amigable al usuario. Como se observa en la figura 13, el uso de \u00edconos permite el acceso r\u00e1pido a las diferentes tareas de la persona\u00a0facilitando su actividad dentro de la empresa, como ejemplo un calendario para agendar citas; del mismo modo el uso del color marca una diferencia entre el texto corrido y los <\/span><i><span style=\"font-weight: 400;\">links<\/span><\/i><span style=\"font-weight: 400;\"> dentro del sistema, cabe mencionar que existe otro color que es exclusivo del men\u00fa principal (jer\u00e1rquico), esto evita confusiones. <\/span><\/p>\n<p><span style=\"font-weight: 400;\">Otra caracter\u00edstica que considero favorable es el uso de gr\u00e1ficas que facilitan la lectura y comprensi\u00f3n del rendimiento de la empresa. A continuaci\u00f3n se presenta el m\u00f3dulo de estad\u00edsticas y flujo de ventas del mismo sistema, en dicho\u00a0ejemplo el uso de diferentes tama\u00f1os en la tipograf\u00eda permite al usuario tener una jerarqu\u00eda de la informaci\u00f3n accediendo r\u00e1pidamente a los datos mas relevantes. Ver figura 14.<\/span><\/p>\n<a href=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/crm.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1458\" src=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/crm.png\" alt=\"crm\" width=\"611\" height=\"321\" srcset=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/crm.png 611w, https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-content\/uploads\/2016\/10\/crm-300x158.png 300w\" sizes=\"auto, (max-width: 611px) 100vw, 611px\" \/><\/a>\n<p><span style=\"font-weight: 400;\">Por \u00faltimo, cabe decir que el futuro de los sistemas de administraci\u00f3n es que cada vez sean m\u00e1s simples y f\u00e1ciles de usar, que permitan movilidad y accesibilidad, manteniendo segura la informaci\u00f3n. Lo cual implica construir interfaces adecuadas para su visualizaci\u00f3n en dispositivos m\u00f3viles, como <\/span><i><span style=\"font-weight: 400;\">smartphones<\/span><\/i><span style=\"font-weight: 400;\"> y <\/span><i><span style=\"font-weight: 400;\">tablets<\/span><\/i><span style=\"font-weight: 400;\">, con el fin de acceder al sistema desde cualquier lugar. Porque existe la posibilidad de alojar informaci\u00f3n en la nube (<\/span><i><span style=\"font-weight: 400;\">cloud computing<\/span><\/i><span style=\"font-weight: 400;\">), para que est\u00e9 disponible en cualquier momento. Por eso, la prioridad debe ser el desarrollo de interfaces simples y usables, que resuelvan las necesidades del usuario y repercuta en mejoras para la empresa.<\/span><\/p>\n<p><span style=\"font-size: 10pt; color: #000080;\">Notas<\/span><\/p>\n<p><span style=\"font-size: 10pt;\">1 En lo que compete a este art\u00edculo cuando se hable de interfaz nos referimos a interfaz gr\u00e1fica de usuario. Tomando como base que la interfaz gr\u00e1fica de usuario es el medio que el usuario utiliza para interactuar con el sistema.<\/span><\/p>\n<p><span style=\"color: #000080; font-size: 10pt;\">Fuentes de Consulta<\/span><\/p>\n<p><span style=\"font-size: 10pt;\"><span style=\"font-weight: 400;\">Eaton, Eric. <\/span><i><span style=\"font-weight: 400;\">Dise\u00f1o web. Elementos de Interfaz.<\/span><\/i><span style=\"font-weight: 400;\"> Madrid: Anaya Multimedia, 2003. Impreso<\/span><\/span><\/p>\n<p><span style=\"font-size: 10pt;\"><span style=\"font-weight: 400;\">Fundaci\u00f3n, SIDAR. \u201cPrincipios del Dise\u00f1o Centrado en el Usuario\u201d. <\/span><i><span style=\"font-weight: 400;\">SIDAR. <\/span><\/i><span style=\"font-weight: 400;\">Alejandro Flor\u00eda Cort\u00e9s. Febrero 2000. Web. 16 Julio 2003. &lt;<\/span><a href=\"http:\/\/www.sidar.org\/recur\/desdi\/traduc\/es\/visitable\/quees\/dcu.htm\"><span style=\"font-weight: 400;\">http:\/\/www.sidar.org\/recur\/desdi\/traduc\/es\/visitable\/quees\/dcu.htm<\/span><\/a><span style=\"font-weight: 400;\">&gt;<\/span><\/span><\/p>\n<p><span style=\"font-size: 10pt;\"><span style=\"font-weight: 400;\">Hassan, Yusef &amp; Fern\u00e1ndez Mart\u00edn, Francisco &amp; Iazza Ghzala. <\/span><i><span style=\"font-weight: 400;\">Dise\u00f1o Web Centrado en el Usuario: Usabilidad y Arquitectura de la Informaci\u00f3n<\/span><\/i><span style=\"font-weight: 400;\">. N\u00famero 2, 2014, Hipertext.net. 5 Junio 2012. Web.<\/span><span style=\"font-weight: 400;\">&lt;<\/span><a href=\"https:\/\/www.upf.edu\/hipertextnet\/numero-2\/diseno_web.html\"><span style=\"font-weight: 400;\">https:\/\/www.upf.edu\/hipertextnet\/numero-2\/diseno_web.html<\/span><\/a><span style=\"font-weight: 400;\">&gt;<\/span><\/span><\/p>\n<p><span style=\"font-size: 10pt;\"><span style=\"font-weight: 400;\">Krug, Steve. <\/span><i><span style=\"font-weight: 400;\">No me hagas pensar. <\/span><\/i><span style=\"font-weight: 400;\">2nda. edici\u00f3n. Madrid: Prentice Hall, 2006. Impreso.<\/span><\/span><\/p>\n<p><span style=\"font-size: 10pt;\"><span style=\"font-weight: 400;\">Nielsen, Jakob. <\/span><i><span style=\"font-weight: 400;\">Usabilidad Dise\u00f1o de Sitios Web.<\/span><\/i><span style=\"font-weight: 400;\"> M\u00e9xico: Prentice Hall, 2000. Impreso.<\/span><\/span><\/p>\n<p><span style=\"font-size: 10pt;\"><span style=\"font-weight: 400;\">Nielsen, Jakob &amp; Hoa Loranger. <\/span><i><span style=\"font-weight: 400;\">Usabilidad: Prioridad en el dise\u00f1o web. <\/span><\/i><span style=\"font-weight: 400;\">Madrid: Anaya Multimedia, 2006. Impreso.<\/span><\/span><\/p>\n<p><span style=\"font-size: 10pt;\"><span style=\"font-weight: 400;\">Norman,Donald A. <\/span><i><span style=\"font-weight: 400;\">La psicolog\u00eda de los objetos cotidianos.<\/span><\/i><span style=\"font-weight: 400;\"> Madrid: Nerea, 1988. Impreso<\/span><\/span><\/p>\n<p><span style=\"font-size: 10pt;\"><span style=\"font-weight: 400;\">Rial, Sebasti\u00e1n. \u201cJakob Nielsen, 10 reglas heur\u00edsticas de usabilidad\u201d. <\/span><i><span style=\"font-weight: 400;\">Sebasti\u00e1n Rial, Gesti\u00f3n de Dise\u00f1o, Capacitaci\u00f3n y Consultor\u00eda. <\/span><\/i><span style=\"font-weight: 400;\">Sebasti\u00e1n Rial. 2 Agosto 2012. Web. 13 Octubre 2014. \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 \u00a0 &lt;<\/span><a href=\"http:\/\/sebastianrial.hol.es\/works\/jakob-nielsen-10-reglas-heuristicas-de-usabilidad-para-el-diseno-de-interfaz-de-usuario\"><span style=\"font-weight: 400;\">http:\/\/sebastianrial.hol.es\/works\/jakob-nielsen-10-reglas-heuristicas-de-usabilidad-para-el-diseno-de-interfaz-de-usuario<\/span><\/a><span style=\"font-weight: 400;\"> &gt;<\/span><\/span><\/p>\n<p><span style=\"font-size: 10pt;\"><span style=\"font-weight: 400;\">Royo, Javier. <\/span><i><span style=\"font-weight: 400;\">Dise\u00f1o Digital.<\/span><\/i><span style=\"font-weight: 400;\"> Barcelona: Paid\u00f3s Ib\u00e9rica, 2004. Impreso.<\/span><\/span><\/p>\n<p><span style=\"font-size: 10pt;\"><span style=\"font-weight: 400;\">Scolari, Carlos. \u201cLos usos de Nielsen. Para una cr\u00edtica de la ideolog\u00eda de la usabilidad.\u201d <\/span><i><span style=\"font-weight: 400;\">Cibermemoria.<\/span><\/i><span style=\"font-weight: 400;\"> s\/d, s\/m, 2001. 16 Diciembre 2015. Web.&lt;<\/span><a href=\"https:\/\/cibermemo.wordpress.com\/2015\/12\/16\/2001-los-usos-de-nielsen-para-una-critica-de-la-ideologia-de-la-usabilidad\/\"><span style=\"font-weight: 400;\">https:\/\/cibermemo.wordpress.com\/2015\/12\/16\/2001-los-usos-de-nielsen-para-una-critica-de-la-ideologia-de-la-usabilidad\/<\/span><\/a><span style=\"font-weight: 400;\">&gt;<\/span><\/span><\/p>\n<p><span style=\"font-size: 10pt;\"><span style=\"font-weight: 400;\">Shneiderman, Ben &amp; Catherine Plaisant. <\/span><i><span style=\"font-weight: 400;\">Dise\u00f1o de Interfaces de Usuario: Estrategias para una interacci\u00f3n persona &#8211; computador efectiva.<\/span><\/i><span style=\"font-weight: 400;\"> Pearson Alhambra, 2005. Impreso<\/span><\/span><\/p>\n<p><span style=\"font-size: 10pt;\"><span style=\"font-weight: 400;\">UPA. Usability Professionals&#8217; Association. \u201cEst\u00e1ndares internacionales. Gu\u00edas y m\u00e9todos.\u201d<\/span><i><span style=\"font-weight: 400;\"> UXPA. <\/span><\/i><span style=\"font-weight: 400;\">User Experience Professionals Association.<\/span><\/span><\/p>\n<ol start=\"2008\">\n<li><span style=\"font-size: 10pt;\"><span style=\"font-weight: 400;\"> Web. 10 julio 2013. <\/span><span style=\"font-weight: 400;\"><a href=\"http:\/\/www.usabilityprofessionals.org\/usability_resources\/guidelines_and_methods\/standards.html\">http:\/\/www.usabilityprofessionals.org\/usability_resources\/guidelines_and_methods\/standards.html<\/a><\/span><\/span><\/li>\n<\/ol>\n<p><span style=\"font-size: 10pt;\"><span style=\"font-weight: 400;\">Yulenis. \u201cElementos interactivos de la interfaz gr\u00e1fica\u201d texto. <\/span><i><span style=\"font-weight: 400;\">Blogger<\/span><\/i><span style=\"font-weight: 400;\">. Blogger. 27 Abril 2011. Web. 06 Julio 2013 &lt; <\/span><a href=\"http:\/\/interfaz-yulenis4.blogspot.mx\/\"><span style=\"font-weight: 400;\">http:\/\/interfaz-yulenis4.blogspot.mx\/<\/span><\/a><span style=\"font-weight: 400;\">&gt;<\/span><\/span><\/p>\n<p><b>El Autor<\/b><\/p>\n<p><span style=\"font-weight: 400;\">Ireri Mitzi Hern\u00e1ndez Toledo naci\u00f3 el 3 de Mayo de 1981, es licenciado en Dise\u00f1o Gr\u00e1fico por la Universidad La Salle 2003, dentro de mi formaci\u00f3n acad\u00e9mica he tomado algunos cursos que complementen mi actividad profesional como son: Creaci\u00f3n de p\u00e1ginas web 2005, Action script 2007.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Como dise\u00f1adora gr\u00e1fica he tenido la oportunidad de colaborar para diversas instituciones y despachos desde 2004, entre ellos, BDM M\u00e9xico 2004, Ike! La boutique Creativa 2005, Gamol 2007, SBB Savitzky Brand Building 2008, Nuts &amp; Bolts Marketing 2013, Suburbia 2014. En 2015 nace Nikmati, un despacho propio dedicado a los servicios de comunicaci\u00f3n gr\u00e1fica, que junto con mi socio Eduardo Cabrera Pilar nace del gusto por el dise\u00f1o y la inquietud de seguir creciendo en esta \u00e1rea, nuestro principal objetivo, es crear alianzas positivas con nuestros clientes y colaborar en el crecimiento de los mismos. Hemos colaborado con algunas empresas como Invenova, Instituto Mariano Moreno, Galenus, Imperio Artesanal, por mencionar algunos. <\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Este trabajo expone la importancia de una interfaz usable en un sistema de administraci\u00f3n. La interfaz es el medio que nos conecta con los objetos que utilizamos a diario, por eso es importante que sean f\u00e1ciles de utilizar, para que el usuario cumpla con la meta que se proponga. En este art\u00edculo se muestran los&#8230;  <a class=\"excerpt-read-more\" href=\"https:\/\/entretejidos.iconos.edu.mx\/thesite\/la-importancia-de-una-interfaz-usable-en-un-sistema-de-administracion\/\" title=\"Read La importancia de una interfaz usable en un sistema de administraci\u00f3n\">Leer m\u00e1s &raquo;<\/a><\/p>\n","protected":false},"author":49,"featured_media":1502,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[5],"tags":[300,299,297,32,298,75],"coauthors":[278],"class_list":["post-1441","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-diseno-comunicacion-digital","tag-arquitectura-de-la-informacion","tag-experiencia-de-usuario-ux","tag-hipertextos","tag-interfaz","tag-usabilidad","tag-usuario"],"acf":[],"_links":{"self":[{"href":"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-json\/wp\/v2\/posts\/1441","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-json\/wp\/v2\/users\/49"}],"replies":[{"embeddable":true,"href":"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-json\/wp\/v2\/comments?post=1441"}],"version-history":[{"count":12,"href":"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-json\/wp\/v2\/posts\/1441\/revisions"}],"predecessor-version":[{"id":3728,"href":"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-json\/wp\/v2\/posts\/1441\/revisions\/3728"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-json\/wp\/v2\/media\/1502"}],"wp:attachment":[{"href":"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-json\/wp\/v2\/media?parent=1441"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-json\/wp\/v2\/categories?post=1441"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-json\/wp\/v2\/tags?post=1441"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/entretejidos.iconos.edu.mx\/thesite\/wp-json\/wp\/v2\/coauthors?post=1441"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}