UX Trends 2017 Report

1. ZORRAQUINO UXTrends2017-Zorraquino-Marzo2017 UX Trends 2017 www.zorraquino.com  Marzo 2017

2. UXTrends2017-Zorraquino-Marzo2017 Prólogo Para los que no nos conocen, Zorraquino somos una agencia de diseño y estrategia digital, especialista en branding, experiencia de usuario y desarrollo de soluciones integrales para el negocio digital. 2017 es un año importante para nosotros, ya que es el año de nuestro 15º aniversario. Y en parte, por este motivo, presentamos en este informe las 12 tendencias en Experiencia de Usuario más relevantes del momento. 12 conceptos referentes a UX de muy diversos sectores con los que pretendemos hacerte reﬂexionar. Un recorrido por los distintos caminos por los que la Experiencia de Usuario se convierte en la aliada de las marcas para dar mejor servicio, conseguir clientes más satisfechos e incrementar sus ventas. Espero que te resulte interesante. Miguel Zorraquino  linkedin.com/in/mzorraquino 2

3. UX se pasa a la voz Diseñar experiencias para ser habladas Tendencia 1 3 UXTrends2017-Zorraquino-Marzo2017

4. UXTrends2017-Zorraquino-Marzo2017 Diseñar experiencias habladas • La interacción de voz es ya una alternativa o, incluso, un reemplazo completo de interfaces visuales tradicionales. • Cuando la mayoría deje de utilizar pantallas para centrarse en la voz a través de Siri, Alexa, Cortana, Google Home… ¿Cómo se comunicará la identidad de una marca a través de la voz y la conversación? • ¿Qué relación se creará entre el usuario y el asistente de voz? ¿Hasta dónde llegará la conﬁanza con una IA? • Se trata, probablemente, de uno de los mayores desafíos del diseño de experiencia de usuario (UX) desde que nació el smartphone, que podría ascender este año a categoría de mainstream, como se ha puesto de maniﬁesto en CES 2017. 4 Tendencia 1, UX se pasa a la voz

5. Amazon Echo Más conocido como Alexa 5

6. Predicción ventas 2017 33 millones de dispositivos de voz Voice-First Device Footprint 35 30 25 20 15 10 5 0 VoiceLabs Analysis combined with research from CIRP, KPCB and InfoScout Millionsofdevices 2014 2015 2016 2017 6

7. Amazon Fire TV Una televisión controlada por voz 7

8. UXTrends2017-Zorraquino-Marzo2017 En síntesis • El 45% de los adultos estadounidenses utilizan al menos un asistente personal digital activado por voz, como Siri (Apple), Google Now, Cortana (Microsoft) o Alexa (Amazon), según Forrester Data. • Experiencia de baja fricción y altamente personalizada: recordatorios, citas, reservas para cenar… • Los usuarios tienen altas expectativas en esta nueva forma de interacción. • Más fácil, más rápido y más humano (la voz como único intermediario). • Nuevas vías para expresar la identidad de marca: las palabras, la conversación, el tono de voz, etc. • Marcas con identidad de voz como si fuesen humanos. 8 Tendencia 1, UX se pasa a la voz

9. Jason Amunwa, Digital Telepathy “Virgin America may opt to converse with you in a saucy, ﬂirty and suggestive British voice that’s in line with their brand, whereas the New York Times might opt for a more mature, assertive, voice for their announcements. The kids may ﬁnally get to talk directly to Mickey as you book your Disney World vacation! Apple may be searching for the perfectly engaging, and yet soothing voice for your next operating system, (spoiler alert, it’s Scarlett Johanssen’s voice, in Her)” 9 UXTrends2017-Zorraquino-Marzo2017 Tendencia 1, UX se pasa a la voz

10. UXTrends2017-Zorraquino-Marzo2017 Retos y oportunidades • Diseño de la voz y conversaciones: por ahora no son muy espontáneos ni se puede llegar a tener una conexión emocional (uno de los errores de Siri). • Personalización voz según funciones o interacción con marcas. Aportar valor al usuario. Distinguir entre los diferentes miembros de la familia, para mejorar la experiencia del usuario. • Saber cómo habla la gente con las máquinas para diseñar las conversaciones: frases sencillas, preguntas simples y concretas, sin ambigüedad. • Importancia del lenguaje: no hay gráﬁcas ni animaciones. • Aprendizaje mutuo. Alexa aprende de mis respuesta para próximas interacciones y yo tengo que aprender cómo dirigirme a ella para conseguir lo que quiero. 10 Tendencia 1, UX se pasa a la voz

11. Alexa User: Alexa, Ask Date Night to make a reservation at Haymarket tonight.  Do Date Night: Reservation at Haymarket.  For what time tonight? User: About 7:30.   Don’t Date Night: To make a reservation, you need to say the location, time, date and number of people. Please start over. 11 Ejemplo del buen uso del lenguaje por Alexa

12. UXTrends2017-Zorraquino-Marzo2017 Para pensar • Después de mucho tiempo, en 2017 se empezarán a ver cambios reales. El voice interface ya es mainstream. • La privacidad puede ser una barrera, tener un dispositivo que en cuanto dices Alexa reacciona signiﬁca que te está escuchando siempre. • Las palabras importan más que nunca para el UX. • Alianzas entre marcas y empresas tecnológicas. Datos de consumo a cambio del control de la experiencia del consumidor. • Reto para los diseñadores UX: anticiparse a la intención del usuario y mantener su participación una vez haya pasado el momento de novedad. • Hay que seguir desarrollando su personalidad e ir innovando en respuestas: claridad y comprensión, hacia la creación la identidad de marca a través del UX. 12 Tendencia 1, UX se pasa a la voz

13. UXTrends2017-Zorraquino-Marzo2017 Referencias Alexa, tell me a brand’s story  https://uxdesign.cc/how-can-we-tell-a-brands-story-and-create-a-recognisable-identity- through-ai-sound-and-46d9d793e145#.fb6zcpgnq Alexa best practices  https://developer.amazon.com/public/solutions/alexa/alexa-skills-kit/docs/alexa-skills-kit-voice- design-best-practices La voz es la nueva plataforma y Alexa será la reina  https://backchannel.com/voice-is-the-next-big-platform-and-alexa-will-own-it- c2cf13fab911#.btsfy6bn6 Voice report 2017. Datos de crecimiento y desarrollo  http://voicelabs.co/2017/01/15/the-2017-voice-report/ 13 Tendencia 1, UX se pasa a la voz

14. UXTrends2017-Zorraquino-Marzo2017 Referencias La voz es el gran reto para UX  http://www.dtelepathy.com/blog/design/the-ux-of-voice-the-invisible-interface    Qué implica el éxito del IA en la experiencia de usuario  http://www.geomarketing.com/what-the-rise-of-the-intelligent-agent-means-for-customer- experience AI para combatir la soledad  https://uxdesign.cc/can-ai-help-combat-loneliness-fda56da6ec82#.bczo4kl9k 14 Tendencia 1, UX se pasa a la voz

15. Simple vs Retro Conectar mirando al pasado 15 UXTrends2017-Zorraquino-Marzo2017 Tendencia 2

16. UXTrends2017-Zorraquino-Marzo2017 Simple vs Retro • Por mucho que esté avanzando la tecnología hay un importante nicho de la sociedad que preﬁere la simplicidad: usuarios saturados de vivir constantemente conectados, disponer de demasiadas opciones y con sensación de no poder parar y disfrutar de las cosas cotidianas. • En búsqueda de la simplicidad añorada, muchas marcas miran al pasado para mejorar la experiencia de usuario. Lo retro, acompañado con el componente emotivo y nostálgico, vende. Y la experiencia del usuario se simpliﬁca al mirar atrás y construir a partir de territorios conocidos por los consumidores. • Lo retro es friendly: aporta facilidad, seguridad, privacidad; como opuesto a aceleración, interrupción, grito. 16 Tendencia 2, Simple vs Retro

17. Campaña Heinz Don Draper presentando la campaña que ha recuperado la agencia DAVID Miami 17

18. UXTrends2017-Zorraquino-Marzo2017 En síntesis • Retro: moda y búsqueda de la simplicidad (reacción frente a la complicación). • Volver al pasado para conectar mejor con el usuario. • Las marcas recuperan modelos antiguos adaptándolos a la vida actual. • Ejemplos: relojes Casio, neveras Smeg, Ikea Argang, Bultaco (motos eléctricas), cámaras Polaroid, Anís del Mono… • Lo retro despierta emociones positivas: empatizar con la gente a través valores de conﬁanza basados en los recuerdos del pasado. • EEUU: términos newstalgia y newtro para nombrar esta tendencia. • Conectar desde universos conocidos y más simples. • Dar importancia a lo que el cliente valora. 18 Tendencia 2, Simple vs Retro

