Estudiantes Internacionales Estudiantes Internacionales en la Universidad de Palermo Reuniones informativas MyUP
Universidad de Palermo - Buenos Aires, Argentina

Facultad de Diseño y Comunicación Inscripción Solicitud de información

  1. Diseño y Comunicación >
  2. Publicaciones DC >
  3. Actas de Diseño Nº 32 >
  4. Diseño web más allá de la estética

Diseño web más allá de la estética

Jiménez, Raúl

Actas de Diseño Nº 32

Actas de Diseño Nº 32

ISSN Impresión 1850-2032
ISSN Online: 2591-3735
DOI: https://doi.org/https://doi.org/10.18682/add.vi32

XIV Encuentro Latinoamericano de Diseño “Diseño en Palermo” X Congreso Latinoamericano de Enseñanza del Diseño Comunicaciones Académicas

Marzo 2020, Año 14, Vol. 32, Buenos Aires, Argentina | 260 páginas

descargar PDF ver índice de la publicación

Ver todos los libros de la publicación

compartir en Facebook


Licencia Creative Commons Esta obra está bajo una Licencia Creative Commons Atribución-NoComercial-CompartirIgual 4.0 Internacional

Diseño web más allá de la estética

Raúl Jiménez (*)

Resumen: Diseño web más allá de la estética es un análisis sobre la experiencia docente y las fuentes de inspiración bibliográfica en el campo del diseño de contenidos digitales que tiene el propósito de cambiar la percepción sobre diseño web/multimedia al referirlo tan solo como la parte estética o visual de una interfaz, cuando al contrario el diseño juega un papel fundamental en el planteamiento de estructuras, sistema de navegación, sistema de interacción, etc. Esto implica manejar herramientas, metodologías, estándares y softwares especializados que aseguren la funcionalidad y accesibilidad de la misma desde la ideación hasta el desarrollo. De ahí que la investigación, el diseño y el prototipado son parte esencial dentro del desarrollo de productos digitales interactivos.

Palabras clave: Diseño - diseño web - interfaz gráfica de usuario - percepción - comunicación.

[Resúmenes en inglés y portugués y currículum en p. 123]

“El medio es el mensaje”.

Marshall McLuhan

McLuhan, uno de los reconocidos estudiosos de los medios de comunicación, planteó el aforismo “El medio es el mensaje”. Punto de críticas constantes, sin embargo el autor, con una perspectiva visionaria, profetisa el fenómeno que en la actualidad empieza a evidenciarse. Según el artículo La tecnología, extensión y amputación del ser humano de Lance Strate (2012), vivimos en un cambio de época donde los medios y la tecnología se han constituido como extensiones del ser humano.

El medio se transforma en una necesidad física que se ajusta a las nuevas tendencias. Por ejemplo, el teclado del ordenador remplaza a la máquina de escribir, el CD remplaza al disco de vinilo, la fotografía remplaza a la pintura, etc. Si esta visión la contextualizamos a la época actual, los dispositivos móviles, por ejemplo, se han constituido en una parte esencial del quehacer diario de las personas. A través de ellos es común vernos hacer tareas como leer un libro, ver una película, comprar; en fin, una serie de actividades que forman parte de nuestra cotidianidad y el diseño debe resolver cada uno de estos contextos considerando escenarios muy complejos, entre los cuales se puede mencionar la movilidad, el tamaño de la pantalla, etc.

El diseño no solo resuelve problemas de comunicación, también debe considerar aspectos técnicos, logísticos, entre otros. A través del diseño se ha podido brindar comodidad y resolver problemas que han facilitado el desenvolvimiento humano. El diseño web no es la excepción. Los usuarios y los medios cada vez exigen mayores condiciones. Hoy no se habla de usuarios solamente, la visualización de la información y de contenidos también está limitada al terminal y bajo este principio el usuario consume datos en distintos dispositivos, que condicionan al diseño y la manera de desplegar una misma información.

Por ende, existe una doble limitación: por un lado, conocer las necesidades y objetivos del usuario y, por otro, determinar las condiciones y características del dispositivo. Por esto es importante que se adopte una serie de metodologías, procedimientos y técnicas que permitan y aseguren que la interfaz sea intuitiva, fácil de usar, visualmente atractiva y capaz de comunicar de forma inmediata qué es y para qué sirve.

