WP UX&UI Design Paredro

UX&UI DESIGN

DISCIPLINA QUE PONE DE CABEZA EL MUNDO DE TODOS LOS CREATIVOS

01

UX&UI DESIGN DISCIPLINA QUE PONE DE CABEZA EL MUNDO DE TODOS LOS CREATIVOS

INTRODUCCIÓN Ser un diseñador con dotes creativas excepcionales es una característica muy positiva, pero ya no es suficiente... ahora los grandes artesanos del diseño de todos los ámbitos deben dominar las técnicas del User eXperience y el User Interface Design (UX&UI) Este sensible cambio se deriva de la influencia que la tecnología y el desarrollo de lo digital han tenido en la vida de las personas y, en un primer momento, si los afectados por estas transformaciones fueron los productores de contenidos, pues enseguida los maestros de la invención de la imagen han tenido que responder a los retos que los usuarios de los servicios exigen de todas las plataformas digitales a las cuales acceden. En este punto, la paradigmática historia de Apple y la facilidad de uso de sus sistemas operativos se plantean como el parteaguas de lo que ahora se exige como un mínimo acerca de las nuevas plataformas Android, Blackberry, Windows y por supuesto, iOS, las cuales son las que propician la comunicación correcta entre la gente y cosas como los portales de internet, los teléfonos móviles, las tabletas, los televisores, las consolas de videojuegos, las aplicaciones (de todo lo que uno se pueda imaginar). Y si se quiere extender esta filosofía hacia el ámbito del mundo urbano, estos dispositivos a su vez deberán interactuar con los nuevos ingenios arquitectónicos, los edificios y las casas inteligentes, los centros comerciales, los vehículos y hasta los robots que se lleguen a tener en casa. Como se puede apreciar, la influencia que esto tiene en el diseño, lleva al profesional de la creatividad a pensar un poco más allá de lo que antes representaba el papel y el lápiz sobre el escritorio, por lo que resulta importante conocer los esbozos de lo que son el UX&UI Design.

02


PARTIR DE LO BÁSICO Un par de definiciones simples —dada la complejidad de los conceptos— son las siguientes: El UXD trata de aumentar la satisfacción y la lealtad de los clientes mediante la mejora en la facilidad de uso y el placer proporcionado por la interaccción entre el sujeto y el producto. El UID interviene en el modelado correcto de la interfaz de usuario, sean sitios web, apps, smartphones, computadoras, electrónicos, máquinas, vehículos y hasta edificios. Para ponerlo de forma aún más sencilla, situado en la construcción de un carro, UI sería el equivalente a las formas del asiento, el volante, las palancas y los botones; la facilidad del encendido, el sonido del motor, y el UX sería la manera en la cual la suma de toda la experiencia de manejo del conductor propicia una sensación de valor para los tripulantes, en donde por ejemplo, la detección automática de la correcta temperatura de acuerdo con el perfil del usuario, la conexión de su móvil con el sistema de sonido interno y otros factores similares la hacen una vivencia distintiva.

03


ESTRUCTURA CORRECTA DE PANTALLAS Desde aquella época durante los años 80, en la que Wham! explotara el exagerado uso tipográfico en su video para la canción Wake me up, muchos cantantes y agrupaciones de la música hasta esta época, como Kanye West, Daft Punk y Adele, han agregado a sus audiovisuales grandes tipografías, con el objeto de ofrecer movimiento y vida distinta a sus canciones. Lejos de parecer una pista para un karaoke, los videos musicales que utilizan tipografías para dar vida a sus canciones, se ayudan de letras para comunicar con mayor facilidad el mensaje de las canciones, hacer acentos importantes o para llenar posibles vacíos en el discurso de la pieza, además de que pueden impactar de maenra importante a los espectadores.

04


Una solución de UX&UI debe contener cuatro aspectos básicos, que son el diseño interactivo, el diseño visual, la ingeniería y una sección final que tiene que ver con el apoyo al usuario, que puede ser de soporte técnico, preguntas frecuentes o de asistencia en línea.

