Diferencia entre revisiones de «Taller de Diseño de Interacción 2020»

De Casiopea
Línea 845: Línea 845:
** Casos de estudios: Nuevos casos de estudios que puedan perfilar hacia la formulación de su concepto
** Casos de estudios: Nuevos casos de estudios que puedan perfilar hacia la formulación de su concepto
** Presentación del concepto formulado: Argumento del concepto, en relacion al contenido levantado anteriormente que enriquece con características indicadas hacia la realización de un juego (aparte del concepto, que elementos que rescatados le dará el carácter al juego que diseñaran) (enriquecido con modelo)
** Presentación del concepto formulado: Argumento del concepto, en relacion al contenido levantado anteriormente que enriquece con características indicadas hacia la realización de un juego (aparte del concepto, que elementos que rescatados le dará el carácter al juego que diseñaran) (enriquecido con modelo)
* Primeras Propuestas del Juego: Dibujos, esquemas de as versiones ideadas (ideal tener un prototipo alfa del juego) y descripción de como se jugaría.
* Primeras Propuestas del Juego: Nombre de la propuesta, demostraciones en dibujos, esquemas de las versiones ideadas (ideal tener un prototipo alfa del juego) y descripción de como se jugaría.


=====Proyectos Grupales=====
=====Proyectos Grupales=====

Revisión del 14:23 17 jun 2020


Asignatura(s)Taller de Diseño de Interacción
Año2020
Tipo de CursoTaller de Etapa
ProfesoresKatherine Exss, Herbert Spencer
Profesor(es) Ayudante(s)Catalina Pérez
EstudiantesCatalina Armijo, Valentina Blanco, Constanza Cabrera, Martin Canihuante, Camilo Caroca, Amalia Casanova, Rocío Castillo, Pablo Chicano, Antonia Escudero, Javiera Galaz, Antonia Gallardo, Catalina Gonzalez, Cristina Herrero, Marcelo Mondaca, Daniela Murillo, Omar Nuñez, Vicente Quezada Salfate, María Ignacia Santander Serrano, David Silva Bernales, Rodrigo Toro, Catalina Velásquez, Constanza Villarroel, Josefa Zamora, Gabriela Zett, Roberta Durán, Catalina Jorquera Kruberg, María Inés González Guardia, Antonia López, Alejandro Jiménez Amín, Sebastián Perucci, Fernanda Talamilla P
Palabras Claveux, interacción, juego
Carreras RelacionadasDiseño, Diseño Gráfico"Diseño Gráfico" is not in the list (Arquitectura, Diseño, Magíster, Otra) of allowed values for the "Carreras Relacionadas" property., Diseño Industrial"Diseño Industrial" is not in the list (Arquitectura, Diseño, Magíster, Otra) of allowed values for the "Carreras Relacionadas" property., Interacción y Servicios"Interacción y Servicios" is not in the list (Arquitectura, Diseño, Magíster, Otra) of allowed values for the "Carreras Relacionadas" property.

Estudiantes

Descripción

Este taller introduce el estudio del diseño de interacción, definiendo el campo de la interfaz entre personas y los objetos, productos o servicios. Cuestionaremos los patrones de la relación entre la gestualidad de la persona y la performatividad de los objetos. Trabajaremos desde la observación directa de la realidad, mediante el croquis y las notas de campo, observación participante, entrevistas entre otros métodos de diseño centrados en las personas. El trabajo estará estructurado en proyectos o ciclos creativos que comprenderán un recorrido desde la fase de descubrimiento, originación y generación de conceptos, fabricación de prototipos y refinamiento formal mediante la verificación de estos prototipos enfrentándolos a los usuarios e iterando sobre ellos. Este año adicionalmente nos enmarcamos en la celebración de los 50 años del diseño en la PUCV, por lo cual nuestro taller estará también abocado a contribuir con este hito.

Cronograma

Ciclo 1 Ciclo 2
Patrones de Interacción UX Juego: Fenómenos y Tecnología
Desde 16 de Marzo al 5 de Mayo Desde 8 de Mayo al 24 de Julio

Rúbrica de Evaluación

Observación Proyecta Construye Reflexiona Comunica Colabora
Descubre y crea conceptos Integra en la forma conceptos y requerimientos Explora y gobierna diversos procesos constructivos Explora e itera sobre la forma Documenta el proyecto como proceso comunicable Asume un rol disciplinar (expertise)
Identifica y caracteriza destinatario Traduce sus propuestas a diferentes escalas, soportes, contextos y magnitudes Discrimina a favor de la optimización del uso de recursos Verifica el cumplimiento de los objetivos
Observa sistemas y fenómenos dinámicos y complejos Reflexiona desde el destinatario
Identifica problemáticas y necesidades

Tabla de Calificaciones

Ciclo 1: Malas Prácticas Ciclo 2: El Juego (Parte 1, Individual) Ciclo 2: El Juego (Parte 2, grupal)
30% 30% 30% 10% 30% NF 30% 30% 40% 30% NF 25% 25% 25% 25% 40% NF
Reconoce y observa el campo de diseño Reflexiona y tiene una mirada crítica Interpreta, compone y diagrama Construye y Desarrolla el diseño técnicamente Nota Final Ciclo 1 Reconoce y Observa el Campo (obs) Reflexiona y Teoriza (modelo) Propone y Expone Nota Final Etapa 1, Ciclo 2 Integra y propone Itera y Refina Desarrolla y Materializa Documenta, Reflexiona y Expone Nota Final Etapa 2, Ciclo 2

Ciclo 1: Patrones de Interacción UX

Bajo el objeto de adentrarse y entender la materia que conlleva la interacción como un campo de estudio y materia del Diseño, este primer ciclo busca identificar y analizar, desde un punto de vista crítico y constructivo, Patrones de Interacción empleados por distintos servicios (específicamente, dentro de las plataformas digitales).

Un patrón de diseño de interacción (IxD) es una solución general y repetible para un problema de uso común en el diseño de interfaz o diseño de interacción. Un patrón IxD suele constar de los siguientes elementos:

  • Problema: Los problemas están relacionados con el uso del sistema y son relevantes para el usuario o cualquier otro interesado en la usabilidad.
  • Úsese en: una situación (en términos de las tareas, los usuarios y el contexto de uso) que da lugar a un problema de usabilidad. En esta sección se amplía la dicotomía sencilla de las soluciones de problemas describiendo las situaciones en que se producen los problemas.
  • Principio: un patrón suele basarse en uno o varios principios ergonómicos, como la orientación del usuario, o la coherencia, o la gestión de los errores.
  • Solución: una solución probada del problema. Una solución describe sólo el núcleo del problema, y el diseñador tiene la libertad de implementarla de muchas maneras. Otros patrones pueden ser necesarios para resolver sub-problemas.
  • Por qué: Cómo y por qué el patrón funciona realmente, incluyendo un análisis de cómo puede afectar a ciertos atributos de la usabilidad. El razonamiento (por qué) debe proporcionar un argumento razonable para el impacto especificado en la usabilidad cuando se aplica el patrón. El por qué debería describir qué aspectos de la usabilidad deberían haber sido mejorados o qué otros aspectos podrían verse afectados.
  • Ejemplos: Cada ejemplo muestra cómo el patrón se ha aplicado con éxito en un sistema de la vida real. Esto suele ir acompañado de una captura de pantalla y una breve descripción.
  • Aplicación: Algunos patrones proporcionan detalles de implementación.

Como numerosas personas han trabajado en los patrones de la Interacción Humano-Computadora en los últimos años, el concepto de patrones de IxD se conoce con diferentes nombres; por ejemplo, patrones de interacción, patrones de interfaz de usuario (UI o GUI), patrones de usabilidad, patrones de diseño web y patrones de flujo de trabajo. Estos patrones comparten muchas similitudes y básicamente todos proporcionan soluciones a los problemas de usabilidad en la interacción y el diseño de la interfaz. Algunos patrones se conocen con nombres diferentes (o incluso con el mismo nombre) en diferentes colecciones de patrones [1].