19. Polaroid Snap Fusión entre retro, sencillo y útil, pensando en el usuario 19

20. Nokia 3310 “Back to the future”

21. UXTrends2017-Zorraquino-Marzo2017 Nokia 3310 • Presentación en el Mobile World Congress, Barcelona 2017. • El protagonismo para un teléfono de hace 17 años; el Nokia indestructible. • Interés hacia un móvil simple, barato, y con menos funciones: no controla pasos, calorías, interacción en redes, solo cuesta 50 €, la batería dura 22h. • Fácil de usar, simple, sin complicaciones; para llamar y mandar SMSs. • Ni Twitter, ni Facebook, ni WhatsApp, ni vídeos, vuelve a las esencias de la telefonía móvil. • Con el status que le otorga ser un clásico. • Modernizado en diseño y convertido en objeto de culto. 21 Tendencia 2, Simple vs Retro

22. Burger Records en California, la meca del "cassette" 22

23. UXTrends2017-Zorraquino-Marzo2017 Vuelve el casette • Las ventas de cassettes en EEUU en 2016 aumentaron un 74%: 129.000, frente a los 74.000 de 2015 (cifras todavía pequeñas pero en alza). • Frente a los vinilos –que apuestan además por calidad de sonido superior– los cassettes, además del reducido coste, se relacionan con el retour a las sensaciones: que sea tangible, los colores, la manipulación de la cinta… • “Nos gusta tocar cosas. Nos gusta sentir. Somos sensibles. Y que las cosas nos lleguen al corazón” (Burguer Records). • Justin Bieber, Kanye West, BSO Star Wars: lanzamientos exclusivos en cassettes. Sección en Urban Outﬁtters, tienda de referencia en EEUU. • No sólo para nostálgicos, nuevas generaciones fans de estas estrellas buscan exclusividad. 23 Tendencia 2, Simple vs Retro

24. Elbow Mini reproductor de cintas de cassette para fans de lo retro 24

25. UXTrends2017-Zorraquino-Marzo2017 Para pensar • Seguridad que otorga el componente vintage, que garantiza calidad y funcionalidad en una sociedad complicada y excesiva en oferta. • Componente también de originalidad: ser distinto, ir a contracorriente. • UX: mejora también ayudado por los componentes emocionales asociados a lo retro. • Lo retro como una forma directa de conseguir sencillez, calidad y exclusividad. • La apuesta por la conﬁanza en el pasado vs desconﬁanza futuro, que hace interacciones más fáciles. No necesariamente todo lo nuevo es mejor. 25 Tendencia 2, Simple vs Retro

26. UXTrends2017-Zorraquino-Marzo2017 Referencias Ejemplos retro  http://www.puromarketing.com/44/22379/vintage-gusta-tanto-consumidor.html  http://www.puromarketing.com/9/16590/vintage-despertarndo-emociones-traves- nostalgia.html  https://www.linkedin.com/pulse/do-old-brands-have-second-life-prabhakar-mundkur  http://www.eleconomista.es/empresas-ﬁnanzas/noticias/8224421/03/17/La-resurreccion-de- la-imprenta-ninos-y-jovenes-impulsan-las-ventas-de-libros-en-papel-.html Nokia 3310  http://www.thedrum.com/opinion/2017/02/24/nokias-3310-returns-has-the-mobile-phone- revolution-come-end  https://www.dusted.com/blog/nokia-3310-isnt-just-catering-hipsters/  https://www.retailgazette.co.uk/blog/2017/03/nokias-3310-and-the-nostalgia-revolution  https://www.capitalmadrid.com/2017/3/8/45446/la-involucion-vintage-se-pone-de- moda.html 26 Tendencia 2, Simple vs Retro

27. UXTrends2017-Zorraquino-Marzo2017 Referencias Cassete  http://burgerrecords.com/  https://www.xataka.com/musica/las-ventas-de-cassettes-en-2016-suben-un-74-en-estados- unidos-no-solo-de-vinilos-vive-la-moda-retro  https://www.forbes.com/sites/jasonevangelho/2016/03/24/forget-vinyl-lets-talk-about-the- cassette-comeback/#516173ce4d71 27 Tendencia 2, Simple vs Retro

28. Invisible UX que funciona sin ser visto 28 UXTrends2017-Zorraquino-Marzo2017 Tendencia 3

29. UXTrends2017-Zorraquino-Marzo2017 Invisible • El buen diseño es aquel que no se ve, y la buena experiencia de usuario es aquella que muestra lo esencial, ni más ni menos, ni antes ni después: en el momento preciso en que se necesita. • Diseños donde el usuario no queda aturdido por excesivos mensajes y opciones de navegación, donde cada elemento en la experiencia tiene un sentido, donde recibes ayuda sin notarlo y donde la experiencia resulta excelente; sin darte cuenta. • Muchos elementos ayudan a conseguir este efecto. Para las tendencias de este año hemos elegido tres: haptic design, age-responsive design y animación funcional, que se enfoca a animar no para “decorar” sino para dar sentido a la navegación y a la experiencia del usuario. 29 Tendencia 3, Invisible

30. Spotify Fusión entre retro, sencillo y útil, pensando en el usuario

31. Tanvas Tanvas 31

32. UXTrends2017-Zorraquino-Marzo2017 En síntesis • Haptic design: botones y teclas que proporcionan feedback sensorial a los usuarios. • Diseño adaptado a la edad: más allá del "responsive design", que se adapta a cada plataforma. Colores, tipos de letra, ilustraciones, textos, espacios, menús de navegación... adecuados a la edad de los usuarios. • Animaciones que acompañan al sentido del diseño, que dicen cosas, anticipan el siguiente paso y ayudan a disminuir la "interstitial anxiety": ese momento de silencio que pasa desde que el usuario ejecuta una acción hasta que recibe una respuesta. Tendencia 3, Invisible 32

33. UXTrends2017-Zorraquino-Marzo2017 Animaciones funcionales • El movimiento guía y se centra en lo que es importante, no permite que te sientas perdido. • Su aplicación puede ser divertida y juguetona o seria y sencilla, utilizar los principios del movimiento puede ayudarle a ofrecer una experiencia coherente, clara y rápida. • Una animación funcional es sutil, con un propósito claro y lógico. • Es asociativa, natural, intencional y rápida. • Las animaciones también cuentan cosas. • Facilita la experiencia: las transiciones nos ayudan a comprender el entorno y a hacer predecible el modelo de interacción. 33 Tendencia 3, Invisible

34. Demo del rediseño de Snapchat Fusión entre retro, sencillo y útil, pensando en el usuario

35. UXTrends2017-Zorraquino-Marzo2017 Snapchat • Una barra de búsqueda que cambia la experiencia de usuario. • Orientada a encontrar fácilmente a los contactos. • Respuesta a una clara petición de sus usuarios, a los que les resultaba complicado encontrar gente conocida. • Buscador siempre presente. Tendencia a hacerlo más grande. • Amazon en el punto de mira, como referente en cuanto a priorizar el buscador al menú. • Espacios más generosos. Más amplios y con un mejor gusto en el uso de colores e imágenes. Interfaz más sencilla, rápida y útil. Mejora la navegación. • Claro ejemplo de "diseño invisible", pensado y creado para el móvil. 35 Tendencia 3, Invisible

36. UXTrends2017-Zorraquino-Marzo2017 Para pensar • Las numerosas opciones que tienen los diseñadores para ilustrar y enriquecer aplicaciones y webs pueden poner en peligro la utilidad. • Poner atención a todos y cada uno de los detalles es la clave del éxito al diseñar pensando en la experiencia de usuario. • El criterio de la invisibilidad ayuda a diferenciar qué sirve y que no. • Optar únicamente por aquello que ayude a comunicar de manera efectiva con los usuarios. • Que añada facilidad de uso. • Y que no se vea. 36 Tendencia 3, Invisible

37. UXTrends2017-Zorraquino-Marzo2017 Referencias Tendencias 2017  https://www.multiplica.com/wp-content/uploads/2017/02/multiplica.tendenciasux2017.pdf Barra búsqueda Snapchat  https://techcrunch.com/2017/01/23/snapchats-big-redesign-featuring-universal-search-and- more-just-hit-ios/ Animación funcional  http://forolr.com/temas/animacion-funcional-en-el-diseno-ux-que-hace-una-buena-transicion. 22/  https://medium.com/@juancaferraris/animaciones-en-el-dise%C3%B1o-de-ux-mobile- a4d7600d5930#.2tf23u8xk  https://www.beeva.com/beeva-view/diseno-y-ux/mueve-ui-las-animaciones-tambien-cuentan- cosas/  https://material.io/guidelines/motion/transforming-material.html#transforming-material- rectangular-transformation 37 Tendencia 3, Invisible