DISEÑO INTERACTIVO

DISEÑO VISUAL

INGENIERÍA

ÁREA DE APOYO AL USUARIO

En donde el diseño interactivo se refiere a la secuencia de pantallas que se suceden en la aplicación, es como el flujo en su operación que al final debe ser sensato para el usuario. El diseño visual, a pesar de que parece ser lo más sencillo, en ocasiones es lo más difícil de lograr y se define por la cromatografía, la tipografía, la iconografía y en términos generales, con aquello que es consecuente a la personalidad del producto. Una vez que ambos conceptos aterrizan, la parte de ingeniería se encarga de conectar o programar los comandos y plugins necesarios para que la solución funcione como corresponde. Finalmente, para este momento el área comercial ya debe contar con las respuestas que se refieren al apoyo para el usuario. Se debe tener en consideración que si alguno de estos componentes en el diseño desentona, la experiencia del usuario puede no ser positiva. Por lo tanto, el enfoque en los detalles es muy relevante en el equipo de trabajo, para que todo funcione como se espera. Por lo anterior, resulta recomendable siempre dar un paso atrás, y observar la solución creada antes de liberarla al mercado, con el fin de asegurarse de que cumpla con las expectativas.

05


UNA DE LAS CARRERAS DE MAYOR CRECIMIENTO Si hasta este punto no te ha enganchado tanto el tema del UX&UI, quizás el hecho de que sea una de las disciplinas que mayor crecimiento en cuanto a la demanda de talento, podría despertarte el interés. Y no sólo llama la atención por la generación de empleos, sino también en lo referente a la variedad de disciplinas que se usan en la confección de una solución, así como el tema del salario y la especialidad en el uso de herramientas.

06


En cuanto a los tipos de trabajos que se encuentran en la disciplina se encuentran los siguientes: INVESTIGADOR DE USUARIOS (USER RESEARCH): Proveen un profundo entendimiento de los comportamientos de los usuarios, así como de sus necesidades y motivaciones. Ofrecen retroalimentación en todas las fases del proceso de diseño. Sus salarios en naciones desarrolladas oscilan entre los 80 y los 117 mil dólares anuales. ANALISTA DE USABILIDAD (USABILITY ANALYST): Aplica la investigación de usuarios y los principios de usabilidad para identificar problemas de utilidad de las soluciones. Contribuyen en asegurar que las metas de usabilidad se logren al identificar los objetivos del proyecto, evaluar su éxito y medir sus resultados. Sus salarios en naciones desarrolladas oscilan entre los 66 y los 127 mil dólares anuales. ARQUITECTO DE LA INFORMACIÓN (INFORMATION ARCHITECT): Se enfocan en maquetar, construir y optimizar la manera en la que la información es organizada y presentada a los usuarios (diseño interactivo). Sus salarios en naciones desarrolladas oscilan entre los 80 y los 126 mil dólares anuales. DISEÑADOR INTERACTIVO (INTERACTION DESIGNER): Esboza sobre los datos del usuario, la investigación y los inputs del equipo, para generar conceptos de interacción que habilitan las conexiones correctas, fluidas, pertinentes y atractivas sobre las pretendidas experiencias para los usuarios. Sus salarios en naciones desarrolladas oscilan entre los 74 y los 115 mil dólares anuales. DISEÑADOR VISUAL (VISUAL DESIGNER): Convierte los wireframes y prototipos en diseños visuales, que son a la vez fáciles de usar y se adhieren a la marca pautas. Se basan en un profundo conocimiento de los elementos gráficos, guías de estilo, los estándares de marca y diseño de sistemas. Sus salarios en naciones desarrolladas oscilan entre los 60 y los 97 mil dólares anuales. DISEÑADOR UX (UX DESIGNER): Suelen provenir de todos los oficios descritos anteriormente dentro del proceso de diseño centrado en el usuario. Su función se orienta a la creación de experiencias de usuario exitosas a través de la investigación, la retroalimentación, el análisis, las pruebas y las mejores prácticas. Sus salarios en naciones desarrolladas oscilan entre los 73 y los 110 mil dólares anuales.