En palabras simples, cuando en el taller nos referimos a un patrón de diseño, nos refimos tanto al flujo de procesos de diálogo (interacción) entre un usuario y un servicio (pasos, movimiento) como a los elementos de interfaz que gatillan y permiten tales acciones.

Dentro del mundo de los Patrones de Interacción existen distintas categorías; patrones que suelen repetirse en distintos servicios para cumplir una acción/motivación. Sin embargo, bajo una categoría, puede existir múltiples formas de articular los procesos por el lado del servicio para realizar el flujo de este patrón, pecando en algunas instancias, que las motivaciones de personas o empresas no estén alineadas con las acciones que proporcionan valor a los clientes y usuarios que interactúan con el servicio.

Es por eso, que esta iniciativa trata de identificar patrones de interacción empleados por los servicios que finalmente resultan ser abusivos o injustos y que de alguna manera redundan en algún perjuicio evitable para los usuarios finales.

Referencias Bibliográficas

Patrones: Colecciones con un enfoque crítico (UX Collective)

  1. La definición de Patrón de Interacción está tomada de Interaction Design Foundation.

Tarea 1

Visto desde el enfoque critico, Identificar al menos 5 Patrones de Interacción en Plataformas Digitales (Sitios web y Aplicaciones en diversos formatos) que cumplan una Mala Experiencia de Usuario (Mala UX).

  • Formato de Entrega: Vía Casiopea.
    • +Nuevo Objeto > Nueva Tarea > Nombrar la Tarea como "Tarea 1"
  • Día de Entrega: Viernes, 20 de Marzo.
  • Herramientas: Diagramas, pantallazos y PiX

Este Encargo debe contar con:

  1. Nombre de la Plataforma o Servicio.
  2. Descripción de la Plataforma o Servicio.
  3. Categoría de Patrón.
  4. Colección de Pantallas (de manera secuencial en relación al flujo de los procesos).
  5. Partitura de Interacción (Registro de la experiencia de interacción del usuario con el sistema).
  6. Proposición de clasificación de patrones encontrados (categorías y jerarquías)

Tareas

  1. Alejandro Jiménez Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Alejandro Jiménez Amín)
  2. Amalia Casanova Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Amalia Casanova)
  3. Antonia Escudero Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Antonia Escudero)
  4. Antonia Gallardo Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Antonia Gallardo)
  5. Antonia López Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Antonia López)
  6. Camilo Caroca Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Camilo Caroca)
  7. Catalin Armijo Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Catalina Armijo)
  8. Catalina González Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Catalina Gonzalez)
  9. Catalina Jorquera Kruberg Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Catalina Jorquera Kruberg)
  10. Catalina Velásquez Tarea 1 - Taller de Diseño de Interacción 2020
  11. Constanza Cabrera Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Constanza Cabrera)
  12. Constanza Villarroel Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Constanza Villarroel)
  13. Cristina Herrero Tarea 1- Taller de Diseño de Interacción 2020(Alumnos: Cristina Herrero)
  14. Daniela Murillo Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Daniela Murillo)
  15. David Silva Bernales Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: David Silva Bernales)
  16. Fernanda Talamilla Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Fernanda Talamilla P)
  17. Javiera Galaz Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Javiera Galaz)
  18. Josefa Zamora Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Josefa Zamora)
  19. Marcelo Mondaca Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Marcelo Mondaca)
  20. María Ignacia Santander Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: María Ignacia Santander Serrano)
  21. María Inés González Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: María Inés González Guardia)
  22. Omar Nuñez Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Omar Nuñez)
  23. Paola Chicano Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Paola Chicano)
  24. Roberta Durán Tarea 1 - Taller Diseño de Interacción 2020(Alumnos: Roberta Durán)
  25. Rocío Castillo Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Rocío Castillo)
  26. Rodrigo Toro Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Rodrigo Toro)
  27. Sebastián Perucci Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Sebastián Perucci)
  28. T1: TDI2020 Martín Canihuante(Alumnos: Martin Canihuante)
  29. Valentina Blanco Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Valentina Blanco)
  30. Vicente Quezada Salfate Tarea 1 - Taller de Diseño de Interacción 2020(Alumnos: Vicente Quezada Salfate)

Tarea 2

En relación al encargo anterior y la lista de Patrones realizado en la reunión, elegir un Patrón de Interacción y desglosar 5 ejemplos buenos y 5 ejemplos malos de Experiencia de Usuario (UX) en distintos servicios digitales.

  • Formato de Entrega: Vía Casiopea.
    • +Nuevo Objeto > Nueva Tarea > Nombrar la Tarea como "Nombre del Alumno Tarea 2 - Taller de Diseño de Interacción 2020"
  • Día de Entrega: Martes, 24 de Marzo.
  • Herramientas: Descripciones escritas, Diagramas, Pantallazos y Partituras de Interacción

Estructura del Encargo

  1. Nombre del Patrón Seleccionado
  2. Descripción del patrón Argumentos y observaciones generales sobre la experiencia de estudio del patrón en cuestión.


Para cada Ejemplo:

  1. Nombre del Servicio
  2. Soporte del Servicio Aplicación, Sitio web, etc..
  3. Escala de Habitos UX Ubicar la experiencia del patrón en dentro del servicio entre : Malo, Mediocre, Neutral, Aceptable ó Bueno.
  4. Descripción de experiencia de usuario con el servicio Observaciones en aciertos, deficiencias y sus explicaciones.
  5. Colección de Pantallas SecuencialesTransparentar procesos y secuencias en las pantallas presentadas.
    1. Descripción a pié de Imagen para cada Pantalla
      1. Por Galería
      2. Por Imagen Individual min. 500px
    2. Evidenciar visualmente las selecciones en la interacción con la página Clicks, Direcciones visuales, Errores identificados, etc.
  6. Partituras de Interacción
    1. Título: Servicio
    2. Descripción: Experiencia con el Patrón de Interacción
    3. Indicar las etapas con títulos específicos (Cabecera de la partitura).
    4. Complementar Iconos con Descripción
    5. En Pie de la partitura realizar observaciones que enriquezcan registro de la experiencia.

Lista de Patrones

  1. Creación de cuenta (registro) - Catalina Velasquez
  2. Autenticación de usuario (ingreso o login) - Cristina Herrero
  3. Recuperar cuenta - Roberta Durán
  4. Eliminar cuenta - Catalina Gonzalez
  5. Eliminar suscripción - Valentina Blanco
  6. Captcha o elementos de seguridad - Rocio Castillo
  7. Cambiar de cuenta de pago a cuenta gratuita - Alejandro Jiménez
  8. Acceder a contenido de pago (carnada) - Rodrigo Toro
  9. Definir preferencias de mensajería - Daniela Murillo
  10. Des-suscripción de lista de correo - Constanza Villarroel
  11. Cambio de contraseña - Javiera Galaz
  12. Desbloquear características (compras dentro de la App)
  13. Notificaciones - Sebastian Perucci
  14. Comentar una publicación - Antonia López
  15. Patrones de Evaluación:
    1. Evaluación de producto o servicio - Vicente Quezada Salfate
    2. Calificación de post (upvote, downvote, like, etc) - Maria Ignacia Santander
  16. Definición de preferencias para entregar servicio personalizado - Omar Nuñez
  17. Contenido recomendado no solicitado por el usuario - Camilo Caroca
  18. Aplicaciones codependientes - Antonia Gallardo
  19. Actualización de información constante - Catalina Jorquera
  20. Wizard o Tunneling (pop ups u otros elementos de interfaz que guían al usuario) - Constanza Cabrera
  21. Cuentas verificadas (normalmente de celebridades) en RRSS - David Silva
  22. Chatbots - Amalia Casanova
  23. Eliminar contenido en RRSS - Catalina Armijo
  24. Solicitar permisos del usuario - Maria Inés González
  25. Segmentación del contenido (desde la paginación al scroll infinito) - Josefa Zamora
  26. Carros de compra - Fernanda Talamilla Pino
  27. Trackeo de envíos - Constanza Cabrera
  28. Predicción de búsqueda (autocomplete u otros) - Marcelo Mondaca
  29. Formas de Pago - Antonia Escudero
  30. Comparación de productos - Martín Canihuante
  31. Compartir - Gabriela Zett