El diseño web no tiene una definición concreta única; sin embargo, es una de las áreas del diseño que ha podido marcar su discurso gracias a la relación con el desarrollo de la tecnología y áreas de la informática. Ligado a la resolución de problemas de organización, se basa en la analogía de las experiencias reales transformadas al mundo digital, donde el espacio físico se transforma, en relación a la percepción de cada usuario. La narrativa se convierte en una representación gráfica visual enriquecida (metáforas visuales) que hace más comprensible la información. La web se ha convertido en un medio donde convergen una serie de disciplinas y tecnologías. Por tanto, debe resolver un conjunto de factores tanto humanos como tecnológicos, que no son cuestión de una sola persona. El diseño en general reúne a un grupo de profesionales con distintas capacidades y aptitudes que aplican un conjunto de principios teórico-conceptuales, métodos, herramientas y procesos prácticos.

El diseño web está determinado por experiencias de usuario ligadas directamente al campo de la percepción humana individual y de masas. Es uno de los temas de mayor controversia en los profesionales del diseño ya que muchas veces se lo ha ligado únicamente al manejo de una plataforma o la valoración estética, dejando en un segundo plano todas las relaciones que implica en este intercambio de información (interacción) que no es visible al usuario. Este lo asimila como algo obvio y evidente, fenómeno que se da por modelos mentales establecidos en el tiempo, generados a través de un cúmulo de experiencias que, en el campo del diseño, ha servido para definir estándares o patrones de diseño, considerando a la interfaz gráfica como un punto de encuentro entre usuario y dispositivo. Es la instancia capaz de generar emociones, reacciones, sensaciones y, por supuesto, conocimiento, considerando que la experiencia es el medio por el cual cada individuo se conecta emocionalmente con el mundo. Experimentar algo implica un complejo rango de procesos psicológicos como lo menciona Krishnan & Rajamanickam (2004). “El diseño de experiencias es un paradigma emergente, una invocación a la inclusión: realiza un llamamiento a la práctica integradora del diseño, que puede beneficiar a todos los diseñadores, incluyendo a los que trabajan en los nuevos medios interactivos” (Bob Jacobson, 2000). El diseño de interfaz debe interpretar y traducir la información en códigos visuales, sonoros, hasta incluso objetuales. Debemos abordar al diseño con una visión holística con el fin de cumplir una serie funciones entre los cuales se pueden considerar la función estética (sencilla, clara, legible, llamativa, consistente, etc.), funcional (flexible, intuitiva, adaptable, etc.) e informativa (que comunique algo).

Muchas veces segados por las bondades de la tecnología hemos olvidado la simplicidad de las cosas. Pensamos que la complejidad de una interfaz está ligada a la calidad de la misma, al ofrecer una gran cantidad de opciones generando estructuras sobrecargadas, confundiendo al usuario que muchas veces no logra una adecuada interpretación. Debemos comprender que la interfaz es la única capaz de construir un mensaje de inclinación al deseo de usar, manipular o comprar. La interfaz no es únicamente gráfica, también puede ser objetual: si esta no cumple su papel terminará en una mala experiencia de usuario y en frustración, indicador absoluto de un inadecuado diseño y planificación. Es importante establecer una serie de evaluaciones con el propósito de corregir errores desde etapas muy tempranas, que permitan asegurar su correcto desarrollo. La evaluación es un instrumento que nos permite localizar, descubrir defectos y mejorarlos.

Toda interfaz está destinada a comunicar y mostrar información: esto permite la interacción con el usuario. Si no existe la información necesaria, organizada y estructurada adecuadamente la interacción no se produce. En este sentido, validamos que la interfaz no sea solamente un elemento decorativo y que se convierta en un instrumento interpretativo. Si este proceso no estuviese desarrollado correctamente no existiría retroalimentación y el proceso de interacción fracasaría.

El diseño de información y la arquitectura de la información son quizá las áreas vinculantes dentro del diseño de interfaces y por ende del diseño web. Se debe aclarar que el diseño de la información tiene este aspecto vinculado a la estética visual donde la información en muchas ocasiones es tratada como una mercancía logrando el objetivo de captar la atención del usuario, mientras que la arquitectura de la información tiene entre sus principios la estructura, organización, búsqueda y recuperación de la información. Juntas deben buscar una relación simbiótica.