38. Apuesta por lo virtual Tan real como la vida misma UXTrends2017-Zorraquino-Marzo2017 Tendencia 4 38

39. UXTrends2017-Zorraquino-Marzo2017 Apuesta por virtual • Con la presentación del Oculus Rift, el PlayStation VR y el DayDream, entre otros, la Virtual Reality (VR) está consolidando posiciones, para ofrecer a usuarios y marcas la posibilidad de trasladarse a entornos quasi-reales que ampliﬁquen la experiencia. • Tecnológicas, productoras, diseñadores y medios, amparados por marcas como Google, Snapchat, Facebook, Sony o Samsung, están convirtiendo la realidad virtual en una opción asequible a todos los públicos. • Una tecnología con altas perspectivas de crecimiento, por la que apuestan marcas y plataformas, que ofrece inﬁnitas posibilidades y, también, que plantea el reto de su integración amable, y útil, en la comunicación y la relación con los clientes. 39 Tendencia 4, Apuesta por virtual

40. UXTrends2017-Zorraquino-Marzo2017 En síntesis • Se prevé que la industria de la realidad aumentada, virtual y mixta mueva alrededor de 160.000 millones de € en 2020. • Ofrecen experiencias, cada vez, más inmersivas, para todos los sentidos. • Permiten ir de compras, colocar muebles virtuales en su casa, hacer entrevistas de trabajo, probar coches sin salir de casa, visitar hoteles o atracciones turísticas, asistir a una clase, viajar al pasado... facilita la conexión con los consumidores y puede ayudar en la decisión de compra. • Una experiencia –de la VR, AR o MR– que no se limita al entretenimiento y que se democratiza con los visores y cámaras de nueva generación y bajo precio. • Obliga a repensar la UX para adaptarla a un nuevo entorno virtual: gestos, clicks, navegación, entorno... todo es posible y todo cambia en este universo. 40 Tendencia 4, Apuesta por virtual

41. Buy+ The First Complete VR Shopping Experience Fusión entre retro, sencillo y útil, pensando en el usuario 41

42. UXTrends2017-Zorraquino-Marzo2017 Alibaba • Lanza Buy+. • Una plataforma de realidad virtual que permite comprar desde China como si estuvieses en Manhattan. • Paseas por los grandes almacenes como si estuvieses realmente allí. • Integrado en Alipay; seleccionas con el cursor y compras con un sencillo movimiento de cabeza. • De momento, sólo en fase piloto. 42 Tendencia 4, Apuesta por virtual

43. Una web de recursos para repensar la UX Fusión entre retro, sencillo y útil, pensando en el usuario

44. Can you make it to the end? Campaña en VR para la National Autistic Society 44

45. Old Irish Vender cerveza irlandesa en Georgia, con realidad virtual 45

46. Proyecto Esper de la VR a la AR 46

47. UXTrends2017-Zorraquino-Marzo2017 Proyecto Esper • De la VR a la AR. • Para estudiantes de medicina, Proyecto Esper tienen una visión más amplia de la anatomía humana. • Experiencia de estudio de anatomía real. • Interacción con las manos. • Se proyecta a través de las HoloLens de Microsoft y es como un proyector láser. 47 Tendencia 4, Apuesta por virtual

48. UXTrends2017-Zorraquino-Marzo2017 Retos y oportunidades • Creación de experiencias interactivas y reactivas, con mundos que cambian con cada movimiento del cuerpo y de los ojos. • Recrear experiencias amables que superen el “virtual reality sickness”. • Hacer fácil el uso de los controladores y el movimiento del usuario dentro del mundo virtual. Entender el modo de hacer click en la realidad virtual. Integrar los modos de feedback físico. • Aprender a jugar con el tamaño de la imagen y el texto. • Sacar todo su partido a los sonidos y la música, que también participan directamente de la experiencia de realidad virtual. • Crear experiencias que, realmente, superen y mejoren la realidad. 48 Tendencia 4, Apuesta por virtual

49. UXTrends2017-Zorraquino-Marzo2017 Para pensar • La VR ofrece muchas posibilidades, pero todavía muchos retos: su alto precio, la complejidad de la producción de universos virtuales, la diﬁcultad de diseñar esos ecosistemas, el efecto aislamiento... cada vez más fáciles de superar pero que complican su rápido desarrollo. • Además, lleva consigo el reto de ofrecer contenido signiﬁcativo para dar valor a la experiencia, en todos los campos: deporte, conciertos, aprendizaje... • Los rápidos desarrollos tecnológicos y, sobre todo, el empuje de empresas como Google, Facebook y Snapchat, puede hacer que su implantación sea más rápida de lo esperado. 49 Tendencia 4, Apuesta por virtual

50. UXTrends2017-Zorraquino-Marzo2017 Referencias Tendencias 2017: VR, AR, MR  http://www.mondo.com/mainstream-vr-adoption-google-chrome/  http://edition.cnn.com/videos/world/2016/11/28/alibaba-vr-shopping-stevens-pkg.cnn  http://www.lavanguardia.com/tecnologia/20170206/414053748119/internet-en-las-cosas- realidad-mixta-realidad-virtual-comercio-iphone-8.html  http://www.dailymail.co.uk/sciencetech/article-4185138/Developer-combines-HTC-Vive- HoloLens-mixed-reality.html  https://www.solomarketing.es/las-tendencias-clave-en-experiencia-de-usuario-ux-para-2017/  http://www.gartner.com/smarterwithgartner/gartner-predicts-a-virtual-world-of-exponential- change/ A UX guide to designing virtual reality experiences  http://www.dtelepathy.com/blog/philosophy/ux-guide-designing-virtual-reality-experiences 50 Tendencia 4, Apuesta por virtual

51. UXTrends2017-Zorraquino-Marzo2017 Referencias Virtual Reality Leads Marketers Down a Tricky Path  https://www.nytimes.com/2017/03/05/business/media/virtual-reality-leads-marketers-down- a-tricky-path.html Top 10 Most Creative VR Experiences  http://www.shots.net/news/article/91434/shots%27-top-10-most-creative-vr-experiences 51 Tendencia 4, Apuesta por virtual

52. Mejor anticiparse Dar sin que pidan 52 UXTrends2017-Zorraquino-Marzo2017 Tendencia 5

53. UXTrends2017-Zorraquino-Marzo2017 Mejor anticiparse • Uno de los principales atributos del buen servicio es la anticipación: ofrecer respuestas a necesidades todavía no formuladas, interpretar qué necesita el consumidor y dárselo sin que te lo pida; algo que bien se podría extender al diseño de la experiencia de usuario, que mejora cuando sorprendes al cliente con respuestas o servicios que buscaba pero todavía no había pedido o, más aún, que ni siquiera era consciente que necesitaba. • Este es precisamente el sentido del "anticipatory design", que mejora el proceso, simpliﬁca la relación y enriquece la experiencia. Un diseño que ahorra tiempo y supone, sobre todo, entender bien cómo funciona y qué quiere nuestro interlocutor. Mejorado también con el análisis y la recogida de datos de compra. 53 Tendencia 5, Mejor anticiparse

54. UXTrends2017-Zorraquino-Marzo2017 En síntesis • Diseño anticipativo para facilitar las cosas al consumidor. • Un diseño que trata de ir siempre un paso por delante: ofrecer acciones, respuestas, servicios... antes de que los pidas. • Construido sobre el conocimiento previo. • Un conocimiento del consumidor basado en: análisis de datos, compras previas, conocimiento del mercado, análisis del proceso de compra. • Orientado al feedback y a la mejora continua: no hay conocimiento sin monitorización y respuesta por parte del usuario. • Tan importante el diseño como los datos. 54 Tendencia 5, Mejor anticiparse

55. Aaron Saphiro, HUGE “Anticipatory design is fundamentally diﬀerent: decisions are made and executed on behalf of the user. The goal is not to help the user make a decision, but to create an ecosystem where a decision is never made—it happens automatically and without user input. The design goal becomes one where we eliminate as many steps as possible and ﬁnd ways to use data, prior behaviors and business logic to have things happen automatically, or as close to automatic as we can get” 55 UXTrends2017-Zorraquino-Marzo2017 Tendencia 5, Mejor anticiparse