Tareas

  1. Alejandro Jiménez Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Alejandro Jiménez Amín)
  2. Amalia Casanova Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Amalia Casanova)
  3. Antonia Escudero Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Antonia Escudero)
  4. Antonia López Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Antonia López)
  5. Camilo Caroca Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Camilo Caroca)
  6. Catalina Armijo Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Catalina Armijo)
  7. Catalina González Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Catalina González)
  8. Catalina Jorquera Kruberg Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Catalina Jorquera Kruberg)
  9. Catalina Velásquez Tarea 2 - Taller de Diseño de Interacción 2020
  10. Constanza Cabrera Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Constanza Cabrera)
  11. Constanza Villarroel Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Constanza Villarroel)
  12. Cristina Herrero Tarea 2- Taller de Diseño de Interacción 2020(Alumnos: Cristina Herrero)
  13. Daniela Murillo Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Daniela Murillo)
  14. David Silva Bernales Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: David Silva Bernales)
  15. Fernanda Talamilla P Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Fernanda Talamilla P)
  16. Gabriela Zett Tarea 2 - Taller de Diseño de Interacción 2o2o(Alumnos: Gabriela Zett)
  17. Javiera Galaz Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Javiera Galaz)
  18. Josefa Zamora Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Josefa Zamora)
  19. Marcelo Mondaca Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Marcelo Mondaca)
  20. Martín Canihuante Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Martín Canihuante)
  21. María Ignacia Santander Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: María Ignacia Santander Serrano)
  22. María Inés González Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: María Inés González Guardia)
  23. Paola Chicano Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Paola Chicano)
  24. Roberta Durán Tarea 2 - Tarea de Diseño de Interacción 2020(Alumnos: Roberta Durán)
  25. Rocío Castillo Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Rocío Castillo)
  26. Sebastián Perucci Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Sebastián Perucci)
  27. Valentina Blanco Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Valentina Blanco)
  28. Vicente Quezada Salfate Tarea 2 - Taller de Diseño de Interacción 2020(Alumnos: Vicente Quezada Salfate)

Tarea 3

Seguir definiendo y profundizando el patrón y los 10 ejemplos estudiados, considerando las correcciones realizadas en la reunión anterior. También desarrollar descripción del estudio, identificando bajo el carácter del patrón elegido, qué es considerado una buena practica de Experiencia de Usuario (UX).

  • Formato de Entrega: Vía Casiopea.
    • +Nuevo Objeto > Nueva Tarea > Nombrar la Tarea como "Nombre del Alumno Tarea 3 - Taller de Diseño de Interacción 2020"
  • Día de Entrega: Viernes, 27 de Marzo.
  • Herramientas: Descripciones escritas, Diagramas, Pantallazos y Partituras de Interacción

Estructura del Encargo

El encargo debe estar presentado bajo los lineamientos que lo estructuran:

  1. Nombre del Patrón Seleccionado
  2. Descripción del patrón Argumentos principal del estudio, identificando conceptos que validen que es una buena practica UX bajo las condiciones del patrón elegido.


10 ejemplos que se ubiquen en el rango de Buena y Mala UX, donde cada uno debe responder a:

  1. Nombre del Servicio
  2. Soporte del Servicio Aplicación, Sitio web, etc..
  3. Descripción de experiencia de usuario con el servicio Determinación de Buena o Mala UX, argumentada bajo descripciones el servicio y observaciones en la Experiencia de Usuario.
  4. Colección de Pantallas SecuencialesTransparentar procesos y secuencias en las pantallas presentadas.
    1. Descripción a pié de Imagen para cada Pantalla. Parte importante en la presentación de su trabajo.
      1. Recomendado por Imagen Individual (min. 500px) o mediante scroll horizontal.
    2. Evidenciar visualmente las selecciones en la interacción con la página Clicks, Direcciones visuales, Errores identificados, etc.
  5. Partituras de Interacción
    1. Título: Experiencia en el Patrón dentro del Servicio
    2. Descripción: Experiencia con el Patrón de Interacción
    3. Indicar las etapas con títulos específicos (Cabecera de la partitura).
    4. Complementar Iconos con Descripción
      1. OBS: Valorizar el registro tanto la capa de la Persona (Experiencia subjetiva) como la del Sistema (Especulativo)
    5. En Pie de la partitura realizar observaciones que enriquezcan registro de la experiencia.

Tareas

  1. Alejandro Jiménez Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Alejandro Jiménez Amín)
  2. Amalia Casanova Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Amalia Casanova)
  3. Antonia Escudero Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Antonia Escudero)
  4. Antonia Gallardo Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Antonia Gallardo)
  5. Antonia López 3 - Taller de Diseño de Interacción 2020(Alumnos: Antonia López)
  6. Camilo Caroca Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Camilo Caroca)
  7. Catalina Armijo Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Catalina Armijo)
  8. Catalina González Tarea 3- Taller de Diseño de Interacción 2020(Alumnos: Catalina González)
  9. Catalina Jorquera Kruberg Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Catalina Jorquera Kruberg)
  10. Catalina Velásquez Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Catalina Velásquez)
  11. Constanza Cabrera Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Constanza Cabrera)
  12. Constanza Villarroel Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Constanza Villarroel)
  13. Cristina Herrero Tarea 3- Taller de Diseño de Interacción 2020(Alumnos: Cristina Herrero)
  14. Daniela Murillo Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Daniela Murillo)
  15. David Silva Bernales Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: David Silva Bernales)
  16. Fernanda Talamilla P Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Fernanda Talamilla P)
  17. Gabriela Zett Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Gabriela Zett)
  18. Javiera Galaz Tarea 3- Taller de Diseño de Interacción 2020(Alumnos: Javiera Galaz)
  19. Josefa Zamora Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Josefa Zamora)
  20. Marcelo Mondaca Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Marcelo Mondaca)
  21. Martín Canihuante Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Martín Canihuante)
  22. María Ignacia Santander Tarea 3- Taller de Diseño de Interacción 2020(Alumnos: María Ignacia Santander Serrano)
  23. María Inés González Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: María Inés González Guardia)
  24. Omar Nuñez Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Omar Nuñez)
  25. Paola Chicano Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Paola Chicano)
  26. Roberta Durán Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Roberta Durán)
  27. Rocío Castillo Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Rocío Castillo)
  28. Rodrigo Toro Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Rodrigo Toro)
  29. Sebastián Perucci Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Sebastián Perucci)
  30. Valentina Blanco Tarea 3- Taller de Diseño de Interacción 2020(Alumnos: Valentina Blanco)
  31. Vicente Quezada Salfate Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Vicente Quezada Salfate)

Tarea 4

  • Formato de Entrega: Vía Casiopea, vista por aplicación del Cardsorting
    • +Nuevo Objeto > Nueva Tarea > Nombrar la Tarea como "Nombre del Alumno Tarea 4 - Taller de Diseño de Interacción 2020"
    • Número: 4
  • Día de Entrega: Martes, 31 de Marzo.
  • Herramientas: Descripciones escritas, Figma (Wireframes), Cardsorting (EN PROCESO)

Tarea que consiste en el preámbulo del proyecto principal del ciclo, que consiste en diseñar un sitio web donde visualizaremos de mejor manera todas las buenas y malas practicas de Experiencia de Usuario en Patrones de Interacción.

Esta Tarea se compone de dos etapas:

Etapa 1: Utilizar la herramienta de Arquitectura de Información (AI) CardSorting, de caracter abierto y de manera grupal donde organizaremos los patrones que hemos estudiado, tomando en cuenta dos acciones:

  1. Categorizar los patrones en especies de familias taxonómicas (Ejemplo: los patrones de Autenticación de usuario, Captcha, entre otros podrían ubicarse en una categoría mayor denominada como Patrones de Seguridad).
  2. Realizar sub-categoría dentro del patrón estudiado (Dentro de tu patrón, cuantas clasificaciones reconoces).
    1. Para esta primera etapa se enviara una invitación para participar de este CardSorting desde la aplicación [Usabilitest]
    2. Tiempo limite de este encargo: Domingo 29 de Marzo, a las 16:30