07

UX&UI DESIGN DISCIPLINA QUE PONE DE CABEZA EL MUNDO DE TODOS LOS CREATIVOS LOS CONOCIMIENTOS DE ESTOS PROFESIONALES SE CONCENTRAN EN LO QUE A CONTINUACIÓN SE DESCRIBE: HTML, XHTML, XML

87%

Codificación CSS

85%

Diagramado de páginas, diseño de interfaz

78%

Edición de imágenes y producción

64%

Programación de aplicaciones para usuario, JavaScript

63%

Arquitectura de la información, wireframing, maquetado de sitios

61%

Pruebas de usabilidad

57%

Diseño gráfico

56%

Servicios de back-end, PHP, Ruby on Rails, ASP

55%

Gestión de proyectos

51%

Escritura, creación de contenidos y edición

42%

SEO y SEM

41%

Pruebas de la accesibilidad

39%

Otros

8%

Y LAS HERRAMIENTAS QUE SON MÁS USADAS ENTRE LOS CREADORES DE UX&UI SON LAS QUE SE RELACIONAN A CONTINUACIÓN. Investigación

Herramientas de diseño

Elaboración de prototipos

PollDaddy

OmniGraffle

Adobe Firework

Usabilla

Visio

HotGloo

Morae

Axure

Justinmind Prototyper

Feedback Army

Balsamiq Mockups

iPlotz

Crazy Egg

Mockingbird

fluidlA

Webnotes

Wirify

CogTool

Silverback

Mock Flow

Lumzy

Flip Camera

Power Mockup

The Pencil Project

Camtasia Studio

Pattern Tap

App Sketcher

UserZoom

Cacoo

UX Pin

Google Website Optimizer

Gliffy

Pidoco

Google Analytics

Paper Sketching

Paper Prototyping