56. Order Genius de Peapod

57. UXTrends2017-Zorraquino-Marzo2017 Peapod • El supermercado online de verduras ("grocery store") más grande de Estados Unidos. Con oﬁcina central en Illinois, opera en 23 ciudades. • Su nueva app está diseñada para poder llenar el carro en un par de clicks, con pre- decisiones tomadas a partir de información de compras anteriores. • Un servicio que han denominado "Order Genius". • Trata de anticiparse a lo que el cliente necesita, para facilitarle la navegación, ahorrarle tiempo y mejorar la experiencia. • Diseño para aprender continuamente acerca del comportamiento del consumidor, que recoge información cada vez que usa la app. • Diferencia las compras de los clientes según, incluso, la temporada y el ciclo de los productos. 57 Tendencia 5, Mejor anticiparse

58. Uber Se conecta a tus citas

59. UXTrends2017-Zorraquino-Marzo2017 Uber • Uber va un paso más allá. • Personalización como medio para simpliﬁcar la experiencia del usuario. • La última actualización permite compartir tu calendario y contactos para localizar a tus amigos o a esa persona con la que debes reunirte, enviando una notiﬁcación que, al ser aceptada, marca el destino exacto en el que se encuentran. • También te permite controlar la música durante el viaje a través de Pandora y conecta con las guías locales para acceder a reviews de bares y restaurantes en la zona a la que te diriges. • Se anticipa ofreciendo servicios que podrías necesitar, de manera amable y clara desde el punto de vista del diseño, sin confundir ni abrumar. 59 Tendencia 5, Mejor anticiparse

60. Netﬂix Una importante referencia en diseño anticipativo

61.   "A very realistic vision is we should get to the point where you just turn on your Netflix app and automatically a video starts to play that you’re very happy with". "If you’re not, you may have to flip once or twice and end up with something that you’re very, very happy with. Only in, say, 10-to-20 percent of sessions [will you] escape into ... browse mode.”   Carlos Gomez-Uribe, Netflix's Vice President of Innovation 61 UXTrends2017-Zorraquino-Marzo2017 Tendencia 5, Mejor anticiparse

62. UXTrends2017-Zorraquino-Marzo2017 Para pensar • El diseño pasa de simplemente presentar una selección, o facilitar la navegación, a sustituir al consumidor a la hora de tomar decisiones. • Una nueva forma de entender el diseño que exige no solo competencia gráﬁca sino comprensión de los procesos de compra y de la toma de decisiones y, también, capacidad para procesar y analizar datos. • Requiere, además, un cierto "acostumbramiento" por parte del usuario, que cede protagonismo y poder. • Supone superar la barrera de la desconﬁanza; las marcas, en este entorno, se verán necesitadas de forjar una relación más estrecha con sus consumidores, o pactar condiciones precisas de uso. 62 Tendencia 5, Mejor anticiparse

63. UXTrends2017-Zorraquino-Marzo2017 Referencias Anticiparse, automatizar las acciones, aconsejar y descubrir.  Tendencias 2017.  https://www.multiplica.com/wp-content/uploads/2017/02/multiplica.tendenciasux2017.pdf  http://www.mondo.com/ux-design-trends-2016-2017/  https://www.solomarketing.es/las-tendencias-clave-en-experiencia-de-usuario-ux-para-2017/  https://blogs.oracle.com/VOX/entry/smart_user_experiences_machine_learning?SC=ccentral- machine-learning-ashley-forbes Interstitial anxiety  https://www.quora.com/What-are-some-examples-of-UX-Ui-animation-that-reduce-interstitial- anxiety 63 Tendencia 5, Mejor anticiparse

64. Resurgir del texto Leer y escribir la nueva interface 64 UXTrends2017-Zorraquino-Marzo2017 Tendencia 6

65. UXTrends2017-Zorraquino-Marzo2017 Textos fáciles y rápidos • Gracias a la mensajería instantánea, y a apps como Messenger, Whatsapp o WeChat, el texto está experimentando un nuevo resurgir y se está convirtiendo en la nueva interface. • Un fenómeno potenciado con la llegada de los chatbots y que implica, desde el punto de vista de la UX, aprender diseñar las relaciones como conversaciones textuales y elaborar textos fáciles, rápidos, simples, inequívocos, predecibles, que faciliten a los usuarios relacionarse con las marcas a través de las plataformas que más frecuentemente usan: los servicios de mensajería. • Una tendencia que ha sido acogida por la mayor parte de las marcas y que tiene indicios de seguir creciendo. 65 Tendencia 6, Resurgir del texto

66. UXTrends2017-Zorraquino-Marzo2017 En síntesis - Chatbots • A través de la web, apps, Kik, Facebook Messenger u otros. • Automatiza el proceso de atención, asociado con el ciclo de vida del usuario; incluso, permite realizar pagos a través del chatbot. • Se pueden crear fácilmente desde FB: Chatfuel. • Más de 30.000 chatbots en Facebook Messenger, aunque hay dudas sobre su efectividad: sólo resuelven el 30% de las preguntas (según Facebook). • Diálogo cercano, disponible 24/7. Trato personalizado. Simple, rápido y sencillo. Casi humano. Hace pensar que hablan con una persona real. • No solo para atención al cliente: también idiomas (Duolingo), eventos (Thington), consultas médicas (Babylon), ﬁnanzas (Matilda), multas (DoNotPay), noticias (CNN), entretenimiento (Hello Barbie), etc. 66 Tendencia 6, Resurgir del texto

67.   "Welcome to the era of the conversational interface. It’s not the next app killer, but CI looks to be the primary interface that much of the world will interact with in the foreseeable future. (...) CI is an interface design focused around “chatting” with either real humans or bots”   Paul Campillo, Typeform 67 UXTrends2017-Zorraquino-Marzo2017 Tendencia 6, Resurgir del texto

68. Duolingo Aprende idiomas conversando, experiencia similar a tener un profesor

69. Domino’s Just in time for Super Bowl Sunday, Domino’s bot now oﬀers full-menu ordering

70. Thington La app para organizar eventos con texto

71. Zootopia Judy 71

72. Zootopia Judy 72

73. UXTrends2017-Zorraquino-Marzo2017 Bot Judy Zootopia • Disney hizo un gran uso del bot dando vida a uno de los personajes de dibujos animados. • Antes del estreno de la película "Zootopia", crearon un “Judy Hopps bot” en Facebook Messenger, que fue utilizado para impulsar la anticipación de la película y crear una experiencia divertida para los clientes. • La interacción consistía en ir resolviendo casos con Judy. • En promedio, los usuarios pasaron más de 10 minutos hablando con el personaje de la película. Muchos repitieron. • "After witnessing how passionate fans were about the Judy Hopps experience, our conclusion is that an interactive, one-on-one touchpoint with each customer will become the most eﬀective and most eﬀective medium for engaging”. Tendencia 6, Resurgir del texto 73

74. Typeform Free & Beautifully Human Online Forms 74

75. Typeform Se adaptan a las necesidades de cada ser humano, no usuarios

76. UXTrends2017-Zorraquino-Marzo2017 Typeform • Esta empresa se dedica a hacer formularios: de satisfacción, sugerencias, incidentes, contacto, información, registros, pagos… • Apuestan por un acercamiento de humano a humano a través de un diseño y preguntas visualmente atractivas y cercanas. • Conversacionales. • Personalizados según cada marca. • Métricas de comportamiento útiles para anticiparse en futuras relaciones con el usuario. • En el blog interactúan con el usuario aportando información adicional a la lectura. 76 Tendencia 6, Resurgir del texto

77. Typeform Se adaptan a las necesidades de cada sDurante la lectura del blog te acompañan y ofrecen información adicional a la lectura 77

78. Typeform Se adaptan a las necesidades de cada sDurante la lectura del blog te acompañan y ofrecen información adicional a la lectura 78

79. UXTrends2017-Zorraquino-Marzo2017 Para pensar • El auge de la mensajería y el chatbot requiere cultivar de nuevo la habilidad de la escritura sintética. • El próximo reto, escritura anticipativa y chatbots basados en inteligencia artificial. • Otro desafío pendiente: integrar las emociones en la conversación y hacer los mensajes de texto todavía más humanos. • Las últimas noticias publicadas por Facebook, ponen en entredicho la eficacia de los bots: sólo resuelven el 30% de las preguntas. • La mensajería atendida por humanos, en cambio, sigue subiendo. • Para respetar la privacidad y preservar la confianza, que es clave. Será necesaria una política de opt-in donde los usuarios pueden elegir qué comparten. 79 Tendencia 6, Resurgir del texto