Etapa 2: Comenzar a diseñar el modo de como se va a visualizar esta información mediante WireFrames, tomando en cuenta dos etapas de la navegación:

  1. Proponer un nombre para el sitio web - repositorio de patrones UX
  2. Pantallas de inicio a la materia: ¿De que se trata los Patrones de Interacción? ¿Porque es importante identificar buenas y malas practicas en la Experiencia de Usuario? ¿Cuales son los patrones identificados?
  3. Pantallas que muestren un patrón: Modo en como presentarías un patrón, junto con todo lo estudiado (De que se trata, como identificas las buenas y malas practicas, ejemplos que los fundamentan, junto con todas las herramientas utilizadas para registras las experiencias).
    1. Entrega de esta parte del encargo por Casiopea nombrado como "Nombre del Alumno Tarea 4 - Taller de Diseño de Interacción 2020".
    2. La tarea debe tener como presentación una imagen de portada de uno de sus wireframe, para poder evaluar en conjunto las maquetaciones realizadas.
    3. En la tarea se debe explicar los criterios de diseño realizado en los wireframes (Para inicio y para un patrón), junto con una buena presentación de estos
      1. Por Scroll
      2. Por Slideshow

Herramientas

Cardsorting

Wireframes

Tareas

  1. Antonia Escudero Tarea 4 - MuestraUX(Alumnos: Antonia Escudero)
  2. Antonia Gallardo Tarea 4 - Taller de Diseño de Interacción 2020(Alumnos: Antonia Gallardo)
  3. Camilo Caroca Tarea 4 - Ramiux(Alumnos: Camilo Caroca)
  4. Catalina Armijo Tarea 4 - PatternIn(Alumnos: Catalina Armijo)
  5. Catalina González Tarea 4 - PATTUER(Alumnos: Catalina González)
  6. Catalina Jorquera Kruberg Tarea 4 - Plexus(Alumnos: Catalina Jorquera Kruberg)
  7. Catalina Velásquez Tarea 4 - Taller de Diseño de Interacción 2020(Alumnos: Catalina Velásquez)
  8. Constanza Villarroel Tarea 4 - Taller de Diseño de Interacción 2020(Alumnos: Constanza Villarroel)
  9. Daniela Murillo Tarea 4 - Taller de Diseño de Interacción 2020(Alumnos: Daniela Murillo)
  10. David Silva Bernales Tarea 4 - Almanaque UX(Alumnos: David Silva Bernales)
  11. Fernanda Talamilla P Tarea 4 - Patrono(Alumnos: Fernanda Talamilla P)
  12. Gabriela Zett Tarea 4 - Taller de Diseño de Interacción 2020(Alumnos: Gabriela Zett)
  13. Javiera Galaz Tarea 4 - SYNAPPSE(Alumnos: Javiera Galaz)
  14. Josefa Zamora Tarea 4 - Taller de Diseño de Interacción 2020(Alumnos: Josefa Zamora)
  15. Marcelo Mondaca Tarea 4- Taller de Diseño de Interacción 2020(Alumnos: Marcelo Mondaca)
  16. Martín Canihuante Tarea 4 - Interacción del usuario con los patrones en la interfaz(Alumnos: Martín Canihuante)
  17. María Ignacia Santander Tarea 4 - Taller de Diseño de Interacción 2020(Alumnos: María Ignacia Santander Serrano)
  18. Omar Nuñez Tarea 4 - UXPatternsT(Alumnos: Omar Nuñez)
  19. Paola Chicano Tarea 4 - Taller de Diseño de Interacción 2020(Alumnos: Paola Chicano)
  20. Roberta Durán Tarea 4 - Interactio(Alumnos: Roberta Durán)
  21. Rocío Castillo Tarea 4 - UxAtron(Alumnos: Rocío Castillo)
  22. Valentina Blanco Tarea 4 - INTERPAT(Alumnos: Valentina Blanco)
  23. Vicente Quezada Salfate Tarea 4 - ARPAUX(Alumnos: Vicente Quezada Salfate)

Proyecto: Sitio Web de buenos y malas practicas en Patrones de Interacción (UX)

Etapa 1: Arquitectura de Información y Estructuras internas de Navegación

  • Formato de Entrega: Vía Casiopea.
    • +Nuevo Objeto > Nuevo Proyecto > Nombrar Proyecto como "Nombre del proyecto de sitio web"
    • Palabra Clave: sitioweb
  • Estructura de trabajo: Proyecto nivel grupal (6 grupos de 5 alumnos)
  • Herramientas: Descripciones escritas, Pantallas e Imagenes, Figma (Mapa de Navegación y Wireframes).
  • Día de Entrega: Viernes, 3 de Abril.


En vista de los ejercicios realizados en la tarea anterior y teniendo en claro su carácter especulativo para entrar al proyecto principal de este ciclo, comenzaremos de forma grupal formalizar las propuestas del sitio web desde desde el ámbito estructural como un espacio que es navegado por medio de sus conceptos y vínculos (refiriendo a los conceptos y vínculos a todo el contenido que hemos estado desarrollando a nivel taller).

Para eso, esta primera etapa del proyecto debe cumplir con los siguientes procesos:

  1. Nombrar el Proyecto de Sitio Web
    1. Se permite solo nombres en español.
    2. Este será el nombre su proyecto.
  2. Proponer grupalmente el Mapas de Navegación del Sitio Web
    1. En vista de lo conversado en clases y levantado en el ejercicio de Cardsorting (Registrado en el Drive del Taller), desarrollar las categorización y jerarquías de como el usuario navegara por estos contenidos.
    2. En este mapa de navegación debe como mínimo traer elementos claves para presentar los patrones (secciones que explican de que va el proyecto, el animo y su relevancia) y el modo de como se presentaría cada patrón de interacción (El patrón, descripción, buena y mala UX, Ejemplos, Partituras de Interacción, etc).
    3. Recordar que un mapa de navegación se presenta por niveles (no mas de 4 niveles para una buena experiencia de navegación dentro de un sitio).
    4. Este trabajo se realizara en la aplicación Figma, herramienta que permite realizar modificaciones de un trabajo de manera simultanea y a tiempo real.
    5. Después de realizarlo, tiene que estar exportado como imagen y presentado mediante un Proyecto en la wiki.
  3. Proponer de igual manera Secuencias de Wireframes para los siguientes niveles de navegación:
    1. Portada del Sitio Web.
    2. Introducción a un Patrón de Interacción.
    3. Modo de mostrar buenos y malos ejemplos de un patrón.
    4. De igual manera que el Mapa, este trabajo sera realizado en Figma; exportado como imagen y publicado en el proyecto.

Etapa 2: Sistema de Navegación

  • Formato de Entrega: Vía Casiopea.
    • Actualizar y publicar contenido en el proyecto ya realizado
  • Estructura de trabajo: Proyecto nivel grupal (6 grupos de 5 alumnos)
  • Herramientas: Descripciones escritas, Pantallas e Imágenes, Figma (Mapa de Navegación y Wireframes e Interfaz).
  • Día de Entrega: Martes, 14 de Abril.

Este semana se destina a la reflexión personal, a la observación y a la conceptualización de una propuesta de interacción para el proyecto grupal. Ejes importantes:

  1. Observación del estar ante y dentro de forma simultánea, relación básica de la arquitectura orientada. ¿Cómo me oriento estando ante una interfaz y dentro de un sistema de hipertexto? ¿cuáles son las indicaciones visuales de orientación, de lectura, de anticipación y de flujo?
  2. Avanzar hacia una proposición de navegación y de experiencia (mira y siente) para el sitio.
Lecturas