* Toda la información de la anterior sección proviene de un trabajo realizado por On Ward Search (http://www.onwardsearch.com/UX-Career-Guide/).

08


OTROS 6 BUENOS RECURSOS PARA EL DISEÑO DIGITAL Además de los anteriores instrumentos, probablemente las siguientes herramientas no están en el radar de los profesionales de esta industria, pero no tardará el momento en el que deberán relacionarse con ellas. LUMOS: Con más de 1,450 iconos útiles y perfectamente bien diseñados, listos para descargar, es un complemento esencial para la colección y adornar artísticamente los diseños. APPITERATE: Para los que gustan del diseño de aplicaciones móviles de arrastrar y soltar directamente en la barra. CACTUS: Es un nuevo flujo de trabajo para la codificación manual. Sólo se tiene que elegir una plantilla y Cactus genera directamente la carpeta, la estructura de archivos y todo lo demás. Fácil y rápida de usar. HTML5 Pocket Reference: Es muy preciso y legible, pequeño por fuera pero grande por dentro. 12HOURS: Es una aplicación para los dispositivos con Android, bonita, inteligente y funciona para marcar los puntos de presión del trabajo diario en un reloj digital. RESPONSIVE DESIGN WITH WORDPRESS: Si lo que se busca es una guía práctica y a buen ritmo de construcción, esta es la oferta.

09


10 SORPRENDENTES CASOS DE UX&UI Como se ha mencionado, la disciplina del User eXperience y el User Interface Design, prácticamente hoy se relacionan a la actividad humana moderna y existen temas por desarrollar, por ejemplo, los pasos para elaborar una buena estrategia de UX, cómo incrementar las ventas a través de un proyecto, cómo automatizar órdenes de compra, cómo sistematizar la captura de información del usuario o cómo lidiar con los errores. No obstante, estas cuestiones serán resueltas en el siguiente ejercicio de Paredro sobre el tema. Mientras tanto, dejamos 10 sorprendentes casos en los que se plantean diversas soluciones modernas en las que el UX&UI está implícito.

010


1. APP PARA LA TOMA DE DECISIONES Choicemap es el nombre de esta nueva app para smartphones que cumple con la sencilla función de ayudar a la toma de decisiones difíciles —o decantarse por la correcta. La aplicación (http://youtu.be/WAFwoQHAEzg) es gratuita y contribuye en romper con los dilemas complejos que a uno se le puedan presentar, con el apoyo de una lista de prioridades, las cuales son calificadas por el usuario y ofrecen una idea de cómo van a afectar a su vida. La parte sofisticada es que utiliza un algoritmo para anotar las decisiones y además es también útil para cosas como averiguar el futuro de una relación, decidirse por un empleo, una inversión o simplemente para saber qué comer para la cena.

011


2. DRIBLET Y EL AHORRO DE AGUA Para enseñarle a su hija adolescente cuánta agua gastaba al bañarse, el ingeniero mexicano Rodolfo Ruiz y su equipo inventaron Driblet, un sistema inteligente para el manejo del agua, con el cual pudo dar una lección a su nena, pero también se convirtió en un innovador negocio. Driblet Labs, Inc. es una corporación de Delaware recientemente establecida, pero que nació en Monterrey, México, después de ganar el 1er lugar en la competencia AngelHack Hackathon del Silicon Valley celebrada durante 2013. Además de un gran diseño de producto, la solución que proporciona Driblet incorpora el seguimiento de diversas variables relacionadas con el uso del agua, y que tiene el propósito de capacitar así como alentar a las personas, empresas, organizaciones y gobiernos para ahorrar agua. Además, el sistema eléctrico de Driblet se alimenta de la misma fuerza en el flujo del agua corriente, de manera que no requiere del reemplazo de baterías. Al funcionar el dispositivo conectado a la tubería, envía los datos recogidos vía WiFi a la nube, con lo que el usuario puede revisar en un web site o un dispositivo móvil los datos respecto a los litros usados, incluso en tiempo real.

012


3. COMO UN ROBOT FALDERO: KEECKER Aquellos simpáticos asistentes robotizados, como los que se veían en las diferentes caricaturas, series de TV y películas de ciencia ficción, ya comienzan a tener una presencia verdadera en la vida de las personas a pesar de que en un principio sus funciones sean muy básicas, como aspirar el piso, recoger basura o proyectar audio y emitir video en cualquier lugar, cosa que Keecker ofrece. Es verdad que todavía no se alcanza el momento en el que estos divertidos dispositivos interactúen inteligentemente con los humanos como Robotina, C3PO o Wall·e, pero cuando menos Keecker (www.keecker.com) ya cuenta con esa apariencia entrañable y ofrece un servicio que puede ser de interés para mucha gente. Para empezar es capaz de moverse sólo entre los muebles de la casa, en donde el propósito de la firma francesa que le ha creado es ofrecer a sus usuarios la posibilidad de proyectar sus contenidos personales en cualquier lugar de la habitación, lo que le abre un abanico de posibilidades para oficinas y eventos. Además de su diseño atractivo, con Keecker el usuario ya no está atado a una pantalla, ya que la imágenes se proyectan en donde se desee y se controla desde el smartphone. Entre las cosas que se le pueden pedir a Keecker es que proyecte una obra de arte o una película en la sala o en la habitación, una receta en la pared de la cocina, una sesión de ejercicios en el jardín o patio, un tutorial sobre una materia que deseemos aprender en el taller de casa y así, diversión o información para la tarea de los niños, videojuegos y hasta crear ambientes musicales para reuniones a través de la misma aplicación.

013


4. EL MONSIEUR COCTELERO La velocidad con la que Monsieur (http://monsieur.co) —modernísimo dispensador de cocteles— recaudó en Kickstarter la cifra objetivo e ingresó a su fase de producción, comunica sin duda su potencial entre los gustos de las persona. El aparato puede tenerse en casa o en un negocio y es promovido como un bartender robot que prepara cocteles para sus usuarios. La forma en la que opera es a través de una pantalla táctil, en la que se ofrecen diversas recetas de cocteles, de forma que el usuario revisa cómo se prepara, qué contiene y la prepara al instante. Y si el cliente no sabe qué ordenar, el dispositivo puede hacer recomendaciones basadas en los gustos del usuario. Los paquetes de información con los que cuenta va de las 12, 25, 150 y hasta 300 recetas. De manera adicional, la máquina se puede conectar con el smartphone del usuario, desde donde puede recibir las órdenes de servicio, o en su caso, proveer información. También lleva el control de la ingesta de alcohol que ha bebido el usuario, de forma que puede informar sobre la pertinencia de conducir y hasta puede solicitar un taxi en favor de quien no se siente en condiciones de manejar.

014


5. GOLF GTI Y SU APP MUSICAL Una aplicación que crea música como respuesta a los hábitos de manejo del conductor es uno de los juguetes que Volkswagen ha inventado de acompañamiento para el nuevo Golf GTI. Este complemento es el resultado de una inusual colaboración entre Volkswagen y Underworld, reconocido duo británico de música electrónica, (http://www.volkswagen.co.uk/playtheroad) con la cual la conducción del carro se sincroniza con la música en tiempo real. La aplicación reconoce cómo y en dónde se conduce, de modo que traduce ese movimiento en música en directo. Obtiene los datos de velocidad y RPM de la computadora del GTI, así como la aceleración, los datos de localización, que se calculan a partir de una combinación del acelerómetro, el giroscopio y el receptor GPS presente en el iPhone.

015


6. LA TV EN EL ESTADIO CON GOOGLE GLASS Imagina que estás en el estadio, pero a la hora de tener que ir al baño, de pronto escuchas el rugido de las gradas... ... horror... sí, te perdiste el gol que define el partido y quizá la temporada de tu equipo preferido... o... quizás no, gracias a una nueva app que se diseña junto con Google Glass. De acuerdo con un artículo escrito por Erika Murphy, en Forbes: (http:// www.forbes.com/sites/ erikamorphy/2014/02/28/how-google-glass-is-building-new-venues-for-sports-sponsors/), el Verizon Center y el equipo de hockey de los Capitales de Washington D.C., en la actualidad trabajan en un programa piloto para el desarrollo de un sistema llamado SkyBox, desarrollado con software de la startup APX Labs y para operar sobre Google Glass, que podrá desplegar estadísticas en tiempo real, datos destacados del partido, incluidas sus repeticiones en vídeo. Lo que el texto de la autora no comenta es que la aplicación podría ofrecer la alternativa al hincha de elegir entre ver la repetición de la televisora oficial o recoger la perspectiva de alguno de los otros asistentes al estadio, que hayan tenido la oportunidad de grabar el momento.

016


7. THE FIND: EVOLUCIÓN EN EL RETAIL Todos aman comprar, aunque para muchos el hecho de invertir horas de visita, saltando de tienda en tienda para encontrar una oferta acorde a los intereses de una compra, representa una tortura, por ello The Find es la aplicación para móvil que permite a sus usuarios buscar y comparar los resultados obtenidos para encontrar rápidamente las mejores ofertas. Del éxito que The Find (http://www.thefind.com/) logre, sin duda se incidirá en el desempeño del retail en el mundo entero y aunque en la actualidad sólo tiene presencia en los EUA y el Reino Unido, las tiendas de cualquier lugar del planeta pueden contactar directamente a los creadores de la aplicación para saber cómo subir su información al sistema. El desarrollo cuenta con modelos para Android e iOS —además de la versión para web— y aplica una tecnología de comercio electrónico patentado que trabaja en un entorno multicanal para personalizar la experiencia de compra, con el apoyo de un buscador web que rastrea información de todas las tiendas on line para encontrar los productos sobre los cuales compradores los compradores tienen interés. Cada que se realiza una búsqueda, The Find muestra los productos más relevantes de las tiendas y ofrece en la tableta, móvil o navegador, los precios y características del producto en cada local, desde Amazon y hasta Walmart, pasando por todas las tiendas situadas entre estos gigantes del retail.

017


8. LA CASA INTELIGENTE QUE SIEMPRE SE HA DESEADO Se trata de aquella en el que se podrá cerrar la llave de agua, prender o apagar luces, abrir o cerrar puertas, ventanas y persianas, todo a distancia y ya es posible, gracias al proyecto que AT&T presentó en los EUA conocido como Digital life (http://youtu.be/SU8PDySrKok), que permite al usuario controlar todo desde una tableta, teléfono o computadora. AT&T Digital life (http://www.att.com/shop/digital-life.html) es un sistema ya disponible de seguridad y automatización a control remoto, cuya oferta aún se mantiene limitada a determinadas regiones, y además de que la casa se puede estar asegurar, también es posible “administrar” la actividad de los hijos o de los animales domésticos, ajustar el termostato en el control del clima interno desde cualquier lugar en el que se encuentre el usuario.

018


9. IMPRESO Y NIÑERA A LA VEZ

Todas las ocasiones en las cuales los padres asisten a espacios públicos llenos de gente con sus hijos, les sobreviene un especie de estrés relacionado a siempre tener a los chicos bajo el ojo vigilante, pero con esta innovación de Nivea en Brasil, una parte de esa angustia se resuelve. Esta táctica (http://youtu.be/L61ZT9jn1t0), que se anuncia para su uso en la playa —porque está relacionada con una marca de protectores solares de Nivea— en realidad puede ser útil durante cualquier situación en donde se combinen las muchedumbres con los niños, por ejemplo, parques públicos o centros comerciales. La campaña, denominada The protection ad, mezcla un anuncio impreso, un dispositivo electrónico, un spot para su difusión y la descarga de una aplicación.

019


10. CONVERGENCIA MÓVIL Y LAS DISNEY MAGIC BANDS Y para terminar, con este caso resulta importante introducir otro concepto, el que comienza a conocerse como la “convergencia móvil”, con la cual sin duda intervienen elementos de UX&UI y que será en el corto y mediano plazo una de las tácticas de mercadotecnia más relevantes durante la experiencia de uso o compra del consumidor, la cual se encuentra en pleno desarrollo y en la que Disney es uno de sus pioneros más avanzados. Así, resulta que durante el verano de 2013, Disney presentó las Magic Bands (https://disneyworld.disney.go.com/ plan/my-disney-experience/bands-cards/) que son usadas por los asistentes a sus parques temáticos, las cuales consisten en unas pulseras cargadas con RFID (siglas de la tecnología Radio Frequency IDentification), que funcionan como boletos de entrada, también reducen las largas filas mediante los FastPasses que provee el parque y también como llaves para las habitaciones dentro del resort Las implicaciones de esta clase de ingenios tienen que ver no sólo con la movilidad, sino con su capacidad de almacenar información personal y las preferencias del usuario, con lo que se pueden correr análisis veloces, interesantes, data mining y de atención al cliente, que redunden en una gran experiencia de compra. Un ejemplo de su aplicación puede darse cuando la princesa Elsa de Frozen pueda acercarse a una niña sabiendo que es su personaje favorito y saludarla por su nombre. Si es el cumpleaños de la niña, Elsa lo sabrá y en la tienda de regalos más cercana pueda dirigirse a la cumpleañera con la réplica de la muñeca, y si los padres aceptan la compra, sólo tendrán que mostrar su muñeca para pagar por ella (ya que la MagicBand también tiene la información de la tarjeta de crédito guardada). Asimismo, señala que los padres apreciarán las notificaciones sobre la velocidad con la que las filas a los juegos se mueven, no tendrán que cargar con una cartera llena de billetes, llaves electrónicas, tarjetas de crédito y FastPasses, con lo que la vivencia será más fácil y fluida. Lo que viene en este formato digital es la convergencia de la telefonía móvil, el big data y la personalización para impulsar experiencias de usuario verdaderamente superiores, ya sea mediante smartphones o wearables. Así que los especialistas pueden comenzar a estudiar sobre este sofisticada materia de diseño, comunicación y mercadotecnia experiencial, que se cruza con tácticas y tecnología de vanguardia.

020


021

WP UX&UI Design Paredro

Recommend Documents