Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.
INTERACCIONES
ENCANTADORAS
INTERFACES DE USUARIO DESDE 

UNA PERSPECTIVA SEMIÓTICA-RETÓRICA
Omar Sosa-Tzec
Contraste Colec...
¡Hola!
formas,colores,ysabores.
SoyOmary…
Mi práctica de diseño
¿A qué me dedico ahora?
Professor de Arte y Diseño
Escuela Penny W. Stamps de Arte y Diseño,
Universidad de Michigan
¿En qué se enfoca mi investigación?
Interacción

Humano-
Computadora
Retórica y

Semiótica
Diseño de
Información
Visual
Sistemas
Interactivos como
Argumentos
Multimodales
+
Interfaces
Encantadoras
(Deleite en IHC)
Motivación
¿Qué opinas sobre estos anuncios?
Source: https://i0.wp.com/craphound.com/images/marlboro20mummy.jpg
¿Qué te dice este post?
Usabilidad y Experiencia de Usuario
Deslizar a la
derecha para

Me gusta
Deslizar a la
izquierda para No
me interesa
Denotación vs. Connotación
Bueno,
deseable,
correcto
Malo,

indeseable,

incorrecto
Source: https://commons.wikimedia.org
Mensaje
compuesto de
signos
Significado
Efecto en la conducta,
comportamiento,o creencias
RetóricaExperiencia de Usuario
Se...
Componentes de Interfaz vistos como
signos dinámicos y estáticos
Interfaz
compuesta de
signos
Significado
Efecto en la conducta,
comportamiento,o creencias
RetóricaExperiencia de Usuario
S...
Los diseñadores debemos de estar
atentos de los significados y retórica
(discursos) que introducimos en la
vida diaria de l...
Pongamos atención a la semiótica y
retórica de las interfaces de usuario
y sistemas interactivos.
Los diseñadores debemos ...
Semiótica e
Interacción
Humano-
Computadora
UsuarioDiseñador
IHC vista como meta-comunicación
Sistema
(Interfaz de
Usuario)
De Souza (2005)
Signos estáticos y
dinámic...
Retórica e
Interacción
Humano-
Computadora
Source: https://s3-us-west-2.amazonaws.com/courses-images-archive-read-only/wp-content/uploads/sites/224/2015/03/20114031/...
Source: https://s3-us-west-2.amazonaws.com/courses-images-archive-read-only/wp-content/uploads/sites/224/2015/03/20114031/...
UsuarioDiseñador
IHC vista como meta-comunicación
Sistema
(Interfaz de
Usuario)
De Souza (2005)
Signos estáticos y
dinámic...
UsuarioDiseñador
Sistema
(Interfaz de
Usuario)
Buchanan (2001)
Signos estáticos y
dinámicos
Influencia
discursiva
Argument...
Funciones retóricas de un sistema
• Persuadir
• Identificar
• Invitar al entendimiento
• Ayudar al auto-descubrimiento y au...
Source: https://www.makeuseof.com/tag/apple-watch-fitness-workout-apps/
• Persuadir
• Identificar
• Invitar al entendimiento...
Source: https://www.makeuseof.com/tag/apple-watch-fitness-workout-apps/
• Persuadir
• Identificar
• Invitar al entendimiento...
Source: https://www.makeuseof.com/tag/apple-watch-fitness-workout-apps/
• Persuadir
• Identificar
• Invitar al entendimiento...
• Persuadir
• Identificar
• Invitar al entendimiento
• Ayudar al auto-descubrimiento y auto-conocimiento
• Darle forma a la...
• Persuadir
• Identificar
• Invitar al entendimiento
• Ayudar al auto-descubrimiento y auto-conocimiento
• Darle forma a la...
Interfaces y los
Tres Modos de
Apelación en
Retórica
Sistema
(Interfaz de Usuario)
Sosa-Tzec (2015,2017)
Dimensiones retóricas de 

la interfaz de usuario
Logos
Ethos
Pathos
Sistema
(Interfaz de Usuario)
Ehses (2008),Sosa-Tzec (2015)
Dimensiones retóricas de 

la interfaz de usuario
Logos
Ethos
...
Sistema
(Interfaz de Usuario)
Ehses (2008),Sosa-Tzec (2015)
Dimensiones retóricas de 

la interfaz de usuario
Logos
Ethos
...
Sistema
(Interfaz de Usuario)
Ehses (2008),Sosa-Tzec (2015)
Dimensiones retóricas de 