En el caso del diseño de información lo que prima es la memoria y la percepción determinada por el modelo visual-auditivo-kinestésico (VAK) permitiendo a los usuarios la representación de la información a través de un complicado sistema mental. La memoria juega un papel fundamental para Lankow, Ritchie y Crooks (2013). Según ellos, tiene tres estados 1) la memoria icónica que es instantánea y retiene la información por un corto tiempo, 2) la memoria de trabajo visual que procesa la información y 3) la memoria semántica de largo plazo que relaciona a los referentes, el significado y el significante. En este sentido la Semiótica con su respectivo estudio de los signos, símbolos y sus significados es parte fundamental en el diseño. Es preciso destacar que la información puede ser estática, dinámica o interactiva, lo que implica que en cada uno de los casos se requiere de un tratamiento específico y riguroso. El medio tecnológico en sí determina la diferenciación en la construcción del mensaje. La información en el mundo digital se transforma y se dinamiza. Los contenidos digitales tienen aspectos que no podemos separar por su naturaleza. Por nombrar algunas de estas características tenemos: la transferencia ligado a la movilidad, a la capacidad de trasladarse de un punto a otro sin mucha dificultad en un tiempo muy corto y a una gran cantidad de usuarios; los múltiples dispositivos pueden ser visualizados en distinto medios tecnológicos indistintamente del sistema o plataforma; los múltiples formatos: los contenidos digitales permiten esta experiencia multimedial (varias tecnologías) imágenes, videos, textos, animaciones, audio, etc. En fin, existe un gran número de atributos sobre los contenidos digitales como lo menciona Camus (2014) en su obra Tienes 5 segundos. Estas características hacen de su tratamiento un proceso organizado.

“Vivimos condenados a entendernos con la tecnología, una tecnología que ha invadido progresivamente todos los aspectos de nuestra vida” (Montero, 2015). La interfaz gráfica no es una novedad: ha sido causa de estudio desde hace mucho tiempo atrás más conocido como Human Computer Interaction (HCI) que, traducido al español, sería Interacción Hombre Máquina. De esta se dispersan un sin número de ramas, como la arquitectura de la información, la visualización de datos, la interfaz gráfica de usuario, el diseño de experiencias de usuario, usabilidad, funcionalidad, accesibilidad, etc. La usabilidad es el grado de “eficacia, eficiencia y satisfacción con la que usuarios específicos pueden lograr objetivos específicos, en contextos específicos” (ISO 9241-11: Guidance on Usability, 1998). Está compuesto por dos atributos:

•Cuantificables de forma objetiva: Eficacia o número de errores cometidos por el usuario para completar una tarea, y eficiencia o tiempo empleado por el usuario para la concretar la misma.

•Cuantificables de forma subjetiva: Determinada por la satisfacción, medible a través de la interrogación al usuario, estrechamente relacionada con la percepción. La accesibilidad se refiere a las posibilidades de acceso que facilite a la mayor cantidad de usuarios, sin excluir a aquellos con limitaciones individuales - discapacidades, dominio del idioma –o limitaciones derivadas del contexto de acceso– software y hardware, etc. (Fernández, 2003). La interfaz gráfica ha sabido evolucionar a través del tiempo. En un principio y para quienes tuvieron la oportunidad de manipular los primeros ordenadores, la manera de realizar una tarea era ingresado una serie de comandos –Coman line Interface (CLI)–. Con el desarrollo tecnológico y en paralelo a la capacidad humana de reinventar las cosas y la industrialización y la producción en masa, se crearon los primeros ordenadores que debían tener la capacidad de ser manipulados de forma sencilla por cualquier persona y se desarrolla lo que hoy se conoce como Graphical User Interface (GUI), que se ha convertido en la base para el resto. Hoy para muchos ya es evidente que la interacción con los medios digitales pasó de unos cuantos clics a una comunicación más natural donde los gestos y movimientos son parte de ella: (NUI) Natural User Interface.

Existen un sinnúmero de metodologías para lograr que una interfaz sea intuitiva, funcional y usable. Desde los modelos más tradicionales como el modelo en Cascada o Scrum, la metodología que engloba el mayor espectro desde la práctica docente particularmente ha sido el Diseño Centrado en el Usuario (User Centered Desing) que no está encaminado únicamente en los procesos de desarrollo del producto. Su filosofía es poner al usuario en el centro del proceso de diseño, basándose en sus características, objetivos y necesidades, recogiendo información a través de una serie de instrumentos que permiten mostrar evidencias que luego se transforman en toma de decisiones aplicadas al diseño. El diseño centrado en el usuario considera tres grandes áreas como son la investigación o análisis, el diseño y los prototipos, dentro de un proceso iterativo evaluado constantemente. El diseño iterativo basa su máxima en el principio de ensayo y error. Utiliza como herramientas el diseño, los prototipos en diferentes etapas y niveles entre los que podemos destacar el layout, Wireframe, los prototipos de papel y las maquetas digitales. Sus usos dependerán muchas veces del tipo de proyecto, sus recursos, alcance o tiempo.

Jesse James Garret, uno de los referentes arquitectos de la información, ha hecho uno de los mayores aportes en el desarrollo de una metodología para la construcción de productos interactivos sobre la experiencia de usuario. Estas etapas son estrategia, alcance, estructura, esqueleto e interfaz gráfica, que horizontalmente van desde lo abstracto a lo concreto.

Cada etapa tiene un papel fundamental: la fase de la investigación, por ejemplo, permite determinar la idea de negocio, las características y limitaciones de los usuarios, objetivos de la propuesta, especificaciones funcionales, requerimientos de contenidos, utiliza herramientas como la encuesta, la entrevista, los perfiles de usuario (arquetipos), escenarios, etc. La etapa del diseño comprende dos momentos: el diseño de interacción y el diseño de información. Desde lo cognitivo/conceptual y desde lo visual/estructural utiliza herramientas como los diagramas de organización, entre los cuales podemos destacar el índice de contenidos, el mapa del sitio, card sorting, que permiten identificar la jerarquía, relación de contenidos y cómo las unidades de información son percibidas por los usuarios. Los mapas de visualización como el esqueleto y las maquetas digitales por otra parte permiten establecer la relación entre el diseño conceptual y visual a través de la interfaz gráfica. El prototipado debería considerarse como uno de los objetivos principales y estratégicos de cualquier proyecto. Como una herramienta valiosa para el diseño eficaz, los prototipos pueden ser aplicados en cualquier etapa del desarrollo por su facilidad de construcción y manejo. Esto permitirá la evaluación constante de los modelos de interacción, navegación, estructura, y despliegue de contenidos, permitiendo viabilizar las dificultades de los usuarios y mejorar la interfaz progresivamente.

Existen distintos niveles o tipos de prototipos entre los cuales podemos mencionar dos grandes grupos: los prototipos de baja fidelidad (Sketching, layout, wireframes, paper prototypes) y los prototipos de alta fidelidad (digital mockup), aplicados en una relación costo – tiempo. Los prototipos permiten mejorar la experiencia de usuario desde la exploración y pueden ser creados bajo los criterios como el aspecto (cómo es y cómo se ve), implementación (cómo puede utilizarse, para qué puede utilizarse) y su rol (cómo funciona su sistema de interacción, cómo funciona su sistema de navegación). Todo lo que vemos son hipótesis, experiencias pasadas que a través de la visión el cerebro completa, la percepción es una respuesta intelectual parcialmente relacionada con la realidad que se desarrolla por un cúmulo de experiencias, es quizá el proceso creativo inherente al ser humano que debe contrastarse con algo para que tengan significado. La realidad de la percepción es la física del sentido común la de tocar objetos, de probar, de interactuar y usar (Ken Robinson, s.f.). El buen diseño no se limita a la plataforma: depende de un conjunto de principios técnicos y conceptuales desde el campo de la tecnología y la percepción humana, donde el trabajo en equipo y la creatividad son los componentes primordiales.

El diseño en términos generales debe satisfacer dos dimensiones. Por un lado, la dimensión objetiva, que es visible al usuario, ligada a la facilidad para encontrar algo en la menor cantidad de tiempo frente a un producto, sin la necesidad de haberlo utilizando antes. Cuando un producto interactivo está diseñado considerando los modelos metales de usuario implica un menor esfuerzo por parte del mismo ligándolo directamente a lo que se conoce como la curva de aprendizaje (Krajewski & Ritzman, 2000). La curva de aprendizaje se refiere a una tarea o empleo repetitivo y representa la relación entre la experiencia y la productividad.

Por otro lado, la dimensión subjetiva, que está ligada directamente a la satisfacción: cuán agradable resulta su experiencia, si en este proceso el usuario logra su objetivo, lo categorizará como un producto útil, caso contrario si el producto no justifica el esfuerzo no lo volverá a utilizar. Construir productos funcionales y usables requiere investigar e interpretar correctamente las necesidades reales de los usuarios en contextos específicos. A partir de esto diseñar, modelar y estructurar un interfaz capaz de satisfacer las necesidades del usuario. Para Montero (2015), la calidad e idoneidad de un diseño viene determinada por la relación esfuerzo-beneficio, ya que solo cuando el beneficio o valor percibido supera el esfuerzo requerido, podremos hablar de experiencias de usuario satisfactorias. En todo momento estamos hablando de beneficio o valor percibido, lo que implica que no se trata únicamente de funcionalidad sino también de cómo el diseño es capaz de comunicar eficazmente ese valor.