80. UXTrends2017-Zorraquino-Marzo2017 Referencias Chatbots Trends 2017  https://www.multiplica.com/wp-content/uploads/2017/02/multiplica.tendenciasux2017.pdf  https://www.accenture.com/es-es/insight-tendencias-fjord-2017?src=SOMS  http://venturebeat.com/2017/03/01/why-business-chatbots-must-understand-customer- intent/  http://www.techworld.com/picture-gallery/personal-tech/9-best-uses-of-chatbots-in-business- in-uk-3641500/  https://www.forbes.com/sites/sujanpatel/2017/01/21/6-eﬀective-uses-for-chatbots-in- marketing/#4f2131673f48  https://www.solomarketing.es/las-tendencias-clave-en-experiencia-de-usuario-ux-para-2017/ Typeform  https://www.typeform.com/about/ 80 Tendencia 6, Resurgir del texto

81. UXTrends2017-Zorraquino-Marzo2017 Referencias Aprender idiomas con un bot  https://www.theguardian.com/technology/2016/oct/06/duolingo-chatbots-learning-language  http://bots.duolingo.com/ Domino’s  http://www.digitaltrends.com/social-media/dominos-facebook-chatbot/ Ayuda a ahorrar en casa, pone dispositivos en reposo,  ayuda a organizar eventos.   https://thington.com/ Help Judy save the case  http://www.topbots.com/project/disney-zootopia/ 81 Tendencia 6, Resurgir del texto

82. Hablar con imágenes Mostrar en vez de decir 82 UXTrends2017-Zorraquino-Marzo2017 Tendencia 7

83. UXTrends2017-Zorraquino-Marzo2017 Hablar con imágenes • Como dice el refrán, una imagen vale más que mil palabras. Las imágenes pueden ser una manera poderosa de captar la atención de los usuarios y diferenciar un producto. Son más que decoración y tienen un efecto positivo –que se puede volver negativo, si confunden– en la experiencia de usuario. • Pero la prioridad de la imagen como forma de comunicación se extiende también a la experiencia diaria del ciudadano común. Cada vez es más frecuente responder a una pregunta por WhatsApp –un "¿Qué tal?", "¿qué haces?" o "¿dónde estás?"– enviando una foto. Compartimos constantemente imágenes para contar lo que hacemos, decir donde estamos, qué comemos o, incluso, para informar de incidencias o pedir un repuesto para la oﬁcina. 83 Tendencia 7, Hablar con imágenes

84.   "This is a watershed time where we are moving away from photography as a way of recording and storing a past moment" (...). "We are turning photography into a communication medium”   Robin Kelsey, a professor of photography at Harvard 84 UXTrends2017-Zorraquino-Marzo2017 Tendencia 7, Hablar con imágenes

85. UXTrends2017-Zorraquino-Marzo2017 En síntesis • Las imágenes, cada vez más usadas para contar, tanto por los usuarios como por las marcas. • Se explota la facilidad de compartir imágenes para mejorar la comunicación y la experiencia: decir más con poco, y de modo más claro. • Vinculado tanto a la comunicación informal, como a la atención al cliente, la petición de productos, la autentiﬁcación... • Bienvenida siempre que facilite la comunicación. • Alto poder evocador; componente emocional. • También, función estética y amable, que no solo ayuda a comunicar sino a hacer la comunicación más amable. 85 Tendencia 7, Hablar con imágenes

86. Ever Compartir cada momento con tus amigos

87. UXTrends2017-Zorraquino-Marzo2017 Oportunidades • Comunicarse a través de imágenes facilita la experiencia de usuario cuando no sabes explicar algo exactamente: “necesito una pieza concreta que se me ha roto y no sé su nombre técnico”. Las descripciones se sustituyen por las fotos. No hacen falta palabras. • Pueden transmitir información especíﬁca que hace que la comprensión sea fácil e inmediata. • Las fotos de puestas de sol, reuniones con amigos, las vacaciones de la familia… se están convirtiendo en un tipo totalmente nuevo de diálogo. • Ya no son simplemente recuerdos, son un medio de comunicación. • Efecto similar con los emoticonos, capaces de condensar gran cantidad de información, con un sólo click. 87 Tendencia 7, Hablar con imágenes

88. Todos somos fotógrafos profesionales Compartir cada momento con tus amigos

89. Instagram Nos relacionamos a través de imágenes

90. UXTrends2017-Zorraquino-Marzo2017 Smartphongrafía • Todas las RRSS quieren convertirse en el álbum de fotos de los usuarios. • Muchos de los usuarios de Instagram no solo buscan compartir, lo hacen desde un punto de vista creativo. • Gracias a los smartphones y los ﬁltros todos somos fotógrafos profesionales. (Anuncios marquesinas de iPhone 7). • Lentes que se acoplan al móvil para mejorar calidad. • Las imágenes enviadas a móviles están aumentando a medida que los mensajes de texto siguen cayendo. • Emoticonos expresando emociones, hacen más agradable y divertido el mensaje. 90 Tendencia 7, Hablar con imágenes

91. Fooji Pedimos pizza a través de imágenes

92. Abrimos cuentas a través de imágenes Y nos identiﬁcamos posteriormente

93. Cover Haz una foto y te digo cuánto te costará el seguro

94. UXTrends2017-Zorraquino-Marzo2017 Para pensar • El predominio de la imagen anima a reﬂexionar sobre cómo se puede simpliﬁcar la conversación con los usuarios a base de emplear más imágenes y de modo más oportuno. • Imágenes que hagan la comunicación real y que traigan al mundo on-line formas y maneras de la comunicación interpersonal, centrada en mostrar más que hablar. • La UX mejora con las imágenes; se convierte en rápida, cercana, atractiva… • No hay barreras lingüísticas. El mundo se hace más pequeño gracias a la tecnología, todo el mundo pueden chatear con imágenes, la lengua universal. • Se hará también necesario velar por la calidad en un momento en que, debido a la alta proliferación de imágenes, la cantidad puede llegar a lesionarla. 94 Tendencia 7, Hablar con imágenes

95. UXTrends2017-Zorraquino-Marzo2017 Referencias Un nuevo lenguaje  https://bits.blogs.nytimes.com/2013/06/30/disruptions-social-media-images-form-a-new- language-online/ Cómo la imagen mejora la UX  https://uxplanet.org/how-to-use-images-to-improve-ux-for-mobile-apps-1fe3ﬀ83bc8b#. 6zop23b6n Compartir momentos  http://venturebeat.com/2017/03/02/ever-launches-image-recognition-tool-to-make-photo- sharing-with-friends-easier/ 95 Tendencia 7, Hablar con imágenes

96. Piensa en mini Lo mismo, en menos pasos 96 UXTrends2017-Zorraquino-Marzo2017 Tendencia 8

97. UXTrends2017-Zorraquino-Marzo2017 Piensa en mini • Los usuarios, a veces inconscientemente, tratan de huir de la complejidad y andan en busca de un proceso de consumo más simple. Quieren lo que no se puede comprar: el tiempo. • El consumidor rechaza la confusión, la saturación, la multivariedad, la complejidad, la artificiosidad... no necesita ser cautivado con grandes gestos, quizá tampoco busca infinitas alternativas. Quiere menos. • Menos botones, menos clicks, menos pantallas, menos tiempo de espera, menos fotos, menos items, menos menús... • Quizá la filosofía de la abundancia ha derivado en el mundo de la UX hacia una experiencia más cualitativa que cuantitativa, que busca menos y mejores opciones, en menos pasos. 97 Tendencia 8, Piensa en mini

98. UXTrends2017-Zorraquino-Marzo2017 En síntesis • El 64% de los consumidores pagan más por experiencias más sencillas, rápidas y fáciles. Se hacen premium para simpliﬁcar procesos. • La simplicidad genera lealtad: el 61% de los consumidores tiende a recomendar una marca porque es simple. • No hace falta estrategias complicadas para destacar. La simplicidad es un valor diferencial verdaderamente sustancioso. • Tres reglas para una experiencia de marca simple: 1. Dar a los consumidores lo que quieren. 2. Estar disponible cuándo y dónde lo deseen. 3. Entrega en tres o menos pasos. 98 Tendencia 8, Piensa en mini

99. Starbucks

100. ¿Quieres un latte? Starbucks tiene lattes.   ¿Lo quieres en 15 minutos? Starbucks tiene una aplicación para que puedas pedirla con antelación y tenerlo cuando pases por allí.  ¿Lo quieres en dos pasos? Paga desde la App. 100 UXTrends2017-Zorraquino-Marzo2017 Tendencia 8, Piensa en mini