la interfaz de usuario
Logos
Ethos
...
Logos Ethos Pathos+ +
Yahoo! Weather App
Ethical
Appeal
Interface
tn
Interface
tn+1
Rational
Appeal
Ethical
Appeal
Rational
Appeal
Fluctuación en la Experiencia de...
Entimema: 

el usuario como
elemento activo de
una experiencia
persuasiva
Entimema: el argumento retórico
Covino & Jolliffe (1995,p.48)
Todos los humanos son mortales [premisa mayor]
Sócrates es h...
Source: https://www.makeuseof.com/tag/apple-watch-fitness-workout-apps/
Logos Ethos Pathos+ +
Gaza Everywhere por Ahmad Nassri (2014)
Logos Ethos Pathos+ +
Yahoo! Weather App
Sosa-Tzec (2015)
Experiencia persuasiva
centrada en el usuario
user
user
designer
i
j
k
user
user
UserExperience
Context o...
Retórica,
Deleite, e
Interfaces
Sistemas Interactivos
como
Argumentos
Multimodales
+
Interfaces Encantadoras
(Deleite en IHC)
Sistemas Interactivos
como
Argumentos
Multimodales
+
Interfaces Encantadoras
(Deleite en IHC)
Logos
Ethos
Pathos
+
+
Entim...
Sistemas Interactivos
como
Argumentos
Multimodales
+
Interfaces Encantadoras
(Deleite en IHC)
Logos
Ethos
Pathos
+
+
Entim...
• Persuadir
• Identificar
• Invitar al entendimiento
• Ayudar al auto-descubrimiento y
auto-conocimiento
• Darle forma a la...
Facebook para iOS
• Persuadir
• Identificar
• Invitar al entendimiento
• Ayudar al auto-descubrimiento y
auto-conocimiento
...
Facebook para iOS
• Persuadir
• Identificar
• Invitar al entendimiento
• Ayudar al auto-descubrimiento y
auto-conocimiento
...
Facebook para iOS
• Persuadir
• Identificar
• Invitar al entendimiento
• Ayudar al auto-descubrimiento y
auto-conocimiento
...
Facebook para iOS
• Persuadir
• Identificar
• Invitar al entendimiento
• Ayudar al auto-descubrimiento y
auto-conocimiento
...
Interacciones
Encantadoras
(Deleitosas)
Experiencia encantadora: 

Galleta de la fortuna
Sosa-Tzec (2017)
Sosa-Tzec (2017)
Elementos de diseño 