Bibliografía

Camus, J. (2009). Tienes 5 segundos [en línea] 1era.Ed. Chile: Creative Commons.

Córcoles, T. J. E. y Montero, S. F. (2014). Diseño de interfaces web. España: RA-MA Editorial. Recuperado de http://www.ebrary.com

Frascara, J. (2011). ¿Qué es el diseño de información? Argentina: Ediciones Infinito. Recuperado de http://www.ebrary.com

Ficarra, F. (2006). Interacción persona-computador: sálvese quien pueda. Ecuador: Red Revista Latinoamericana de Comunicación CHASQUI. Recuperado de http://www.ebrary.com

Granollers, I. S. T., Lorés, V. J. y Cañas, D. J. J. (2005). Diseño de sistemas interactivos centrados en el usuario. España: Editorial UOC. Recuperado de http://www.ebrary.com.

Hassan Montero, Y. (2015). Experiencia de Usuario: Principios y Métodos [versión Kindle]. Recuperado de Amazon.es

Hassan Montero, Y., Fernández, F. J. y Iazza, G. (2004). Diseño Web Centrado en el Usuario: Usabilidad y Arquitectura de la Información. Recuperado de Hipertext.net

Lankow, J., Ritchie, J. y Crooks, R. (2013). Infografías. El poder del storytelling visual. Barcelona: Gestión 2000.

López, X., Pereira, X. y Limia, M. (2012). Arquitectura de la información. España: Universidade de Santiago de Compostela. Recuperado de http://www.ebrary.com

Palau, T. (2011). Diseño de interfaces multimedia, UOC. Recuperado de: http://www.etnassoft.com/biblioteca/diseno-de-interfacesmultimedia/

Strate, L. (2012). La tecnología, extensión y amputación del ser humano.

Travis, David. (2009). La fábula del diseñador centrado en el usuario. USERFOCUS, Recuperado de: http://www.etnassoft.com/biblioteca/la-fabula-del-disenador-centrado-en-el-usuario/

Abstract: Web design beyond aesthetics is an analysis of teaching experience and sources of bibliographic inspiration in the field of digital content design that aims to change the perception of web / multimedia design by referring only as the aesthetic part or visual interface, whereas on the contrary the design plays a fundamental role in the design of structures, navigation system, interaction system, etc. This implies to handle tools, methodologies, standards and specialized software that assure the functionality and accessibility of the same from the ideation to the development, hence that research, design and prototyping are an essential part of the development of interactive digital products.

Keywords: Design - web design - graphical user interface - perception - communication.

Resumo: Design web, além da estética, é uma análise sobre a experiência docente e as fontes de inspiração bibliográfica no campo do design de conteúdos digitais que tem o propósito de mudar a percepção sobre design web / multimídia ao referi-lo somente como a parte estética ou visual de uma interface, quando, pelo contrário, o design desempenha um papel fundamental no planejamento de estruturas, sistema de navegação, sistema de interação, etc. Isto implica dominar ferramentas, metodologias, normas e softwares especializados que assegurem sua funcionalidade e acessibilidade desde a idéia até o seu desenvolvimento. A pesquisa, o design e a prototipagem são essenciais dentro do desenvolvimento de produtos digitais interativos.

Palavras chave: Design - design web - interface gráfica de usuário - percepção - comunicação.

(*) Jiménez Raúl. Master en diseño Multimedia, Diseñador Gráfico Publicitario de profesión, Diseñador web, docente en varias Universidades del país tanto públicas como privadas entre las cuales están la Universidad Técnica de Cotopaxi, Universidad Tecnológica Indoamérica, Universidad Técnica del Norte, Universidad Central del Ecuador colaborando en carreras de ingeniería y licenciatura en las áreas de diseño, web, multimedia, diseño 3D, propietario de Infrasigno, empresa dedicada al desarrollo de productos interactivos multimedia y software, un apasionado del software libre impartiendo una serie de talleres y conferencias a nivel nacional.


Diseño web más allá de la estética fue publicado de la página 120 a página123 en Actas de Diseño Nº 32

ver detalle e índice del libro