101. UXTrends2017-Zorraquino-Marzo2017 Starbucks • App pedido personalizado, pago desde la app con google maps integrado para calcular cuánto tardas y que esté listo tu café. • Si tienes un pedido guardado, en tres pasos lo tienes. • Eliminación de colas, es decir, de ansiedad del usuario. • Como extensión de la App Mobile Order and Pay este año han lanzado en USA: My Starbucks Barista que integra Alexa. • Se puede realizar el pedido por voz, lo que incluye simplicidad y, de paso, más fácil la personalización y la repetición de la compra. 101 Tendencia 8, Piensa en mini

102. Starbucks Barista con Alexa (Amazon) incluida 102

103. Ikea Elimina los tornillos: nuevo sistema wedge dowel 103

104. UXTrends2017-Zorraquino-Marzo2017 Ikea • Muebles baratos, funcionales y de diseño escandinavo. • Problema: montaje. • Solución: wedge dowel, ya no hay tornillos, tuercas ni llaves allen. Piezas de madera con unos acabados en forma de dientes, similares a los sistemas tuerca-tornillo. Un clic nos indica que la pieza está en su sitio. • Simpliﬁca el proceso, entre un 50% y un 80%, es decir, montar una mesa en 3 minutos en lugar de los 24 actuales. • El medio ambiente también se verá beneﬁciado, ya que se prescinde de la fabricación de millones de piezas metálicas y llaves. • Mejora la durabilidad de los muebles, la madera sufre menos y es posible montarlos y desmontarlos tantas veces como se quiera. 104 Tendencia 8, Piensa en mini

105. Nest El termostato que decide por ti 105

106. Digit El modo simple de gestionar y ahorra dinero, sin preocuparte de pensar

107. Futteral Haus Una casa a golpe de click; "revolutionizing simple, smart living" 107

108. UXTrends2017-Zorraquino-Marzo2017 Para pensar • Una de las tendencias más fuertes, la simplicidad es prioritaria al pensar en la interacción del usuario con una marca. • Al mismo tiempo es una tendencia universal, en el espacio y en el tiempo, de la que seguimos hablando por la dificultad que de materializarla. Simplificar y reducir es difícil. Hoy más importante que nunca. • La complejidad de opciones, alternativas, información otorga un papel especial a la labor simplificadora del diseño. El usuario necesita que el diseño le ayude a acertar y a ahorrar tiempo. 108 Tendencia 8, Piensa en mini

109. UXTrends2017-Zorraquino-Marzo2017 Referencias Tendencia Mini, UX trends 2017  https://www.multiplica.com/wp-content/uploads/2017/02/multiplica.tendenciasux2017.pdf Aldi, líder en simplicidad  https://www.linkedin.com/pulse/simplicity-solution-4-ways-retailers-earn-more-keeping-bryan- pearson Simplicity Index Results  https://www.forbes.com/sites/kimberlywhitler/2017/01/25/new-global-brand-simplicity-index- results-brands-that-create-simpler-experiences-win/#406c3eb252a3 Ikea y Starbucks  http://www.tmagazine.es/diseno-e-interior/no-mas-tornillos-ikea-rerevoluciona-el-mueble/  http://www.merca20.com/starbucks-lanza-bot-ios-permite-hacer-pedidos/ 109 Tendencia 8, Piensa en mini

110. Hazlo tú mismo El usuario construye la experiencia 110 UXTrends2017-Zorraquino-Marzo2017 Tendencia 9

111. UXTrends2017-Zorraquino-Marzo2017 Hazlo tú mismo • “Do it yourself” sigue siendo una tendencia cada vez más expandida a diferentes ámbitos. • Enlazado con el movimiento maker y con el resurgir de la artesanía, las marcas tratan, cada vez más, de diseñar experiencias de usuario que otorguen protagonismo al consumidor, le permitan moverse de manera autosuﬁciente y tomar la iniciativa, con diseños que hacen fácil la navegación pero que le dejan hacer y moverse a su modo. • Los usuarios buscan tanto instrucciones como demos, guías o ayudas; nos encontramos ante una nueva generación de consumidores inteligentes y autodidactas que necesitan experiencias que estén a su nivel. 111 Tendencia 9, Hazlo tú mismo

112. UXTrends2017-Zorraquino-Marzo2017 En síntesis • Las nuevas generaciones también son makers. • El aumento de los dispositivos móviles ha afectado signiﬁcativamente la capacidad de los niños para interactuar con la tecnología y, como consecuencia, su interés en producir esta misma tecnología. • “A lot of kids this days like to play games, but now they want to make them”, Thomas Suarez, desarrollador de 12 años. • En las aulas se implementan programas de diseño de UX y APPs. Son programas de educación galardonados: Apps for Good. • Artesanía, decoración, estudios universitarios, tecnología… el fenómeno autodidacta se extiende también a la UX con la "de-linearity": la “contra-simpliﬁcación”. 112 Tendencia 9, Hazlo tú mismo

113. Thomas Suarez 12 years old, app developer

114. La Colmena Crea comunidades en el barrio para comprar comida ecológica y local

115. UXTrends2017-Zorraquino-Marzo2017 La colmena • Ejemplo de comunidad ecológica: la experiencia mejora con la compra de cercanía, cuando compras fruta y verdura a agricultores de la zona. • Usuarios que hacen ellos mismos los productos: muebles, la decoración, agricultura… la experiencia es muy satisfactoria y añade que es mucho más barato. • Usuarios que consumen productos artesanos hechos por otros: productos exclusivos, que suman también la satisfacción emocional positiva de colaborar con los artesanos. • Pequeñización e internacionalización: lo pequeño se internacionaliza gracias al e- commerce y a las redes sociales, que han multiplicado la actividad comercial de los pequeños artesanos. 115 Tendencia 9, Hazlo tú mismo

116. Coursera Elige cursos de las mejores universidades desde tu casa 116

117. UXTrends2017-Zorraquino-Marzo2017 Coursera • Una universidad a tu medida: a distancia, que permite organizar tu tiempo (asistes a clase cuando te viene bien), atención continua para resolución de dudas, comunidad en redes sociales, etc. • Mucho más internacional que la universidad presencial. • Elevado número de alumnos y variedad de oferta docente; y en muchos casos, gratis. Cursos a tu medida. • La forma de aprender o asimilar un nuevo conocimiento se hace a través de vídeos tutoriales; incluso estudian por ese medio. • Muchas plataformas; aparte de Coursera, edX, Udacity, FutureLearn, etc. • Se estima que 50% de las clases en universidades serán vía e-learning en 2019. 117 Tendencia 9, Hazlo tú mismo

118. Lego Más “do it yourself” que nunca 118

119. UXTrends2017-Zorraquino-Marzo2017 Lego • El juego “DIY” por excelencia. • En la tienda de Londres podrás conseguir las piezas necesarias para construir tu retrato con Lego. • Por 125 Libras puedes sacar tu retrato en una cabina fotográﬁca instantánea y adquirir las piezas necesarias (en 5 colores), para construirlo con Lego. • Una nueva apuesta para los superfans de la marca. • Experiencia de usuario altamente satisfactoria: están contigo porque les haces hacer a ellos. 119 Tendencia 9, Hazlo tú mismo

120.   "De-linearity is the concept of giving users a number of ways to accomplish a task rather than requiring them to perform a single precise set of actions to accomplish that same task”   Q Manning, CEO of Rocksauce Studios 120 UXTrends2017-Zorraquino-Marzo2017 Tendencia 9, Hazlo tú mismo

121.   "Increasingly, users of mobile and web applications want the freedom to navigate an interface on their own terms, free of the restraints that linear design imposes”   Q Manning, CEO of Rocksauce Studios 121 UXTrends2017-Zorraquino-Marzo2017 Tendencia 9, Hazlo tú mismo

122. Twitter en iOS Dos formas de volver hacia atrás

123. UXTrends2017-Zorraquino-Marzo2017 De-linearity • Linearity: simplicidad, claridad, cero ambigüedad: un único camino, el mejor camino, el más rápido y eﬁciente. • De-linearity: Varios modos de llegar a lo mismo: no existe un único camino. • Desafío al diseño tradicional: simplicidad, caminos claros, etc. • Mejora experiencia de usuario (del usuario de hoy en día): "including a number of paths from one touchpoint to the next is extremely useful”. • En algunos casos, se ha convertido en una demanda clara: que el usuario ya usa y disfruta, aunque no se le llame así. • Plantea nuevos retos para los diseñadores. Entre otras cosas, puede añadir confusión y despiste. Más fácil para la web que para el móvil. 123 Tendencia 9, Hazlo tú mismo