de una interfaz de usuario
Visual Verbal
Táctil
Olfativo
Auditivo
Temporal
Sistema
...
De Souza et al.(2010),Saffer (2014),Sosa-Tzec (2017)
Unidad de análisis
•Componente de interfaz sencillo (signo de interfa...
Unidad de análisis
•Componente de interfaz sencillo (signo de interfaz)
•Micro-interacción
•Flujo de interacción
Visual Ve...
De Souza et al.(2010),Saffer (2014),Sosa-Tzec (2017)
Unidad de análisis
•Componente de interfaz sencillo (signo de interfa...
Sosa-Tzec (2017)
Elementos de 

una interacción encantadora
•Punto inicial claro (estado inicial)
•Punto final claro (cierr...
• Punto inicial claro (estado inicial)
• Punto final claro (cierre)
• Ruptura en patrón (desviación moderada
pero significat...
• Punto inicial claro (estado inicial)
• Punto final claro (cierre)
• Ruptura en patrón (desviación moderada
pero significat...
• Punto inicial claro (estado inicial)
• Punto final claro (cierre)
• Ruptura en patrón (desviación moderada
pero significat...
Para Terminar: 

lo Bueno, lo Malo,
y lo Feo
Lo bueno
Nosotros los diseñadores tenemos la
oportunidad de intervenir positivamente en
el día a día de muchas personas a ...
Lo malo
Nuestra práctica de diseñar experiencias
encantadoras para toda la tecnología
involucrada en la vida diaria contri...
Lo feo
No estar consciente y no ser responsable de
las implicaciones de nuestros diseños y su rol
argumentativo (retórico)...
¡Gracias!
¿Y tú qué opinas sobre
las interacciones y
experiencias de usuario
encantadoras?
tzec.com
@omitzec
Nächste SlideShare
Wird geladen in …5
×

Interacciones Encantadoras: Interfaces de Usuario desde una Perspectiva Semiótica-Retórica

372 Aufrufe

Veröffentlicht am

Presentación de la charla para Contraste Colectivo (Congreso de Diseño Gráfico de la FADU AUT en México) acerca de mi investigación en interfaces encantadoras (delightful interfaces) desde una perspectiva teórica basada en semiótica y retórica.

Veröffentlicht in: Design
  • Loggen Sie sich ein, um Kommentare anzuzeigen.

Interacciones Encantadoras: Interfaces de Usuario desde una Perspectiva Semiótica-Retórica

  1. 1. INTERACCIONES ENCANTADORAS INTERFACES DE USUARIO DESDE 
 UNA PERSPECTIVA SEMIÓTICA-RETÓRICA Omar Sosa-Tzec Contraste Colectivo 3er Congreso Internacional de Diseño Gráfico Abril 5, 2019 Tampico, Tamaulipas, México
  2. 2. ¡Hola!
  3. 3. formas,colores,ysabores. SoyOmary…
  4. 4. Mi práctica de diseño
  5. 5. ¿A qué me dedico ahora? Professor de Arte y Diseño Escuela Penny W. Stamps de Arte y Diseño, Universidad de Michigan
  6. 6. ¿En qué se enfoca mi investigación? Interacción
 Humano- Computadora Retórica y
 Semiótica Diseño de Información Visual
  7. 7. Sistemas Interactivos como Argumentos Multimodales + Interfaces Encantadoras (Deleite en IHC)
  8. 8. Motivación
  9. 9. ¿Qué opinas sobre estos anuncios? Source: https://i0.wp.com/craphound.com/images/marlboro20mummy.jpg
  10. 10. ¿Qué te dice este post?
  11. 11. Usabilidad y Experiencia de Usuario Deslizar a la derecha para
 Me gusta Deslizar a la izquierda para No me interesa
  12. 12. Denotación vs. Connotación Bueno, deseable, correcto Malo,
 indeseable,
 incorrecto
  13. 13. Source: https://commons.wikimedia.org
  14. 14. Mensaje compuesto de signos Significado Efecto en la conducta, comportamiento,o creencias RetóricaExperiencia de Usuario Semiótica Usuario Contexto de uso
  15. 15. Componentes de Interfaz vistos como signos dinámicos y estáticos
  16. 16. Interfaz compuesta de signos Significado Efecto en la conducta, comportamiento,o creencias RetóricaExperiencia de Usuario Semiótica Usuario Contexto de uso
  17. 17. Los diseñadores debemos de estar atentos de los significados y retórica (discursos) que introducimos en la vida diaria de las personas.
  18. 18. Pongamos atención a la semiótica y retórica de las interfaces de usuario y sistemas interactivos. Los diseñadores debemos de estar atentos de los significados y retórica (discursos) que introducimos en la vida diaria de las personas.
  19. 19. Semiótica e Interacción Humano- Computadora
  20. 20. UsuarioDiseñador IHC vista como meta-comunicación Sistema (Interfaz de Usuario) De Souza (2005) Signos estáticos y dinámicos Semiosis Mensaje
  21. 21. Retórica e Interacción Humano- Computadora
  22. 22. Source: https://s3-us-west-2.amazonaws.com/courses-images-archive-read-only/wp-content/uploads/sites/224/2015/03/20114031/Maccari-Cicero.jpg Orador Situación Audiencia
  23. 23. Source: https://s3-us-west-2.amazonaws.com/courses-images-archive-read-only/wp-content/uploads/sites/224/2015/03/20114031/Maccari-Cicero.jpg ¡Compañeros! 
 Este diseño es mi propuesta para abordar la situación que nos está afectando Diseñador Usuarios
  24. 24. UsuarioDiseñador IHC vista como meta-comunicación Sistema (Interfaz de Usuario) De Souza (2005) Signos estáticos y dinámicos Semiosis Mensaje
  25. 25. UsuarioDiseñador Sistema (Interfaz de Usuario) Buchanan (2001) Signos estáticos y dinámicos Influencia discursiva Argumento IHC vista como argumentación
  26. 26. Funciones retóricas de un sistema • Persuadir • Identificar • Invitar al entendimiento • Ayudar al auto-descubrimiento y auto-conocimiento • Darle forma a la realidad Sosa-Tzec (2017)
  27. 27. Source: https://www.makeuseof.com/tag/apple-watch-fitness-workout-apps/ • Persuadir • Identificar • Invitar al entendimiento • Ayudar al auto-descubrimiento y auto-conocimiento • Darle forma a la realidad Activity App por Apple
  28. 28. Source: https://www.makeuseof.com/tag/apple-watch-fitness-workout-apps/ • Persuadir • Identificar • Invitar al entendimiento • Ayudar al auto-descubrimiento y auto-conocimiento • Darle forma a la realidad Activity App por Apple
  29. 29. Source: https://www.makeuseof.com/tag/apple-watch-fitness-workout-apps/ • Persuadir • Identificar • Invitar al entendimiento • Ayudar al auto-descubrimiento y auto-conocimiento • Darle forma a la realidad Activity App por Apple
  30. 30. • Persuadir • Identificar • Invitar al entendimiento • Ayudar al auto-descubrimiento y auto-conocimiento • Darle forma a la realidad
  31. 31. • Persuadir • Identificar • Invitar al entendimiento • Ayudar al auto-descubrimiento y auto-conocimiento • Darle forma a la realidad
  32. 32. Interfaces y los Tres Modos de Apelación en Retórica
  33. 33. Sistema (Interfaz de Usuario) Sosa-Tzec (2015,2017) Dimensiones retóricas de 
 la interfaz de usuario Logos Ethos Pathos
  34. 34. Sistema (Interfaz de Usuario) Ehses (2008),Sosa-Tzec (2015) Dimensiones retóricas de 
 la interfaz de usuario Logos Ethos Pathos • Logos apela a la razón o lógica. • Persuade al usuario a través del poder del razonamiento. • Se manifiesta en la interfaz a través de datos,hechos, información directamente relacionada con la funcionalidad del sistema.
  35. 35. Sistema (Interfaz de Usuario) Ehses (2008),Sosa-Tzec (2015) Dimensiones retóricas de 
 la interfaz de usuario Logos Ethos Pathos • Ethos es apelar a través del carácter del diseñador implícito en el diseño. • Persuade a través de dar credibilidad,empatía,y confiabilidad al usuario. • Se manifiesta en la interfaz a través de una correcta implementación de diseño (componentes de interfaz e interacciones asociadas) y como éste conecta con los valores estéticos y morales 
 del usuario.
  36. 36. Sistema (Interfaz de Usuario) Ehses (2008),Sosa-Tzec (2015) Dimensiones retóricas de 
 la interfaz de usuario Logos Ethos Pathos • Pathos apela a las emociones. • Persuade a través de 
 la provocación de sentimientos en el usuario. • Las características y necesidades del usuario influyen en la selección de signos de interfaz capaces de provocar emociones. • Pathos se relaciona muchas veces con el movimiento (animaciones)
  37. 37. Logos Ethos Pathos+ + Yahoo! Weather App
  38. 38. Ethical Appeal Interface tn Interface tn+1 Rational Appeal Ethical Appeal Rational Appeal Fluctuación en la Experiencia de Usuario
  39. 39. Entimema: 
 el usuario como elemento activo de una experiencia persuasiva
  40. 40. Entimema: el argumento retórico Covino & Jolliffe (1995,p.48) Todos los humanos son mortales [premisa mayor] Sócrates es humano [premisa menor] Sócrates es mortal [conclusión] “Sócrateseshumano,porlotantomortal.”
  41. 41. Source: https://www.makeuseof.com/tag/apple-watch-fitness-workout-apps/
  42. 42. Logos Ethos Pathos+ + Gaza Everywhere por Ahmad Nassri (2014)
  43. 43. Logos Ethos Pathos+ + Yahoo! Weather App
  44. 44. Sosa-Tzec (2015) Experiencia persuasiva centrada en el usuario user user designer i j k user user UserExperience Context of Use appl.so tware (visualenthymeme) Discourse
  45. 45. Retórica, Deleite, e Interfaces
  46. 46. Sistemas Interactivos como Argumentos Multimodales + Interfaces Encantadoras (Deleite en IHC)
  47. 47. Sistemas Interactivos como Argumentos Multimodales + Interfaces Encantadoras (Deleite en IHC) Logos Ethos Pathos + + Entimema (posiblemente) Experiencia Persuasiva Centrada en el Usuario
  48. 48. Sistemas Interactivos como Argumentos Multimodales + Interfaces Encantadoras (Deleite en IHC) Logos Ethos Pathos + + Entimema (posiblemente) Experiencia Persuasiva Centrada en el Usuario
  49. 49. • Persuadir • Identificar • Invitar al entendimiento • Ayudar al auto-descubrimiento y auto-conocimiento • Darle forma a la realidad Messages App por Apple Logos Ethos Pathos+ +
  50. 50. Facebook para iOS • Persuadir • Identificar • Invitar al entendimiento • Ayudar al auto-descubrimiento y auto-conocimiento • Darle forma a la realidad Logos Ethos Pathos+ +
  51. 51. Facebook para iOS • Persuadir • Identificar • Invitar al entendimiento • Ayudar al auto-descubrimiento y auto-conocimiento • Darle forma a la realidad Logos Ethos Pathos+ +
  52. 52. Facebook para iOS • Persuadir • Identificar • Invitar al entendimiento • Ayudar al auto-descubrimiento y auto-conocimiento • Darle forma a la realidad Logos Ethos Pathos+ +
  53. 53. Facebook para iOS • Persuadir • Identificar • Invitar al entendimiento • Ayudar al auto-descubrimiento y auto-conocimiento • Darle forma a la realidad Logos Ethos Pathos+ +
  54. 54. Interacciones Encantadoras (Deleitosas)
  55. 55. Experiencia encantadora: 
 Galleta de la fortuna Sosa-Tzec (2017)
  56. 56. Sosa-Tzec (2017) Elementos de diseño 
 de una interfaz de usuario Visual Verbal Táctil Olfativo Auditivo Temporal Sistema (Interfaz de Usuario) Acto de diseñar un componente de la interfaz de usuario Elementos básicos Logos Ethos Pathos + +
  57. 57. De Souza et al.(2010),Saffer (2014),Sosa-Tzec (2017) Unidad de análisis •Componente de interfaz sencillo (signo de interfaz) •Micro-interacción •Flujo de interacción
  58. 58. Unidad de análisis •Componente de interfaz sencillo (signo de interfaz) •Micro-interacción •Flujo de interacción Visual Verbal Táctil Olfativo Auditivo Temporal
  59. 59. De Souza et al.(2010),Saffer (2014),Sosa-Tzec (2017) Unidad de análisis •Componente de interfaz sencillo (signo de interfaz) •Micro-interacción •Flujo de interacción Visual Verbal Táctil Olfativo Auditivo Temporal
  60. 60. Sosa-Tzec (2017) Elementos de 
 una interacción encantadora •Punto inicial claro (estado inicial) •Punto final claro (cierre) •Ruptura en patrón (desviación moderada pero significativa) •Atracción •Vitalidad •Conveniencia •Serendipia
  61. 61. • Punto inicial claro (estado inicial) • Punto final claro (cierre) • Ruptura en patrón (desviación moderada pero significativa) Messages App por Apple • Atracción • Vitalidad • Conveniencia • Serendipia Sosa-Tzec (2017)
  62. 62. • Punto inicial claro (estado inicial) • Punto final claro (cierre) • Ruptura en patrón (desviación moderada pero significativa) Text Delight por Facebook • Atracción • Vitalidad • Conveniencia • Serendipia Sosa-Tzec (2017)
  63. 63. • Punto inicial claro (estado inicial) • Punto final claro (cierre) • Ruptura en patrón (desviación moderada pero significativa) Weather App por Yahoo! • Atracción • Vitalidad • Conveniencia • Serendipia Sosa-Tzec (2017)
  64. 64. Para Terminar: 
 lo Bueno, lo Malo, y lo Feo
  65. 65. Lo bueno Nosotros los diseñadores tenemos la oportunidad de intervenir positivamente en el día a día de muchas personas a través de la creación de argumentos multimodales que sean capaces de provocar deleite.
  66. 66. Lo malo Nuestra práctica de diseñar experiencias encantadoras para toda la tecnología involucrada en la vida diaria contribuye a la adicción del usuario a la pantalla,inmediatez, y gratificación constante.
  67. 67. Lo feo No estar consciente y no ser responsable de las implicaciones de nuestros diseños y su rol argumentativo (retórico),especialmente cuando pueden conducir a comportamientos, actitudes,o creencias desfavorables.
  68. 68. ¡Gracias! ¿Y tú qué opinas sobre las interacciones y experiencias de usuario encantadoras? tzec.com @omitzec

×