Presentación

Vivimos en un mundo repleto de pantallas y dispositivos tecnológicos: diferentes interfaces a través de las cuales interactuamos y nos conectamos continuamente.

Conceptualmente, el propósito fundamental de una interfaz de usuario es soportar la interacción entre un usuario y un dispositivo tecnológico. Desde este punto de vista, se vuelve una necesidad apremiante la creación de interfaces sencillas e intuitivas, con el fin de que el usuario pueda comunicarse de la mejor forma posible con la máquina.

En este sentido, la asignatura de Interfaces y Nuevos Dispositivos pretende proporcionar al alumno los recursos necesarios para trabajar con interfaces de usuarios, desde la ideación y creación de prototipos hasta la codificación.

A través de una serie de contenidos presentados en un orden lógico, se pretende establecer una clara comprensión de la problemática desde el inicio, cuidando muy especialmente la apariencia en cuanto al diseño visual y el diseño de interfaces, agregando en el proceso el uso de patrones correctos y los métodos de evaluación de usabilidad y accesibilidad.

Se tiene en cuenta que el diseño se transforma en un elemento diferenciador en la interacción con el usuario, un proceso dado por las tecnologías y los lenguajes de programación que se utilicen. Con ese fin, en la segunda parte de la asignatura, el tema central será la programación y, más concretamente, los lenguajes de desarrollo web más utilizados.

Un apartado especial dentro de la asignatura es el diseño de aplicaciones para dispositivos móviles y de escritorio; un diseño elaborado bajo criterios de responsive, que garanticen una satisfactoria experiencia de uso.

Finalmente, se presenta una nueva perspectiva de la tecnología, sus pautas de diseño y la aparición de nuevos factores que permitan dilucidar hacia dónde se dirige el diseño de interfaces de usuario.

Tema 1. Fundamentos del diseño de interfaz de usuario

• Introducción y objetivos
  
• El concepto de interfaz de usuario
  
• El concepto de interacción
  
• El diseño centrado en el usuario
  
• Experiencia de usuario: recogida de información y análisis de requisitos
  
• Los artefactos de diseño
  
• Referencias bibliográficas

Tema 2. Proceso de diseño de IU: diseño visual

• Introducción y objetivos
  
• El diseño visual y sus elementos básicos
  
• La construcción del espacio negativo
  
• Organización perceptual: los principios de la Gestalt y su aplicación en el diseño
  
• Herramientas para el diseño visual
  
• Referencias bibliográficas

Tema 3. Proceso de diseño de IU: diseño de la interacción

• Introducción y objetivos
  
• Diseño de la interacción persona-ordenador
  
• Estilos de interacción
  
• Patrones de interacción
  
• Microinteracciones
  
• Desarrollo práctico de un modelo de interacción
  
• Herramientas para el desarrollo de interacciones
  
• Referencias bibliográficas

Tema 4. Definición y creación de prototipos

• Introducción y objetivos
  
• Diseño conceptual: perfiles de usuarios, personajes y escenarios
  
• El prototipo como herramienta práctica de diseño
  
• Los prototipos de baja fidelidad
  
• Los prototipos de alta fidelidad
  
• Desarrollo práctico de un funnel de diseño
  
• Herramientas para el prototipado
  
• Referencias bibliográficas

Tema 5. Evaluación

• Introducción y objetivos
  
• El concepto de usabilidad
  
• Métodos, técnicas y herramientas de evaluación de la usabilidad en la web
  
• Desarrollo de un test de usabilidad
  
• El concepto de accesibilidad y diseño universal: limitaciones sensoriales y físicas
  
• Pautas de accesibilidad para el contenido web (WCAG)
  
• Métodos, técnicas y herramientas de evaluación de la accesibilidad en la web
  
• Referencias bibliográficas

Tema 6. Programación de interfaz de usuario

• Introducción y objetivos
  
• El concepto de programación
  
• Tipos de lenguajes de programación
  
• Herramientas de programación
  
• Fundamentos del desarrollo web
  
• Tecnologías para el desarrollo web
  
• Organización de un proyecto web
  
• Referencias bibliográficas

Tema 7. Programación de IU: HTML y CSS

• Introducción y objetivos
  
• Introducción al HTML
  
• Sintaxis HTML
  
• Elementos estructurales en HTML
  
• Introducción a CSS
  
• Sintaxis CSS
  
• Selectores y estilos
  
• Referencias bibliográficas

Tema 8. Programación de IU: HTML5 y CSS3

• Introducción y objetivos
  
• Introducción a HTML5
  
• Elementos estructurales
  
• Novedades de HTML5
  
• Introducción a CSS3
  
• Novedades en CSS3
  
• Media queries
  
• Referencias bibliográficas

Tema 9. Diseño para múltiples dispositivos

• Introducción y objetivos
  
• Diseño web multidispositivo
  
• Diseño web adaptativo
  
• Diseño web responsive
  
• Diseño para móvil vs. escritorio
  
• Diseño de pantallas táctiles
  
• Frameworks
  
• Reivindicación del estándar
  
• Referencias bibliográficas

Tema 10. Prospectivas y tendencias

• Introducción y objetivos
  
• Realidad virtual
  
• Interfaces conversacionales
  
• Tendencias en IU
  
• Diseños de futuros
  
• Referencias bibliográficas

Las actividades formativas de la asignatura se han elaborado con el objetivo de adaptar el proceso de aprendizaje a las diferentes capacidades, necesidades e intereses de los alumnos.