Etapa 3: Diseño de Interfaz

  • Formato de Entrega: Vía Casiopea.
    • Actualizar y publicar contenido en el proyecto ya realizado
  • Estructura de trabajo: Proyecto nivel grupal (6 grupos de 5 alumnos)
  • Herramientas: Descripciones escritas, Pantallas e Imágenes, Figma (Diseño de Pantallas), Illustrator (Logos, iconos, ilustración), Photoshop (Trabajo por de imágenes).
  • Día de Entrega: Martes, 21 de Abril.

Avanzar en las propuestas de diseño, específicamente para diseño de interfaz (UI). Esto significa iniciar la construcción de imagen de marca, con una línea gráfica definida y con consistencia a través de las diferentes páginas de sus sitio. Recomendamos cuestionar los nombres de sus proyectos, evitando las combinaciones de varias palabras en una (palabras fantasías) y privilegiando nombres con bajadas que permitan comprender mejor el sentido de su proyecto.

Esperamos lo siguiente:

  • Diseño de Logo
  • Definición de colores
  • Definición de tipografía
  • Diseño de iconos requeridos
  • Diseño de ilustraciones y otras imágenes de apoyo
  • Especial atención y cuidado en margenes y grilla (Geometría estructural del sitio web)

Recuerden la comprensión del diseño de interfaz desde el Diseño Atómico presentado como materia en clases anteriores.

Referencias de sitios web
  1. https://www.aatt.io/
  2. https://www.revenuecat.com/
  3. https://www.virgin.com/
  4. https://designers.at.finsweet.com/
  5. https://monyssb.com/
  6. https://jurajmolnar.com/
  7. https://heliasoils.com/
  8. https://basecamp.com/
  9. https://www.fiftythree.com/

Etapa 4: Desarrollo de Sitio Web

  • Formato de Entrega: Vía Casiopea.
    • Actualizar y publicar contenido en el proyecto ya realizado
  • Estructura de trabajo: Proyecto nivel grupal (6 grupos de 5 alumnos)
  • Herramientas:
    • Diseño de Interfaz: Descripciones escritas, Pantallas e Imágenes, Figma (Diseño de Pantallas), Illustrator (Logos, iconos, ilustración), Photoshop (Trabajo por de imágenes).
    • Desarrollo por código: Editor de código de su preferencia, Github (Publicación de repositorio).
  • Día de Entrega: Viernes, 24 de Abril.

En esta etapa se debe estar realizando paralelamente dos procesos de trabajo:

  1. Refinamiento en el criterio gráfico en el diseño final de la pagina:
    • Identidad de marca junto con las normas gráficas que la constituyen (Logotipo, paleta de colores, tipografía, ilustraciones).
    • Remarcar que todo criterio gráfico que conforma una identidad de marca debe estar directamente relacionado con las observaciones formuladas es la propuesta de navegación.
  2. Desarrollo web de la Propuesta:
    • Pasar la estructura de contenido, definido ya en Wireframes a HTML de modo que argumente la arquitectura de información propuesta para el sitio.
    • Transcribir las propuestas visuales dadas en el diseño de interfaz, a escalas de estilos CSS en el prototipo HTML.
    • Dicho prototipo debe estar publicado en un repositorio de Github.
Herramientas
  1. Editores de Código
  2. Tipografiás
  3. Publicación de repositorios
Tutoriales relevantes

Cierre de Ciclo: Malas Prácticas en UX

En esta ultima etapa de desarrollo, se presentara el proyecto que cierra el ciclo de Malas Practicas en UX, donde cada grupo documentara de forma completa y elocuente el proceso de propuesta del Sitio web. Ademas, la evaluación se complementara con el proceso individual de cada alumno, en relación a la documentación y fundamentación de la materia estudiada.

  • Formato de Entrega: Vía Casiopea.
    • Publicación individual en Tarea 3 actualizada
    • Publicación grupal en pagina del proyecto actualizada
  • Tipo de contenido a entregar:
    1. Patrón de Interacción y Ejemplos: Texto (fundamentación observación y descripción), imágenes (Capturas de Pantalla con elementos indicadores de la navegación y visualizaciones conceptuales que complementen la explicación de la materia), Partitura de Interacción.
    2. Arquitectura de Información: Texto que explique los fundamentos y los procesos de cada etapa, Mapa de Navegación (todas las versiones y con sus modificaciones verbalizadas), Wireframes versión de escritorio y móvil (Todas las etapas de modificación,verbalizando sus cambios y agregando texto que facilite la comprensión de la propuesta en la navegación).
    3. Diseño de Interfaz e Identidad de Marca: Normas Gráficas (proceso constructivo del Logo, íconos, criterios tipográficos, decisión en la paleta de colores y su aplicación, etc.), Pantallas de navegación con al interfaz aplicada en versión de escritorio y móvil (Todas las pantallas tipo con las normas gráficas aplicadas, contenido e imágenes).
    4. Desarrollo Web: Transcripción de propuesta de interfaz y navegación en repositorio en Github con paginas tipo navegables por HTML con CSS.
  • Día de Entrega: Martes, 5 de Mayo.
Rubrica de Evaluación
Reconoce y observa el campo de diseño Reflexiona y tiene una mirada crítica Interpreta, compone y diagrama Construye y Desarrolla el diseño técnicamente
Porcentaje 30% 30% 30% 10%
Nota Individual Individual Grupal Grupal
Entregables Recopilación de patrones y casos ejemplares Análisis y fundamento critico del patrón estudiado Arquitectura de la información, Diseño de interfaz y Lenguaje visual Publicación de la propuesta en HTML y CSS
Especificaciones Publicado en "tarea 3": Terminar de desarrollar lo realizado en la tarea 3 en la identificación de un patrón, que seria una buena y mala practica en el este caso y los ejemplos correspondientes que lo fundamentan (mínimo 5 buenas practicas y 5 malas practicas y con todos los elementos visuales y descriptivos que permiten comprender la experiencia de navegación de estos patrones). Publicado en "tarea 3": Desarrollar desde la tarea 3 el fundamento y la observación frente a la materia estudiada. ¿Que se refiere a patrones de interacción? ¿Por que es importante como comunidad de diseñadores identificar estos criterios? ¿Como identificamos y a que se refiere cuando hablamos de una mala y buena practica?. Publicado en Proyecto por Grupo: Documentar todo el desarrollo constructivo de la propuesta de Sitio Web de cada grupo y evidenciar las determinaciones finales en cada etapa (Mapa de Navegación final, Wireframes Finales, Diseño de Interfaz Final, etc.), junto con textos que expliquen las decisiones realizadas para el producto final de su proyecto (Mostrar de manera mas completa, con imágenes, textos, capturas y vídeos, visualizaciones conceptuales, que aporten a la comprensión de su propuesta). Publicado en Proyecto por Grupo: Publicar en repositorio de Github linkeado en su pagina de proyecto grupal donde presente un flujo de navegación que corresponda en un Set de 3 paginas; Inicio, Categorías y Patrón con ejemplos.
Material de Apoyo

La mayoría de los recursos referenciales para el desarrollo web está en inglés. Al buscar cosas en inglés podemos encontrar las referencias más actualizadas y cercanas a la fuente.

Clase de HTML y CSS
Git

Git es una herramienta de control de versión y colaboración.

HTML

HTML usa "marcado" (markup en inglés) y define la estructura de los documentos en Internet.

CSS
SCSS o SASS

Sass es el acrónimo de Syntactically Awesome Style Sheets. Saber esto no es imprescindible pero sí muy recomendado para ordenar y modularizar proyectos, especialmente cuando son más grandes.

Proyectos Grupales