124. UXTrends2017-Zorraquino-Marzo2017 Para pensar • El usuario actual, marcadamente autodidacta, necesita ayuda pero no quiere que se lo den todo hecho. • Disfruta con la experiencia del Do It Yourself (DIY); y preﬁere buscar su propio camino a seguir siempre el mismo. • El "de-linear design" busca también ampliar las posibilidades del diseño intuitivo, asumiendo que hay varias formas intuitivas de llegar a las cosas. • Supone un cambio de esquema y un cierto "cuestionar" la simplicidad y univocidad características del diseño. • Aplicarlo supondrá, aparte de entenderlo bien, hacerlo compatible con las necesidades de información y navegación del propio usuario. Peligro de aumentar la confusión. 124 Tendencia 9, Hazlo tú mismo

125. UXTrends2017-Zorraquino-Marzo2017 Referencias La colmena, compra alimentos de calidad a productores y elaboradores locales  https://lacolmenaquedicesi.es/es/assemblies/7724 Los nativos digitales son makers  http://www.uxforchangeuk.org/how-to-inspire-digital-natives-to-become-makers-and-not-just- consumers-of-mobile-technologies/ When Design Worlds Collide: De-Linearity in UX Design  http://designrﬁx.com/design/design-worlds-collide-delinearity-ux-design Lego más “do it yourself” que nunca  http://www.adweek.com/creativity/this-lego-booth-scans-your-face-and-makes-a-custom-kit- so-you-can-build-yourself-out-of-legos/ 125 Tendencia 9, Hazlo tú mismo

126. Itinerarios Diseñar caminos que se andan solos 126 UXTrends2017-Zorraquino-Marzo2017 Tendencia 10

127. UXTrends2017-Zorraquino-Marzo2017 Itinerarios • Diseñar experiencias es como trazar caminos; mostrar por dónde ir; deﬁnir itinerarios. Itinerarios relacionados con lo que el usuario busca, con su forma de caminar, con su forma de pensar, con su modo particular de procesar información. • Por eso, diseñar itinerarios no es fácil; porque cada itinerario es para alguien, que camina a su estilo. Por eso el diseño de itinerarios empieza con la observación. • Un buen itinerario garantiza una buena experiencia; y tiene las características de cualquier buena ruta: amable, agradable, clara, inconfundible y, sobre todo, que lleva a destino. 127 Tendencia 10, Itinerarios

128. UXTrends2017-Zorraquino-Marzo2017 En síntesis • Diseño claro e intuitivo, sin exceso de mensajes. Enfocado a la usabilidad. • “Te va llevando, vas descubriendo” pero te sientes dueño de la interfaz. • Cada elemento tiene una razón de ser. • Basado en el conocimiento del cliente, para acertar con el camino y para poder guiarlo durante el proceso. • Comprender cómo es su experiencia, qué motivaciones tiene, qué es lo que espera y por qué; saber cuándo se siente frustrado, perdido o aburrido para poder solucionarlo. • Características de un buen itinerario: simplicidad, claridad, rapidez, empatía, eﬁcacia. 128 Tendencia 10, Itinerarios

129. Airbnb Itinerario claros y fáciles de descubrir y de transitar

130. UXTrends2017-Zorraquino-Marzo2017 Airbnb • Web premiada en los Awwwards. • Información clara y útil. • Una sitio web en el que, desde el primer momento, se identifica claramente a qué se dedican y, una vez empiezas a navegar, resulta fácil encontrar lo que buscas, con resultados ordenados, posibilidades de filtrar según diferentes criterios, etc. • Tanto una web con diseño responsive como una app específica para móviles. • Destaca en los cuatro elementos clásicos (Awwwards): diseño, usabilidad - UX, creatividad y contenido. 130 Tendencia 10, Itinerarios

131. Basic Simplicidad en diseño y navegación 131

132. UXTrends2017-Zorraquino-Marzo2017 Basic • Super sencilla: texto sobre fondo blanco que te van guiando a través de una web formada por contenido atractivo. • Minimalismo y un contenido que hace que navegar por la página sea muy sencillo. • Protagonismo de la imagen y el vídeo. 132 Tendencia 10, Itinerarios

133. UXTrends2017-Zorraquino-Marzo2017 Para pensar • Comprender al usuario, clave para poder interpretar mejor cómo se siente, cómo piensa, qué necesita. • Conocerle es el primer paso necesario para poder diseñar una mejor experiencia. • El diseño de itinerarios, bien concebido, abarata costes (evitamos incluir acciones innecesarias) y reduce errores en el cliente (que disfrutará de la satisfacción que produce acercar a la primera con el camino). • El itinerario es cambiante, lo mismo que la UX. No basta con diseñarla una vez; hay que revisarla habitualmente, para adaptarla a un cliente y un proceso de compra que evoluciona constantemente. 133 Tendencia 10, Itinerarios

134. UXTrends2017-Zorraquino-Marzo2017 Referencias The Drum: The UX Revolution  http://www.thedrum.com/news/2017/02/14/the-ux-revolution-new-report-the-drum-reveals- why-great-user-experience-will-be-the Trends 2017  https://www.multiplica.com/wp-content/uploads/2017/02/multiplica.tendenciasux2017.pdf Entendiendo al cliente  https://itblogsogeti.com/2017/02/09/entendiendo-al-cliente/ Basic  https://basicagency.com/ 134 Tendencia 10, Itinerarios

135. Dímelo con vídeo Acercar la experiencia a la vida 135 UXTrends2017-Zorraquino-Marzo2017 Tendencia 11

136. UXTrends2017-Zorraquino-Marzo2017 Dímelo con vídeo • El vídeo está en todas partes. Lo vemos en el ordenadores, tablets y teléfonos. El vídeo puede entretenernos e informarnos, mostrarnos la serie que esperábamos, la última noticia, el modo de funcionamiento de un producto, cómo atar un nudo, dónde podemos ir de vacaciones... • Tiene fuerza porque es real, se acerca a la vida misma: porque la vida es en vídeo, con imagen, movimiento y sonido. Por eso el vídeo conecta, explica, comunica, emociona... y ayuda a mejorar la experiencia de usuario. • Diseñar la UX en torno al vídeo va más allá de usar demos o tutoriales; más bien, pasa por pensar la experiencia de usuario, en cada paso, contando con el vídeo. 136 Tendencia 11, Dímelo con vídeo

137. Squatty Potty Ve al baño fácil y rápidamente 137

138. UXTrends2017-Zorraquino-Marzo2017 En síntesis • Experiencias más audiovisuales. Diseño que incluya vídeos. • Muchas opciones de aplicación. Transformar un sitio con imágenes estáticas en una experiencia llena de movimiento y contenido que cuente historias. • Conexión emocional con el usuario. Por eso, mismo, especialmente activo en sectores como moda, viajes, lujo... • Desde el punto de vista funcional, los consumidores quieren ver el producto, un vídeo ayuda a mejorar la experiencia de compra. • El usuario agradece la calidad del vídeo. El reto: ser fácil de encontrar y fácilmente descargable. • La duración es relevante; la gente tiene diﬁcultad para consumir vídeos largos, a no ser que el contenido sea especialmente impactante. 138 Tendencia 11, Dímelo con vídeo

139. Coverr Vídeos para aspiracionales para tu homepage 139

140. UXTrends2017-Zorraquino-Marzo2017 Ambience videos • Cada vez más común tener vídeo en la homepage. • No tienen un protagonismo pleno, pero cambian la percepción y enriquecen la experiencia. • Los colores, la velocidad, el tono... sutilmente introduce un estado de ánimo o un sentimiento, provocando el deseo de seguir leyendo y navegar. • Suelen ser a pantalla completa. • No son de gran calidad para que no tarde mucho en cargarse la página. A veces incluso borrosos, para no diﬁcultar la lectura del contenido que hay sobre ellos. 140 Tendencia 11, Dímelo con vídeo

141. New York Times Te avisan del siguiente contenido y duración

142. UXTrends2017-Zorraquino-Marzo2017 Vídeos entretenimiento • Diseñar una buena experiencia pasa por conseguir que el consumo de vídeos sea fácil. • Reducir barreras para la activación, a través de la presencia en la página, el diseño, la ubicación y tamaño de los botones. • Facilitar el control de la experiencia. • Identiﬁcar la ubicación: que sepa dónde está (minutaje) y cuánto le queda. • Que pueda decidir si verlo entero o en parte. • Con opción de verlo con o sin sonido. • Introducir contenido contextual también enriquece la experiencia. • Avisar del contenido que viene después (NYTimes). 142 Tendencia 11, Dímelo con vídeo