Las actividades formativas de esta asignatura son las siguientes:

• Trabajos individuales. Se trata de actividades de diferentes tipos: reflexión, análisis de casos, prácticas, análisis de textos, etc.
• Trabajos colaborativos. Son actividades grupales en las que tendrás la oportunidad de trabajar con tus compañeros. Durante el desarrollo de la asignatura tendrás toda la información que necesites sobre cómo organizarte para trabajar en equipo.
• Participación en eventos. Son actividades programadas todas las semanas del cuatrimestre, como clases en directo o foros de debate.

Estas actividades formativas prácticas se completan, por supuesto, con estas otras:

• Estudio personal
• Tutorías. Las tutorías se pueden articular a través de diversas herramientas y medios. Durante el desarrollo de la asignatura, el profesor programa tutorías en días concretos para la resolución de dudas de índole estrictamente académico a través de las denominadas “sesiones de consultas”. Como complemento de estas sesiones se dispone también del foro “Pregúntale al profesor de la asignatura” a través del cual se articulan algunas preguntas de alumnos y las correspondientes respuestas en el que se tratan aspectos generales de la asignatura. Por la propia naturaleza de los medios de comunicación empleados, no existen horarios a los que deba ajustarse el alumno.
• Examen final online

Bibliografía básica

Recuerda que la bibliografía básica es imprescindible para el estudio de la asignatura. Cuando se indica que no está disponible en el aula virtual, tendrás que obtenerla por otros medios: librería UNIR, biblioteca...

Los textos necesarios para el estudio de la asignatura han sido elaborados por UNIR y están disponibles en formato digital para consulta, descarga e impresión en el aula virtual.

Bibliografía complementaria

• Frain, B. (2020). Responsive Web Design with HTML5 and CSS. Packt Publishing.
• García, D. y López, M. (2019). Diseño de interfaces web. Síntesis.
• Gauchat, J. D. (2019). El gran libro de HTML5, CSS3 y JavaScript. Marcombo.
• Norman, D. (2013). The Design of Everyday Things. Basic Books.
• Pernice, K. (18 de diciembre de 2016). UX Prototypes: Low Fidelity vs. High Fidelity. Nielsen Norman Group.
• Pacholczyk, D. (2016). Mobile UI Design Patterns. UX Pin.

La calificación se compone de dos partes principales:

Examen: se realiza al final de la asignatura, es de carácter ONLINE y OBLIGATORIO. El examen se valora sobre 10 puntos. Supone el 30 % de la calificación final.

Evaluación continua: supone el 70 % de la calificación final. Este 70 % se compone de las calificaciones obtenidas en las diferentes actividades formativas llevadas a cabo a lo largo de la asignatura.

La nota final debe sumar mínimo 7 puntos para aprobar la asignatura.

Sistema de evaluación	%
Test parciales en la plataforma	5
Participación en foros de discusión, sesiones y otros medios colaborativos	15
Actividad: Buscar, identificar y explicar ejemplos de los principios de arquitectura de información vistos	10
Caso práctico: Prototipo alto nivel de fidelidad (parte I): identificar problemas de usabilidad y realizar un rediseño de un sitio web	20
Caso práctico: Prototipo alto nivel de fidelidad (parte II): trasladar el prototipo realizado a código, utilizando HTML5 y CSS3, describiendo el proceso seguido	20
Examen final	30
Suma total de calificación	100

Al tratarse de formación online puedes organizar tu tiempo de estudio como desees, siempre y cuando vayas cumpliendo las fechas de entrega de actividades, trabajos y exámenes. Nosotros, para ayudarte, te proponemos los siguientes pasos:

1. Desde el Campus virtual podrás acceder al aula virtual de cada asignatura en la que estés matriculado y, además, al aula virtual del Curso de introducción al campus virtual. Aquí podrás consultar la documentación disponible sobre cómo se utilizan las herramientas del aula virtual y sobre cómo se organiza una asignatura en la UNIR. También podrás organizar tu plan de trabajo con tu tutor personal.
2. Observa la programación semanal. Allí te indicamos qué parte del temario debes trabajar cada semana.
3. Ya sabes qué trabajo tienes que hacer durante la semana. Accede ahora a la sección Temas del aula virtual. Allí encontrarás el material teórico y práctico del tema correspondiente a esa semana.
4. Comienza con la lectura de las Ideas clave del tema. Este material es el que debes estudiar para superar la asignatura. Consulta, además, las secciones del tema que contienen material complementario: con esto podrás tener una visión más amplia sobre el tema que estás trabajando.
5. Dedica tiempo al trabajo práctico (sección Tareas y Test). En la programación semanal te detallamos cuáles son las actividades correspondientes a cada semana y qué calificación máxima puedes obtener con cada una de ellas.
6. Te recomendamos que participes en los eventos del curso (clases en directo, foros de debate…). Para conocer la fecha concreta de celebración de los eventos debes consultar las herramientas de comunicación del aula vitual. Tu profesor y tu tutor personal te informarán de las novedades de la asignatura.

En el aula virtual del Curso de introducción al campus virtual encontrarás siempre disponible la documentación donde te explicamos cómo se estructuran los temas y qué podrás encontrar en cada una de sus secciones.

También puedes consultar ahí el funcionamiento de las distintas herramientas del aula virtual: correo, foro, clases en directo, envío de tareas, etc.