Proyectos Individuales

  1. Alejandro Jiménez Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Alejandro Jiménez Amín)
  2. Amalia Casanova Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Amalia Casanova)
  3. Antonia Escudero Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Antonia Escudero)
  4. Antonia Gallardo Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Antonia Gallardo)
  5. Antonia López 3 - Taller de Diseño de Interacción 2020(Alumnos: Antonia López)
  6. Camilo Caroca Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Camilo Caroca)
  7. Catalina Armijo Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Catalina Armijo)
  8. Catalina González Tarea 3- Taller de Diseño de Interacción 2020(Alumnos: Catalina González)
  9. Catalina Jorquera Kruberg Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Catalina Jorquera Kruberg)
  10. Catalina Velásquez Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Catalina Velásquez)
  11. Constanza Cabrera Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Constanza Cabrera)
  12. Constanza Villarroel Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Constanza Villarroel)
  13. Cristina Herrero Tarea 3- Taller de Diseño de Interacción 2020(Alumnos: Cristina Herrero)
  14. Daniela Murillo Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Daniela Murillo)
  15. David Silva Bernales Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: David Silva Bernales)
  16. Fernanda Talamilla P Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Fernanda Talamilla P)
  17. Gabriela Zett Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Gabriela Zett)
  18. Javiera Galaz Tarea 3- Taller de Diseño de Interacción 2020(Alumnos: Javiera Galaz)
  19. Josefa Zamora Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Josefa Zamora)
  20. Marcelo Mondaca Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Marcelo Mondaca)
  21. Martín Canihuante Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Martín Canihuante)
  22. María Ignacia Santander Tarea 3- Taller de Diseño de Interacción 2020(Alumnos: María Ignacia Santander Serrano)
  23. María Inés González Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: María Inés González Guardia)
  24. Omar Nuñez Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Omar Nuñez)
  25. Paola Chicano Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Paola Chicano)
  26. Roberta Durán Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Roberta Durán)
  27. Rocío Castillo Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Rocío Castillo)
  28. Rodrigo Toro Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Rodrigo Toro)
  29. Sebastián Perucci Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Sebastián Perucci)
  30. Valentina Blanco Tarea 3- Taller de Diseño de Interacción 2020(Alumnos: Valentina Blanco)
  31. Vicente Quezada Salfate Tarea 3 - Taller de Diseño de Interacción 2020(Alumnos: Vicente Quezada Salfate)



Ciclo 2: Juego, Fenómeno y Tecnología

Tras la materia estudiada bajo el enfoque crítico y disciplinar correspondiente a los Patrones de Interacción y sus buenas y malas prácticas frente a la Experiencia de Usuario, levantaremos la segunda arista que fundamenta el Taller, bajo el fenómeno del Juego, desde la percepción contemplativa como estado de flujo de Interacción.

El juego como fenómeno espiritual propio de la condición humana, es una suerte de proyección que desencadena el objeto -o sistema- diseñado, generando un estado que interrumpe el flujo común de una situación cotidiana -intermezzo-, comportándose como una presentación y expresión figurativa de una idea acerca de nuestra realidad.

El filósofo Ludwig Wittgenstein dice:

...No se puede decir (de los juegos): "Deben tener algo en común, o no serían llamados 'juegos'", pero observen y vean si hay algo común a todos ellos. Porque si los observas, no verás algo que les sea común a todos, sino sólo similitudes parciales o afinidades particulares en ellos. Debes repetirte: ¡no pienses, sino observa!


Por tanto, el campo de observación es el hecho lúdico mismo en el juego y el jugar -game y play-, donde la materia o fenómeno material surge desde su valor potencial -como el dedo que apunta a la luna. No se trata del dedo, se trata de la luna-.

Por el otro lado, la Carta del Errante menciona:

Es necesario obedecer al acto poético con y a pesar del mundo para desencadenar la Fiesta. Y la Fiesta es el juego, supremo rigor de mi libertad. Tal es la misión del poeta porque el mundo debe ser siempre reapasionado.


Es importante comprender el vínculo entre el jugador y el juego en su propia capacidad de celebración y creatividad, conforma el juego como un sistema interactivo y dinámico -un mecanismo- que se compone por elementos esenciales diseñados expresamente para conformar la experiencia del juego. Este mecanismo interno constituye un delicado balance entre la restricción o traba que reside en el conjunto de reglas que contienen el flujo de las jugadas y el ritmo de los pequeños logros o victorias que ritman, matizan y retroalimentan la experiencia; y todo ello orientado hacia una meta clara y manifiesta. Entonces se entiende que el saber jugar no tiene nada que ver con las reglas, sino con las heurísticas o conjunto de tácticas que surgen del “saber jugar bien”, de la destreza, y todo aquello que guía las acciones y que en definitiva le dan el carácter al juego.

Cronograma del Ciclo

MAYO JUNIO JULIO
S.09 S.10 S.11 S.12 S.13 S.14 S.15 S.16 S.17 S.18 S.19
11-15 18-22 25-29 01-05 08-12 15-19 22-26 29-03 06-10 13-17 20-24
EN PARO LIBRE Puesta al día TÉRMINO
Define su observación personal mediante modelos y casos de estudio Versión 1: Propuesta Individual

Revisión y corrección

Revisión de avances y corrección Versión 2: Propuesta Individual

Definición de tipo de juego

Semana sin clases ni evaluaciones . PDC2020 Conferencia de Diseño.

(Profesores Ausentes)

Desarrollo propuesta juego grupal

Revisión de avances y corrección

Validación del juego con “otros”

Revisión de avances y corrección

Implementa mejoras a partir de evaluación Desarrolla su entrega final ¿Cómo se transfiere la experiencia del juego? Elabora y entrega documentación definitiva

Etapa 1: Observación del Juego

Encargo 1

Como primer ejercicio de esta etapa, abriremos el campo de la observación desde el ámbito cotidiano -dentro de la posibilidades que permiten el contexto en que estamos viviendo-, contemplando distintos espacios e interacciones lúdicas,haciendo consciente e identificando como nos adentramos desde ellas a un flujo de juego, respondiendo las siguientes preguntas: ¿Qué momentos permiten el aparecer de un “juego”?, ¿Como nos encontramos con un estado de flujo de juego? ¿Que elementos de ese momento permiten dejarme llevar cuando se experimenta un fenómeno lúdico?

Para decantar este estudio, debe estar apoyado por distintos materiales que evidencian las observaciones:

  • Croquis: que evidencien y abstraiga los fenómenos contemplados.
  • Esquemas conceptuales y Modelos: Visualizaciones que levanten conceptos claves del estudio, acoplados en un figura de pensamiento.
  • Textos descriptivos y argumentales: en donde se desarrolla y articula las observaciones levantadas.
  • Formato de Entrega: Vía Casiopea.
    • +Nuevo Objeto > Nueva Tarea > Nombrar la Tarea como "Nombre de Alumno, Estado de flujo: entre el juego y lo cotidiano, E1- Taller de Diseño de Interacción 2020"
    • Número: 5
  • Día de Entrega: Viernes, 8 de Mayo.
  • Herramientas: Descripciones escritas, Fotos de Croquis (Photoshop,Escaner,etc), Esquemas conceptuales y Modelos (Illustrator, entre otros programas).
Entregables

Encargo 2

Teniendo ya un primer acercamiento al juego como un estado de flujo, trasladar estas experiencias de observación hacia casos de estudios únicos; buscar 2 juegos de cualquier naturaleza (corporales, vídeo juegos, de mesa, etc.), observar los elementos que lo constituyen, compararlos, y levantar mapas conceptuales, fundamentos y modelos (figuras de pensamiento) que permitan construir el estudio requerido.

Para decantar este estudio, debe estar apoyado por distintos materiales que evidencian las observaciones:

  • Croquis: que evidencien y abstraiga los conceptos contemplados (en el caso de juegos físicos).
  • Capturas de Imágenes: que evidencien los conceptos que constituyen el flujo (en el caso de juegos digitales).
  • Esquemas conceptuales y Modelos: Visualizaciones que levanten conceptos claves del estudio, acoplados en un figura de pensamiento.
  • Textos descriptivos y argumentales: en donde se desarrolla y articula las observaciones levantadas.
  • Formato de Entrega: Vía Casiopea.
    • +Nuevo Objeto > Nueva Tarea > Nombrar la Tarea como "Nombre de Alumno, Casos de Estudios del Juego, E2- Taller de Diseño de Interacción 2020"
    • Número: 6
  • Día de Entrega: Martes, 12 de Mayo.
  • Herramientas: Descripciones escritas, Fotos de Croquis (Photoshop,Escaner,etc), Esquemas conceptuales y Modelos (Illustrator, entre otros programas).
Entregables

Encargo 3

Seguir profundizando los casos estudiados y abrir campo a mas casos comenzando a construir una biblioteca de casos en relación a la materia del taller. De las lecturas propuestas para el ciclo, identificar conceptos que se encuentran en la galaxia del juego, eligiendo uno y profundizándolo (estos conceptos no se pueden repetir por alumno).

Para decantar este estudio, debe estar apoyado por distintos materiales que evidencian las observaciones:

  • Croquis: que evidencien y abstraiga los conceptos contemplados (en el caso de juegos físicos).
  • Capturas de Imágenes: que evidencien los conceptos que constituyen el flujo (en el caso de juegos digitales).
  • Esquemas conceptuales y Modelos: Visualizaciones que levanten conceptos claves del estudio, acoplados en un figura de pensamiento (tanto para los casos de estudios como los conceptos profundizados).
  • Textos descriptivos y argumentales: en donde se desarrolla y articula las observaciones levantadas (tanto para los casos de estudios como los conceptos profundizados).
  • Formato de Entrega: Vía Casiopea.
    • +Nuevo Objeto > Nueva Tarea > Nombrar la Tarea como "Nombre de Alumno, Casos de Estudios del Juego, E3- Taller de Diseño de Interacción 2020"
    • Número: 7
  • Día de Entrega: Martes, 15 de Mayo.
  • Herramientas: Descripciones escritas, Fotos de Croquis (Photoshop,Escaner,etc), Esquemas conceptuales y Modelos (Illustrator, entre otros programas).
Entregables

Proyecto Individual etapa 1: Observación del Juego

Teniendo los encargos realizados anteriormente, crear un proyecto correspondiente a la investigación individual de un concepto del juego, junto con los casos de estudio de juegos únicos y variados (mínimo 2 por alumno). Para incluir al proyecto los casos de juegos realizados, enlazar como "casos de estudios".

En este proyecto debe presentarse:

  • Observación y teoría del Juego: Bajada argumentativa que levante la revisión teórica abstraída de la bibliográfica estudiada, que introduzca a la materia del ciclo.
  • Modelo de la teoría del Juego: Modelo conceptual que sintetice la revisión teórica y explique en que consiste el juego como un flujo de interacción.
  • Estudios de casos de Juego: presentación, descripción y comparación y comprensión de variados casos de juegos (mínimo 2, únicos e irrepetibles por alumnos). este este estudio debe estar enriquecido tanto por material textual, como material visual y conceptual que lo fundamente (croquis o capturas de pantallas según la naturaleza del juego, mapas y modelos conceptuales, entre otros). En ello debe evidenciarse la naturaleza del juego, en que consiste, como se estructura, el comportamiento de el(los) jugador(es), y como se relacionan entre casos
  • Investigación de un concepto: que se ubique dentro de la galaxia del juego, materia enriquecida por texto, mapas conceptuales, modelos, entre otros.

Materiales que enriquezcan el es estudio de la materia:

  • Croquis: que evidencien y abstraiga los conceptos contemplados (en el caso de juegos físicos).
  • Capturas Imágenes: que evidencien los conceptos que constituyen el flujo (en el caso de juegos digitales).
  • Esquemas conceptuales y Modelos: Visualizaciones que levanten conceptos claves del estudio, acoplados en un figura de pensamiento (tanto para los casos de estudios como los conceptos profundizados).
  • Textos descriptivos y argumentales: en donde se desarrolla y articula las observaciones levantadas (tanto para los casos de estudios como los conceptos profundizados).


  • Formato de Entrega: Vía Casiopea.
    • +Nuevo Objeto > Nuevo Proyecto > Nombrar Proyecto como "Nombre de Alumno, Observación del Juego- Taller de Diseño de Interacción 2020"
    • Palabra Clave: teoriadeljuego
  • Día de Entrega: Martes, 19 de Mayo.
  • Herramientas: Descripciones escritas, Fotos de Croquis (Photoshop,Escaner,etc), Esquemas conceptuales y Modelos (Illustrator, entre otros programas).
Entregables

Proyecto Individual etapa 2: Observación del Juego

Siguiendo con el desarrollo del proyecto, dirigir todo el contenido levantado y estudiado en la convergencia de un prototipo individual de juego (puede ser físico o digital) que contenga todos los elementos claves que participan en la constitución de un estado de juego.

Para ello, debe presentarse:

  • Observación y teoría del Juego: Bajada argumentativa que levante la revisión teórica abstraída de la bibliográfica estudiada, que introduzca a la materia del ciclo.
  • Modelo de la teoría del Juego: Modelo conceptual que sintetice la revisión teórica y explique en que consiste el juego como un flujo de interacción.
  • Estudios de casos: Vincular los casos estudiados de juego, junto con una descripción y un comparación entre ellos (cada caso de estudio debe contener su observación como flujo, esquemas y modelos que los argumenten)
  • Investigación de un concepto: que se ubique dentro de la galaxia del juego, materia enriquecida por texto, mapas conceptuales, modelos, entre otros.
  • Observación del concepto: desde el concepto estudiado, abrir campo de observación (por medio de dibujos, anotaciones y demás) y como este aparece en la cotidianidad como elemento gatillante de un estado de juego. Este estudio debe estar enriquecido con esquemas y modelos que lo argumenten.
  • Diseño de juego: Primera versión de prototipo de un juego (original) que ideado desde la observaciones realizadas, construido con materiales de alcance accesible en casa. Presentar por dibujos del diseño, textos que lo describan (en el debe evidenciarse la naturaleza del juego, en que consiste, como se estructura, el comportamiento de el(los) jugador(es)) y fotos del prototipo real.

Materiales que enriquezcan el es estudio de la materia:

  • Croquis: que evidencien y abstraiga los conceptos contemplados (en el caso de juegos físicos).
  • Capturas Imágenes: que evidencien los conceptos que constituyen el flujo (en el caso de juegos digitales).
  • Esquemas conceptuales y Modelos: Visualizaciones que levanten conceptos claves del estudio, acoplados en un figura de pensamiento (tanto para los casos de estudios como los conceptos profundizados).
  • Textos descriptivos y argumentales: en donde se desarrolla y articula las observaciones levantadas (tanto para los casos de estudios como los conceptos profundizados).
  • Fotos de Prototipos: Imágenes que muestren la totalidad del prototipo, desde su figura general hasta sus partes mas importantes.
  • Formato de Entrega: Vía Casiopea.
    • Actualizar el proyecto "Nombre de Alumno, Observación del Juego- Taller de Diseño de Interacción 2020"
    • Palabra Clave: juegouno
  • Día de Entrega: Martes, 22 de Mayo.
  • Herramientas: Descripciones escritas, Fotos de croquis y prototipo (Photoshop, Escaner,etc), Esquemas conceptuales y Modelos (Illustrator, entre otros programas).

Proyecto Individual Presentación: Observación y Diseño del Juego

