Domar el gusto exigente: secretos de la interfaz de usuario para el proyecto Lumin

Domar el gusto exigente: secretos de la interfaz de usuario para el proyecto Lumin

Lumin es una plataforma de documentos que permite a los usuarios ver, editar y compartir documentos PDF sin problemas. Esto promueve la libertad de información y simplifica la colaboración al integrarse con el almacenamiento en la nube para un acceso universal a los documentos, independientemente de la ubicación. Lumin promueve aún más la transparencia y la rendición de cuentas al ofrecer firmas digitales seguras, garantizando la legalidad y aplicabilidad de contratos, acuerdos y otros documentos formales. Los ingresos anuales estimados de Lumin son actualmente de 12,9 millones de dólares al año. Se espera que esta cifra de ingresos siga creciendo en los próximos años. El éxito de Lumin no es sólo una cuestión de números; Se trata de empoderar a los usuarios y defender sus derechos. La meticulosa atención de nuestro equipo a la interfaz de usuario (UI) ha sido fundamental para impulsar el crecimiento de los ingresos. Priorizamos la creación de una plataforma que no solo sea fácil de usar sino que también esté equipada con funciones que mejoren la accesibilidad y promuevan experiencias inclusivas. Para comprender más sobre cómo Lumin diseñó su interfaz de usuario (UI) para generar confianza y una adopción más amplia, lea nuestro documento detallado y alentador sobre el tema. En este artículo veremos algunas tácticas y ejemplos que hemos utilizado para construir una plataforma que sea verdaderamente inclusiva y centrada en el usuario. Aprovechando los principios de diseño de Google Material 3 para su sistema de diseño y diseño UI/UX Durante los últimos dos años, hemos estado aplicando los principios de Google Material Design 3 en la construcción de nuestro sistema de diseño y diseño UI/UX. Optimizar eficazmente la organización y gestión del sistema de diseño entre equipos dentro del mismo proyecto, mejorar el proceso de transferencia del diseño a los desarrolladores y mejorar la experiencia interactiva del usuario del producto. Así es como el equipo de Lumin implementó los principios de diseño de Google Material 3: Material Design proporciona un conjunto de reglas y componentes estandarizados que lo ayudan a organizar y administrar fácilmente el sistema de diseño: Anteriormente, el sistema de diseño con el diseño del equipo de Lumin era solo un conjunto de pautas/componentes simples. Ahora, con reglas y métodos de organización más nuevos que utilizan variables Figma, el sistema de diseño se ha vuelto más detallado, con elementos consistentes que se pueden compartir entre múltiples diseñadores, lo que resulta en una mejor accesibilidad y UX. En el pasado, los diseñadores usaban aleatoriamente varios colores según sus preferencias, lo que generaba inconsistencias entre los equipos. (Al diseñador A le gustó el color 40, el diseñador B pensó que su diseño se adaptaba al color 60 y el diseñador C usó el color 10). En general, las interfaces de usuario carecerían de uniformidad y la combinación de colores podría tener un contraste insuficiente y, en algunos casos, resultar inadecuada. Con el nuevo sistema se estandarizarán los colores, se nombrarán y se definirán claramente sus funciones, contrastes y pautas de uso. Esto proporciona un conjunto detallado y claro de convenciones que permiten a los diseñadores utilizar los colores correctos para el propósito de diseño previsto. El diseño del token de diseño se aplicará a los siguientes componentes base. En el flujo de trabajo anterior, una vez que se completaba el diseño, los desarrolladores tenían que ver manualmente los archivos de diseño y elegir códigos/especificaciones de color para crear el CSS. Ahora, el equipo de diseño puede utilizar un complemento para exportar el proyecto como un archivo JSON, que los desarrolladores pueden utilizar directamente, lo que reduce la carga de trabajo del equipo de desarrollo. Los valores de los tokens serán precisos y estarán científicamente organizados para un uso conveniente. Creación de un diseño de interfaz multilingüe y multicultural para atender a una audiencia global Como parte del diseño de la experiencia del usuario (UX), es clave abordar los matices culturales y lingüísticos de los diferentes grupos de usuarios. Como diseñadores, es posible que no siempre compartamos los mismos antecedentes geográficos, culturales o industriales que nuestro público objetivo. Esto puede plantear desafíos importantes si no tomamos en consideración estos factores al llevar a cabo nuestros proyectos. Crear un producto sin comprender las sutilezas culturales y lingüísticas de nuestros usuarios puede generar problemas de usabilidad y, en casos graves, incluso ofender o alienar a ciertos grupos. Por ejemplo, recuerdo haber diseñado una aplicación básica de almacenamiento de archivos para estudiantes en el mercado estadounidense. A nuestro equipo le faltaba un escritor de UX y el propietario del producto no era estadounidense. A pesar de la investigación en línea y las entrevistas con los usuarios, todavía cometimos errores culturales y lingüísticos. El inglés americano tiene un vocabulario y convenciones de escritura distintos al inglés británico. Finalmente, confiamos en nuestros equipos de marketing y servicio al cliente en EE. UU. para revisar el lenguaje de la aplicación. Afortunadamente, con la llegada de las herramientas en línea y las soluciones basadas en inteligencia artificial, las barreras del idioma se han convertido en un obstáculo menor. En cuanto a consideraciones culturales, los usuarios occidentales generalmente prefieren un enfoque minimalista con botones claros y concisos. Nuestros diseños iniciales, influenciados por la estética del este de Asia, incorporaban detalles excesivos y pancartas coloridas, lo que podía abrumar a los usuarios. Para abordar esto, hemos implementado mecanismos de retroalimentación, como invitar a los usuarios a calificar y revisar la aplicación después de completar tareas clave. Cada mes revisamos estos comentarios y perfeccionamos la aplicación en consecuencia. Optimice la interfaz de usuario para la compatibilidad móvil Optimizar la interfaz de Lumin Document List para una capacidad de respuesta perfecta en todas las plataformas, desde el escritorio hasta el móvil, es fundamental para una experiencia de usuario fluida y consistente. A diferencia del vasto entorno de escritorio, los dispositivos móviles tienen un espacio de pantalla limitado. El objetivo es tener una apariencia consistente en todas las versiones en línea y móviles, reduciendo la necesidad de un diseño esencialmente personalizado por parte del equipo de desarrollo. El objetivo es garantizar que todo el contenido, los tamaños de los elementos y las llamadas a la acción sean fáciles de acceder y utilizar en dispositivos móviles. Dada la amplia gama de tamaños de dispositivos móviles, el diseñador debe trabajar con el propietario del producto para recopilar datos sobre las especificaciones de los dispositivos más pequeños utilizados por los consumidores. Estos datos ayudarán al equipo a identificar las funciones utilizadas con más frecuencia, lo que les permitirá optimizar el diseño móvil eliminando piezas superfluas. El proceso de diseño debe comenzar adaptando el diseño a dispositivos móviles más pequeños, asegurando que todas las características críticas sean visibles sin alterar el diseño. Los elementos importantes permanecerán en el diseño móvil, pero las características innecesarias quedarán ocultas. El tamaño de fuente, el tamaño del botón y la posición son elementos importantes a considerar al mostrarlos. Por ejemplo, en la versión móvil, el botón «Subir» podría transformarse en un botón flotante circular siempre visible en la esquina inferior derecha y fácilmente manipulable con el pulgar del usuario (con un área táctil mínima de 48 px, como se recomienda). . El producto final debe constar de dos versiones, web y móvil, con una identidad visual coherente, que promueva una experiencia de usuario unificada en todas las plataformas. Una vez que se completa el diseño, es fundamental probar la interfaz en una variedad de dispositivos móviles para obtener experiencia de primera mano y recibir comentarios sobre los cambios necesarios. Acepte los comentarios de los clientes y ofrezca soluciones convincentes Después de recibir comentarios de los usuarios sobre la funcionalidad de la interfaz de usuario de carga «Arrastre el archivo aquí» del documento Lumin, el equipo del cliente identificó varias áreas de mejora: La principal preocupación era que el diseño actual no era intuitivo para los usuarios. Muchos pensaron erróneamente que podían hacer clic en la ilustración para comenzar a cargar, cuando en realidad la única acción admitida era arrastrar y soltar archivos. Además, el tamaño de la ilustración y el diseño del texto subyacente significaban que todo el contenido no era fácilmente visible en pantallas de computadora más pequeñas, particularmente en dispositivos Windows. Para comprender mejor los problemas de la experiencia del usuario, el equipo realizó una investigación utilizando herramientas como Hotjar para analizar los recorridos y comportamientos de los usuarios. Esto proporcionó información valiosa y reveló que la mayoría de los usuarios de Lumin preferían cargar archivos directamente desde sus dispositivos locales en lugar de arrastrarlos y soltarlos. La evaluación comparativa de cómo otros sitios web han implementado funciones de carga de archivos también ayudó a informar el proceso de rediseño. Luego, el equipo trabajó con el propietario del producto para idear dos nuevos enfoques de diseño: uno manteniendo un elemento ilustrativo y el otro adoptando un enfoque más minimalista. Después de la revisión, el cliente finalmente eligió el diseño más simple y optimizado. Esta solución agrega un botón de carga dedicado y proporciona contenido educativo más claro al mismo tiempo que mantiene un diseño compacto que garantiza una visibilidad total incluso en pantallas más pequeñas. El objetivo era crear una experiencia de carga intuitiva y útil que permitiera a los usuarios cargar archivos rápida y fácilmente desde sus computadoras, la acción principal que suelen realizar. Al abordar los puntos débiles de usabilidad identificados a través de la investigación de usuarios, el equipo confía en que el nuevo diseño proporcionará una mejor experiencia general para los clientes de Lumin. Realice pruebas de usuarios para evaluar el rendimiento y la experiencia de la interfaz de usuario (UI). La realización de pruebas de usuarios en el mundo real es fundamental en el desarrollo de productos. Los puntos de datos que se muestran en tablas y gráficos no siempre abordan los problemas reales que experimentan los usuarios. Por ejemplo, cuando nuestro equipo rediseñó la interfaz de una aplicación sencilla para leer y compartir documentos. Antes de lanzarlo a los usuarios finales, realizamos sesiones de prueba de usuarios y resolvimos problemas clave de la experiencia, realizando cambios antes de pasar a las siguientes etapas del lanzamiento del producto. Al principio resultó difícil encontrar usuarios externos adecuados para las pruebas, ya que llevó tiempo reclutar a los participantes adecuados. Un principio clave es nunca poner a prueba a su equipo, ya que esto comprometería la objetividad. Los miembros del equipo ya están familiarizados con el producto, lo que genera resultados inexactos. Nos preparamos escribiendo un escenario de uso principal, pidiendo a los usuarios que lo siguieran paso a paso y proporcionaran comentarios en cada etapa. Después de las sesiones, para detectar pasos cruciales que eran problemáticos, los entrevistadores continuaron investigando a los usuarios para comprender sus dificultades específicas. El software que utilizamos fue Google Meet, que nos permitió grabar las pantallas de los usuarios durante las pruebas. Luego, estas grabaciones se revisaron para obtener información más profunda sobre el comportamiento de los usuarios. Después de las pruebas, descubrimos que la mayoría de los usuarios tienen dificultades para localizar el botón de descarga. Anteriormente, estaba posicionado de manera diferente, pero después del rediseño su posición cambió. Al analizar las grabaciones, notamos que los usuarios generalmente buscaban el botón de descarga en un menú, donde esperaban encontrarlo como en otras aplicaciones que usan comúnmente. Esto permitió a nuestro equipo optimizar la ubicación de los botones, mejorando la experiencia antes de lanzar el producto al público.

About Francisco

Check Also

Transformación de recursos en Akeneo – Blog Webkul

Transformación de recursos en Akeneo – Blog Webkul

En el mundo digital actual, la gestión de imágenes de productos y contenido multimedia para …

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *