Lo que no te enseñarán en una escuela de diseño: aprendiendo del rey Sidharth
Publicado: 2021-04-03Los currículos universitarios están bastante estructurados. Haces el paso 1, luego el paso 2 y así sucesivamente, y hay guardianes en cada paso del camino, dijo el rey Sidharth en TMS2021
Es realmente difícil entender qué funcionará comercialmente en el diseño. Pero dividir el proceso de hacer diseños factibles en tres preguntas ayuda
Dando a la audiencia una descripción general de lo que significan el front-end y el back-end, Sidharth explicó la necesidad de comprender los diferentes roles que desempeñan las partes interesadas al crear el producto.
La vida útil de una tecnología en uso en la industria está superando los planes de estudios universitarios más rápido que nunca. No es que las universidades no sean conscientes del problema, pero no hay mucho que puedan hacer al respecto. Los planes de estudios tardan un tiempo en rediseñarse y, cuando están listos, ya comienzan a perder su ventaja. Por lo tanto, las universidades en su mayoría mantienen sus planes de estudio limitados a los fundamentos básicos.
“Alguna experiencia proviene solo de la industria cuando trabajas allí”, dice King Sidharth, quien está a cargo de Diseño, UX y Producto en Headout. Hablando en The Makers Summit 2021 , Sidharth se refirió a los problemas que enfrentan los diseñadores en entornos de trabajo reales, exponiendo a la audiencia a 3 aspectos de misión crítica del desarrollo y diseño de productos, es decir, cómo medir el diseño, cómo se construyen los productos y cómo los sistemas de diseño necesita ser extensible.
Simulación del entorno laboral real
El color, la tipografía, los diseños, las microinteracciones, las sombras, las animaciones y la comunicación visual son cosas fáciles de enseñar en una escuela de diseño, dijo Sidharth en una sesión fascinante que vio uno de los niveles más altos de participación de la audiencia. Estos temas se han investigado intensamente y existe una gran cantidad de trabajo que ya está integrado en el plan de estudios. Pero los problemas que enfrenta un diseñador en la industria son de naturaleza bastante dinámica. No se puede esperar claridad en el mismo momento en que comienza el proyecto en la vida real. Los currículos universitarios están bastante estructurados. Haces el paso 1, luego el paso 2 y así sucesivamente, y hay guardianes en cada paso del camino y solo puedes avanzar cuando terminas estos pasos en el orden, agregó Sidharth.
Es difícil emular escenarios comerciales en el entorno de una escuela de diseño porque el marketing, la ingeniería, la atención al cliente, las ventas, todos tienen intereses en el proceso de diseño. El diseño tiene sus implicaciones desde el momento en que el cliente comienza a interactuar con el producto hasta la adquisición del usuario por parte de la empresa.
“La compañía no es un recurso infinito. Donde sea que estés empleado, tienen tiempo limitado, dinero limitado e ingenieros limitados y, por lo tanto, debes priorizar y elegir tus batallas, y nuevamente, que no se puede emular en la universidad” , comentó King Sidharth. La optimización entre las perspectivas comerciales y la experiencia del usuario, los comentarios y las repercusiones de las decisiones tomadas por otros equipos es difícil de emular en el entorno universitario.
Dijo además que los problemas específicos que uno enfrentaría en el entorno laboral son difíciles de anticipar mientras se aprende en una escuela de diseño. “Oh, esto tiene un aspecto increíble y es emocionante y todo eso, pero ¿marcará una diferencia en el negocio? ¿Cómo sabemos que al usuario realmente le importa esto y si es técnicamente factible? ¿Escalará? ¿Qué pasa si el diseño se rompe si alguien hizo una solución rápida o alguien hizo un cambio no deseado? ¿Cómo medimos el impacto? ¿Necesitamos someterlo a pruebas manuales? ”, Sondeó el rey Sidharth.
Es realmente difícil entender qué funcionará comercialmente en el diseño, pero Sidharth ayudó a la audiencia al desglosar el proceso de hacer diseños factibles en tres preguntas:
- ¿Cómo mides tu diseño?
- ¿Cómo construyen los diseños los equipos de ingeniería?
- ¿Cómo escalar tus diseños?
Nos sumergimos más profundamente en estos con ejemplos fáciles de relacionar a continuación.
TRANSMITE LA SESIÓN AQUÍ
Diseño de medición
Los diseñadores entienden bien los métodos de investigación, pero cuando se trata de datos, la mayoría de ellos luchan por entenderlos, comentó King Sidharth. Pero, ¿cómo se ven los datos para los diseñadores?
Digamos que tenemos una página de destino que describe su oferta y tiene un llamado a la acción para comprar. También tiene un botón de CTA alternativo llamado "aprender más" porque no todas las personas harán clic en el botón "comprar ahora" al principio. Para analizar la eficacia del diseño en este caso, utilizamos análisis basados en eventos. En este caso, la carga de la página y los clics en los botones serían los eventos, y el texto del botón, el color del botón y los atributos del dispositivo, como los tipos de dispositivo, el sistema operativo, el navegador, la dirección IP, la ubicación, etc., son propiedades.
Para ayudarnos a capturar estos eventos y propiedades, se pueden usar soluciones de software profesionales como Mixpanel y Amplitude, que también son los patrocinadores de la cumbre de creadores 2021. Estos vienen con algunas propiedades predeterminadas, como los atributos del dispositivo mencionados anteriormente, listas para usar y personalizables. propiedades que ayudan a obtener la historia de usuario correcta para casos individuales.
Además, estas herramientas también nos ayudan a entender la serie de pasos que dan los usuarios para llegar a la llamada a la acción deseada. Y estos eventos individuales también pueden marcarse con las propiedades deseadas y analizarse para ver en qué etapa los usuarios están abandonando. Sidharth introdujo la idea de los embudos. Los embudos básicamente mapean a los usuarios en cada paso del camino hasta que toman la acción deseada.
Luego podemos usar estos datos para optimizar nuestra página de destino. Aquí también aparecerían diferentes KPI y optimizaciones para lo mismo. Por ejemplo, la tasa de abandono en el ejemplo anterior nos diría cuántos usuarios a los que se dirigió una campaña de marketing compraron el producto.
Recomendado para ti:
Estas métricas nos ayudan a investigar más a fondo si el diseño cumple con los entregables y nos ayudan a tomar decisiones que pueden impulsar la entrega de valor. Es mejor que los diseñadores sepan cómo comprender e interpretar los análisis para descubrir problemas y validar soluciones. Porque los datos son extremadamente valiosos y revelan mucho sobre el comportamiento del usuario. Nos ayuda a comprender la relación entre los diferentes tipos de datos de rendimiento y los datos cualitativos para capturar la historia completa de los usuarios.
factoring en ingeniería para el diseño
“Muchos diseñadores crearán diseños asombrosos, solo que al final los ingenieros lo rechazarán diciendo que no es factible”, observó Sidharth. Por lo tanto, es extremadamente importante comprender cómo se construyen los productos para que muchos de los problemas de viabilidad se aborden en las primeras etapas.
Dando a la audiencia una descripción general de lo que significan el front-end y el back-end, Sidharth explicó la necesidad de comprender los diferentes roles que desempeñan las partes interesadas al crear el producto.
En pocas palabras, el front-end es la parte de la aplicación que está orientada al usuario y los usuarios pueden interactuar con ella. El backend (o "lado del servidor") es la parte del sitio web que no se puede ver. Es responsable de almacenar y organizar los datos, y de garantizar que todo en el lado del cliente realmente funcione. Backend se encarga de la autenticación del usuario, los pagos y automatiza la lógica comercial. Los sitios web de carteras de diseñadores se construyen en gran medida utilizando tecnologías front-end sin tener mucho que ver con el back-end.
Sidharth dio un ejemplo de la aplicación de Twitter para ayudar a la audiencia a visualizar mejor estas ideas. El front-end y el back-end, también sinónimos del lado del cliente y del lado del servidor, se comunican continuamente entre sí a través de Internet. Comprender que Internet puede ser poco confiable y que la mayor parte del mundo emergente no tiene acceso a las velocidades de Internet a las que estamos acostumbrados puede ser de gran ayuda al diseñar experiencias para el usuario.
Cuando la aplicación de Twitter se carga por primera vez, se puede ver el estado básico de la aplicación. Le asegura al usuario que la aplicación está funcionando. Pero en caso de que el usuario esté navegando por la aplicación por segunda vez, no lo verá porque el navegador o el dispositivo ya habrían almacenado en caché los archivos necesarios para cargar la aplicación más rápido. La memoria caché es un almacenamiento local temporal que es algo así como almacenar los artículos necesarios en una tienda de comestibles local en lugar de quitárselos directamente a un granjero . “Ahorra tiempo en tu cocina. Los servidores CDN hacen exactamente lo mismo por usted. Si bien aún necesitaría cocinar, se minimizaría el tiempo necesario para obtener sus ingredientes”, agregó Sidharth.
Mientras tanto, el dispositivo habría solicitado los datos de su cuenta a los servidores. Estos datos incluirían a las personas a las que sigues, sus tweets y la línea de tiempo que Twitter te mostraría. No haría que las flotas aparecieran por adelantado, ya que la aplicación prioriza un determinado conjunto de información a través de las API para poder renderizar a tiempo, lo cual es responsabilidad del front-end para que no se sienta frustrado y abandone la aplicación.
Piense en las API como personas que tienen información necesaria para realizar su trabajo. Algunos le darían la información con bastante rapidez y otros se tomarían su tiempo. La aplicación no puede bloquear su camino esperando que lleguen los datos y luego mostrarlos en la pantalla. Por lo tanto, todo esto sucede de forma asíncrona. Las partes de la aplicación se representan a medida que llegan los datos. Por lo tanto, como diseñadores, es importante comprender este cuello de botella y tener en cuenta la función del tiempo al diseñar”, agregó Sidharth.
Los efectos de las páginas de carga lenta están muy bien documentados. Es más probable que los usuarios abandonen una página de destino si la página no está optimizada para la velocidad. Los usuarios pueden detectar los retrasos del orden de 1/10 de segundo según el Grupo NN, que cita las reglas básicas de la percepción humana del tiempo. Entonces, los efectos de una página de carga lenta son bastante instantáneos. Las mejoras incrementales en la velocidad dan sus frutos.
La mejor manera de entender estas ideas podría ser usar tus superpoderes como a los diseñadores les gusta la empatía. Podría implementar un modelo mental de tener front-end y back-end siendo personas y hablando entre sí para hacer el trabajo.
TRANSMITE LA SESIÓN AQUÍ
Sistemas de diseño escalables
“Es necesario comprender cómo funciona la ingeniería para finalmente llegar a los sistemas”, explicó Sidharth. Según él, algunos de los problemas de viabilidad del diseño podrían resolverse mediante hacks, pero hace que sea más probable que estas correcciones de diseño desaparezcan con el tiempo. Es por eso que Sidharth pone el foco en el sistema de diseño.
“La interfaz de usuario parece fácil porque no lo es. Los diseñadores dedican innumerables horas a descubrir la interfaz de usuario. Para que te parezca fácil con todas las complejidades ocultas”, dijo Sidharth mientras presentaba a la audiencia la importancia de los sistemas de diseño y cómo incluso los diseñadores senior no entienden que sus sistemas se encaminan hacia el fracaso.
Puso el ejemplo de las historias de Instagram para entender mejor los sistemas de diseño. Por lo general, uno diría que las historias en la parte superior son solo una serie de círculos sin darse cuenta de cómo esos círculos que también se pueden desplazar infinitamente representan diferentes acciones del usuario y opciones del sistema.
“Es fácil hacer círculos y hacerlos equidistantes. Diseñar teniendo en cuenta los estados hace que el sistema sea extensible”, agregó al contar cómo él y su equipo en Headout han estado pensando en las ideas de estados y variaciones para los componentes de la interfaz de usuario incluso antes de que Figma introdujera una característica recientemente para administrarlos y crearlos.
Ahora hay varias elecciones que puede hacer sobre las historias como usuario. Puede crear uno nuevo, ver las historias de otras personas o subirse a Instagram en vivo. También hay cierta lógica de interfaz de usuario que se ha solucionado. Por ejemplo, las historias que viste se pueden volver a ver hasta que estén disponibles al final del desplazamiento superior. Podría haber múltiples vidas en marcha, que también deben estar representadas.
Las elecciones hechas por el usuario en estos casos son los estados del elemento, como los estados visibles y no vistos de las historias, y las elecciones impuestas por el sistema son variaciones, como si alguien está en vivo, si ha visto su propia historia o no.
También hay aspectos del diseño de movimiento incorporados en las historias, cuando toca cualquiera de las historias que aún no ha visto, hay puntos rojos que dan una vuelta alrededor del círculo mientras carga las historias. Estas interacciones son tan fluidas que apenas las notamos.
Instagram también tiene su filosofía de diseño y guías de estilo. La lógica de la interfaz de usuario también forma parte del propio sistema de diseño. Por ejemplo, cada vez que el usuario escribe en un campo de entrada, la entrada debe validarse en algunos casos. Un flujo constante de mensajes de error mientras el usuario escribe es demasiado molesto. En este caso, el equipo de ingeniería debe estar a bordo con el flujo de la lógica de interacción para que obtengan la experiencia del usuario correcta. Aparte de esto, la localización del contenido para una nueva demografía de los usuarios también debe tenerse en cuenta en el sistema de diseño. Tener en cuenta todas las ideas mencionadas anteriormente hace que un sistema de diseño sea verdaderamente escalable.
Ya sea haciendo preguntas a partir de los datos que desbloquean los conocimientos que llevan el producto al siguiente nivel, o hablando en el idioma de los ingenieros para optimizar los diseños para el rendimiento y luego hacer que el producto sea verdaderamente escalable, estas habilidades son definitivamente imprescindibles en el diseño de un diseñador. conjunto de herramientas para llevar sus carreras a nuevas alturas.