Entrando al final de esta primera etapa del ciclo, realizar presentación final de su proyecto individual, teniendo en consideración lo siguientes puntos:

  1. Mapa Teórico del Juego: Mapa conceptual que induzca a la materia del juego a nivel genérico(junto con apoyo descriptivo de textos, citas, etc.), estudio respaldados por las referencias bibliográficas entregadas para este ciclo.
  2. Observación de flujos del juego dentro de lo cotidiano: Ejercicio de Observación por medio de dibujos anotaciones que levanten elementos que forman parte del estado de juego.
  3. Casos de Estudios: Análisis de distintos casos de juegos ya existentes, en donde se estudia la mecánica y los elementos que entrar en juego para que se produzca este flujo de juego.
  4. Concepto levantado y profundizado: Identificar un concepto que se relaciones con el acto ludico del juego, ahondando en como se articula en un sistema y cuales son sus cualidades.
  5. Propuesta de Juego:
    1. Concepto del Juego: ficha técnica y descripción que presente las características generales del juego propuesto (acompañado por imágenes del juego diseñado).
      1. Nombre del Juego
      2. Categoría: Juego de Rol, Competencia, Destreza física, Abstracto, Party Game, Temáticos, etc. (Videojuego o de mesa)
      3. Participantes: De cuantos jugadores es el juego.
      4. Campo de juego: En mesa, dimensionalidad física, Digital, etc.
      5. Piezas: Cartas, piezas calzadas, fichas, etc.
      6. Tiempo ponderado: cuanto es el tiempo que se demora en realizar una partida.
    2. Objetivo: ¿Cual es la finalidad?
    3. Jugabilidad y mecánicas del juego : Reglas y procedimientos donde se presenta cuales son los artefactos y como interactuan.
    4. Modelo del juego: Modelo conceptual donde evidencia el dinamismo en el sistema diseñado en el juego y como rebela el flujo del juego (elemento tensor que mantiene a los jugadores dentro del estado ludico).
  6. Presentación en vídeo:
    1. Presentación del juego: Objetivo, Reglas, Procedimientos (jugabilidad)
    2. El concepto que lo fundamenta
    3. Modelo del juego y descripción del dinamismo en el sistema del juego.
    4. Este vídeo debe durar máximo 2 minutos

Como entregar:

  • Formato de Entrega: Vía Casiopea.
    • Nuevo Proyecto: "Nombre de Alumno, Observación del Juego- Taller de Diseño de Interacción 2020"
    • Palabra Clave: juegouno
  • Día de Entrega: Domingo, 7 de Junio.
  • Materiales y Herramientas: Descripciones escritas, Fotos de croquis y Fotos de la propuesta (Photoshop, Escaner,etc), Esquemas conceptuales y Modelos (Illustrator, entre otros programas), Videos (Sony Vegas, Photoshop, Power Point, Movie Maker, Filmora, etc.).
Proyectos Individuales
  1. "David Silva Bernales, Observación del Juego- Taller de Diseño de Interacción 2020"
  2. "Sebastián Perucci, Observación del Juego- Taller de Diseño de Interacción 2020"
  3. Alejandro Jiménez, Observación del Juego- Taller de Diseño de Interacción 2020
  4. Amalia Casanova, Observación del Juego- Taller de Diseño de Interacción 2020
  5. Antonia Escudero, Observación del Juego- Taller de Diseño de Interacción 2020
  6. Antonia Gallardo, Observación del Juego- Taller de Diseño de Interacción 2020
  7. Antonia López Lagos, Observación del Juego- Taller de Diseño de Interacción 2020
  8. Camilo Caroca, Observación del juego- Taller de Diseño de Interacción 2020
  9. Catalina Armijo, Observación del Juego- Taller de Diseño de Interacción 2020
  10. Catalina González, Observación del Juego- Taller de Diseño de Interacción 2020
  11. Catalina Jorquera Kruberg, Observación del Juego- Taller de Diseño de Interacción 2020
  12. Catalina Velasquez, Observación del Juego- Taller de Diseño de Interacción 2020
  13. Constanza Cabrera, Observación del Juego- Taller de Diseño de Interacción 2020
  14. Constanza Villarroel, Observación del Juego- Taller de Diseño de Interacción 2020
  15. Cristina Herrero, Observación del Juego- Taller de Diseño de Interacción 2020
  16. Daniela Murillo, Observación del Juego- Taller de Diseño de Interacción 2020
  17. Fernanda Talamilla Pino, Observación del Juego- Taller de Diseño de Interacción 2020
  18. Gabriela Zett, Observación del Juego - Taller de Diseño de Interacción 2020
  19. Javiera Galaz, Observación del Juego- Taller de Diseño de Interacción 2020
  20. Josefa Zamora, Observación del Juego- Taller de Diseño de Interacción 2020
  21. Marcelo Mondaca, Observación del Juego- Taller de Diseño de Interacción 2020"
  22. Martín Canihuante, Observación del Juego- Taller de Diseño de Interacción 2020
  23. María Ignacia Santander, Observación del Juego- Taller de Diseño de Interacción 2020
  24. María Inés González, Observación del Juego- Taller de Diseño de Interacción 2020
  25. Omar Nuñez, Observación del Juego- Taller de Diseño de Interacción 2020
  26. Paola Chicano, Observación del Juego- Taller de Diseño de Interacción 2020
  27. Roberta Durán, Observación del Juego - Taller Diseño de Interacción 2020
  28. Rocío Castillo, Observación del Juego- Taller de Diseño de Interacción 2020
  29. Valentina Blanco, Observación del Juego- Taller de Diseño de Interacción 2020
  30. Vicente Quezada Salfate, Observación del Juego- Taller de Diseño de Interacción 2020

Etapa 2: Diseño de un sistema de Juego

Encargo 1

Habiendo experimentado un primer ejercicio individual, donde desarrollaron un estudio (por medio de la observación, lectura teórica y casos de estudios como referencias) y con eso una propuesta de juego, conformando todos los elementos claves para la estructuración de un sistema de juego, ahora se formalizará esta experiencia en un proyecto grupal, que contenido levantado desde el ejercicio anterior, tendrán que re formular una nueva propuesta de juego, considerando en este primer encargo, los siguientes puntos:

  • Introducción a la materia del juego: Introducción teórica de que se trata el juego y la relacion de todos los elementos que estructuran y hacen evidente su cualidad ludica (enriquecerlo con un mapa conceptual).
  • Re formulación del concepto de juego:
    • Breve presentación de las propuestas individuales: concepto y como se abordo a un juego
    • Articulación de estos conceptos (enriquecido con texto y un modelo)
    • Casos de estudios: Nuevos casos de estudios que puedan perfilar hacia la formulación de su concepto
    • Presentación del concepto formulado: Argumento del concepto, en relacion al contenido levantado anteriormente que enriquece con características indicadas hacia la realización de un juego (aparte del concepto, que elementos que rescatados le dará el carácter al juego que diseñaran) (enriquecido con modelo)
  • Primeras Propuestas del Juego: Nombre de la propuesta, demostraciones en dibujos, esquemas de las versiones ideadas (ideal tener un prototipo alfa del juego) y descripción de como se jugaría.
Proyectos Grupales
  1. Descarados
  2. Fueguinos
  3. MATCH
  4. Propuesta de Juego: Batalla Anura
  5. Propuesta de Juego: Formadito
  6. Propuesta de Juego: Funginvasores
  7. Propuesta de Juego: La piedra filosofal
  8. Propuesta de Juego: ORBITALLYS

Bibliografía

  1. Homo Ludens, Johan Huizinga
  2. Manifiesto for a Ludic Century, Eric Zimermman
  3. Clasificación de los juegos, Roger Caillois
  4. El Arte como Experiencia, John Dewey
  5. Metatopia: Diseño de Juegos de Mesa 101

Autómatas Celulares

  1. Does John Conway hate his Game of Life?
  2. Regla 30, en Wolfram Alpha
  3. Epic Conway's game of life
  4. Life in life
  5. Del libro "A New Kind of Science", p. 55: El espacio de solución de los autómatas celulares. Aquí podemos observar diferentes tipos de emergencia: la periódica (tediosa), la recursiva (fractal) y la caótica (irreductible).
  6. Referencia tangencial, de las implicancias del pensamiento discreto del algoritmo como motor para la emergencia de los fenómenos físicos: Proyecto Wolfram Physics: hacia una nueva teoría fundamental del universo.

Herramientas

  1. Scratch Pogramación fácil para crear juegos.
  2. P5js y Processing
    1. Tic Tac Toe Tutorial P5js.
    2. Lista de tutoriales de Juegos