143. Videos explicativos Te avisan del siguiente contenido y duración

144. UXTrends2017-Zorraquino-Marzo2017 Vídeos explicativos • Usados desde siempre, cada vez más presentes para mejorar la experiencia de usuario. Impulsados, ligeramente, por el "card-based design”. • Generalmente a pequeño tamaño (no pantalla completa): no todo el mundo los quiere ver; tratan de no ser invasivos. • Se busca que el usuario tenga el control. Que no salte al entrar en la página. • Sin sonido por defecto, opción de subirlo. Subtítulos. • Experiencia agradable y didáctica. Genera conﬁanza y compromiso porque habitualmente no son vídeos promocionales. • Cada vez, también, más vídeos 360º. • El auge de los "explainer videos”. 144 Tendencia 11, Dímelo con vídeo

145. Videos card-based design Te avisan del siguiente contenido y duración

146. Unboxing VÍdeos caseros con récord de popularidad 146

147. Tutoriales Invaden Youtube y la web 147

148. Explainer video Del Project Loon de Google 148

149. UXTrends2017-Zorraquino-Marzo2017 Para pensar • Una tendencia que va en alza, por la fuerza expresiva del vídeo y su facilidad de producción y uso, que las marcas deben saber emplear para mejorar la experiencia de los usuarios. • Los jóvenes son los grandes consumidores audiovisuales y muestran preferencia por este formato. • YouTube como escuela tanto por formato como por temática: demos, tutoriales, unboxing, etc. El vídeo como recurso habitual. • Un formato sin barreras, fácil de consumir, fácil de producir, que tolera el formato informal (con cuidado). Con algunos problemas de formato: puede ser muy pesado. • Los propios usuarios pueden ser también proveedores de contenido en vídeo y fuente de inspiración. 149 Tendencia 11, Dímelo con vídeo

150. UXTrends2017-Zorraquino-Marzo2017 Referencias Trends 2017  https://www.multiplica.com/wp-content/uploads/2017/02/multiplica.tendenciasux2017.pdf Good practices  https://www.interaction-design.org/literature/article/5-good-practices-when-using-video-for- ux  https://www.nngroup.com/articles/video-usability/  https://www.sitepoint.com/how-to-oﬀer-great-video-ux/ 150 Tendencia 11, Dímelo con vídeo

151. UX en movimiento Diseño para un mundo móvil 151 UXTrends2017-Zorraquino-Marzo2017 Tendencia 12

152. UXTrends2017-Zorraquino-Marzo2017 UX en movimiento • El mundo actual es móvil. Móvil desde el punto de vista del consumo de medios, la comunicación interpersonal, la relación de las marcas con sus clientes. • En torno al 70% del tráﬁco de Internet es actualmente a través de dispositivos móviles, lo que obliga a las marcas a diseñar experiencias pensando en un usuario en movilidad, tanto por el dispositivo como por la situación de consumo. • Estamos pasando de "mobile ﬁrst" a "mobile native", de "responsive design" a "progressive design". Porque, ya ahora, la presencia de las marcas en Internet, si no es "mobile friendly", no existe. Con diseños más intuitivos, de descarga rápida, pensados y nacidos para el móvil, ricos en imagen, con textos breves, para un usuario cuya pantalla principal es, en muchos casos, un teléfono. 152 Tendencia 12, UX en movimiento

153. Forbes ha lanzado su PWA Promete rapidez por encima de todo 153

154. UXTrends2017-Zorraquino-Marzo2017 Progressive web apps • Promovidas especialmente por Google: las PWA. • Nuevas webs móviles que tratan de replicar las principales características de las apps nativas. • Buscan crear experiencias únicas y diferenciales: lectura rápida, fricción y frustración reducidas al mínimo, etc. • Se cargan instantáneamente en el dispositivo. • Son interactivas con el usuario: notiﬁcaciones. • De diseño intuitivo. • Ofrecen posibilidad de trabajar sin conexión. • Plantean una experiencia inmersiva, facilitando el “engagement”. 154 Tendencia 12, UX en movimiento

155. Comparación en la velocidad de carga del contenido Promete rapidez por encima de todo

156. UXTrends2017-Zorraquino-Marzo2017 The Washington Post • Experiencia mobile web separada. • Funciona y se comporta como una web nativa. • Con icono en la pantalla principal del móvil. • Las historias se cargan inmediatamente. Rapidez. • Acceder a contenido oﬄine. • “We embrace technological innovation at The Post, and any technology that allows us to oﬀer a superior experience to our readers is a priority,” Shailesh Prakash, Jefe de Tecnología TWP. 156 Tendencia 12, UX en movimiento

157. UXTrends2017-Zorraquino-Marzo2017 Para pensar • El usuario busca sobre todo rapidez y facilidad de uso, preferentemente a través del móvil. • En un contexto cada vez más exigente desde el punto de vista del usuario, y más competitivo desde el punto de vista del mercado, la navegación móvil no simplemente tiene que ser "responsive"; ha de nacer para la pequeña pantalla. • Tratar de conseguir un diseño ideado por y para móviles. Para pantallas táctiles con poco espacio de lectura. • Un cambio que tiene implicaciones no sólo de diseño, sino también tecnológicas, que habrá que estar atento para adquirir. 157 Tendencia 12, UX en movimiento

158. UXTrends2017-Zorraquino-Marzo2017 Referencias Trends 2017  https://www.multiplica.com/wp-content/uploads/2017/02/multiplica.tendenciasux2017.pdf  http://www.mondo.com/ux-design-trends-2016-2017/ Age-Responsive Design  https://uxdesign.cc/toward-a-more-human-user-interface-with-artiﬁcial- intelligence-7bbee17ﬀ30d#.99fckz8kx  http://insanelab.com/blog/web-design/age-responsive-web-design/ PWAs   http://www.digitaltrends.com/mobile/progressive-apps-live/  https://www.campusmvp.es/recursos/post/Que-son-las-Aplicaciones-Web-Progresivas-o- Progressive-Web-Apps.aspx 158 Tendencia 12, UX en movimiento

159. UXTrends2017-Zorraquino-Marzo2017 Referencias The Washington Post  https://www.washingtonpost.com/pr/wp/2016/05/19/the-washington-post-introduces-new- progressive-web-app-experience/?utm_term=.b48815409100 Forbes  http://www.niemanlab.org/2017/03/forbes-rebuilt-its-new-mobile-website-as-a-progressive- web-app/ 159 Tendencia 12, UX en movimiento

160. UXTrends2018-Zorraquino-Enero2018 Somos una consultoría estratégica de negocio, una agencia digital, un estudio de diseño y una empresa de desarrollo que centra su trabajo en la investigación, el diseño, la tecnología y el marketing. Nuestros proyectos se basan siempre en metodologías de diseño y ágiles como elemento clave en la estrategia e innovación de los negocios.   Conócenos en: www.zorraquino.com 160 ZORRAQUINO

161. Zorraquino Imagen de nuestras instalaciones en BIlbao

162. Madrid Gustavo Fernández Balbuena 11, 4º  28002 MADRID Tel. (+34) 91 179 34 82 Twitter LinkedIn Instagram Newsletter © COPYRIGHT ZORRAQUINO COMUNICACIÓN, S.L.U. TODOS LOS DERECHOS RESERVADOS. ESTE DOCUMENTO ES PROPIEDAD DE ZORRAQUINO COMUNICACIÓN, S.L.U. Y SU CONTENIDO ES CONFIDENCIAL.  ESTE DOCUMENTO NO PUEDE SER REPRODUCIDO, EN SU TOTALIDAD O PARCIALMENTE, NI MOSTRADO A OTROS, NI UTILIZADO PARA OTROS PROPÓSITOS QUE LOS QUE SE HAN ORIGINADO EN SU ENTREGA,  SIN EL PREVIO CONSENTIMIENTO POR ESCRITO DE ZORRAQUINO COMUNICACIÓN, S.L.U. Bilbao Marqués del Puerto 6, 1º  48009 BILBAO Tel. (+34) 94 415 73 79  www.zorraquino.com ZORRAQUINO

UX Trends 2017 Report

Estás leyendo una previsualización.

Eche un vistazo a continuación

UX Trends 2017 Report

Más Contenido Relacionado

Presentaciones para usted (10)

Similares a UX Trends 2017 Report (20)

Más reciente (20)