Cómo mejorar mi UI y habilidades de diseño visual

Los libros mencionados anteriormente son geniales, pero recomendaría buscar inspiración y orientación directa e indirectamente.

Directamente: mira a Behance y Dirbbble. Elija entre 3 y 5 diseñadores de UI que le gusten y que tengan una estética y enfoques visuales similares. Estudíelos, observe cómo desarrollan un lenguaje visual y un sistema de diseño. Observe los patrones de lo que le gusta y lo que no le gusta: informe su gusto y apreciación de lo que han hecho, y úselo para inspirar un proyecto en el que siga su ejemplo. Extrapola sobre sus ideas y eventualmente hazlas tuyas. Una vez que desarrolle un estilo más refinado e independiente, continúe repitiéndolo con otros estilos para construir un repertorio.

Otra gran fuente es mirar ‘estudios de caso de rediseño’ donde se desglosa una revisión de una aplicación de nuevo diseño

  • Estudio de caso de Lyft Re-design
  • El nuevo diseño de nuestra aplicación
  • Uber simplemente agilizó su aplicación

Estos estudios de caso le dicen por qué cambió la interfaz. Cómo las necesidades del usuario, el comportamiento del usuario, los objetivos comerciales y las restricciones informaron la dirección de UX y UI. Mejorar las habilidades de la interfaz de usuario significa tomar decisiones basadas en métricas, cambios de comportamiento y usabilidad. Bonito por el bien de bonito no es un buen diseño.

Entonces: mejore su gusto aumentando su cartera de inspiración y profundizando su familiaridad con los detalles matizados de por qué le gusta lo que admira.

En cuanto a las habilidades de diseño visual, observe las bellas artes y el diseño gráfico. Elija una era o género para comenzar y observe los patrones de diseño, color, tipografía, metáforas visuales, contenido, etc. Existen convenciones que han sido desarrolladas y utilizadas por diseñadores exitosos en el pasado. Finalmente desarrollarás tu propio dialecto, pero debes aprender los conceptos básicos del idioma que ya hablan visualmente. Es posible que algún día puedas crear tu propio estilo, pero por ahora, mientras aprendes, aplícate y construye a partir de los demás. Aprende las reglas antes de romperlas. El diseño de la interfaz de usuario se trata de mostrar información y controles para modificar esa información. Una excelente manera de comprender la disciplina requerida para crear un diseño de información sorprendente es estudiar los escritos de Edward Tufte.

En la interfaz de usuario, el uso de patrones de diseño es más importante que en el diseño gráfico. Ciertos íconos se han convertido en convenciones estándar, y el uso de construcciones visuales ampliamente entendidas mejora la usabilidad y ayudará a los usuarios a alcanzar sus objetivos de una manera más agradable y eficiente.

El primer paso para aprender cualquier habilidad de diseño es primero cultivar la habilidad de percibirla con gran detalle. Luego puedes volver a crearlo y finalmente generar un nuevo trabajo con esas habilidades.

Por lo tanto, le recomiendo que comience por recopilar ejemplos de interfaz de usuario y diseño visual que le atraigan personalmente. Hay muchas buenas herramientas interactivas para recopilar imágenes, pero también puede tomar capturas de pantalla cuando algo llama la atención.

Una vez que tenga un puñado de estos, mírelos juntos: ¿qué patrones encuentra en medio de su colección? ¿Quizás hay combinaciones de colores que ocurren una y otra vez, o enfoques particulares de la jerarquía visual?

Cuando tenga una idea de los elementos de diseño visual que le gustaría poder crear usted mismo, intente recrearlos, píxel por píxel, esto lo ayudará a desarrollar la facilidad con las herramientas que elija para crear algo sin tener para generar ideas novedosas al mismo tiempo. ¡Buena suerte!

Estuve en la misma posición hace 6 a 7 años. Me resigné a decir siempre “Puedo hacer el diseño visual, pero no es donde soy realmente competente …”

Pero luego comencé a trabajar con un grupo de jóvenes diseñadores y sentí que el diseño visual se hizo más accesible para mí, tanto en el sentido real de ver a muchos diseñadores trabajando, como en el sentido de que si estos jóvenes pudieran hacer esto, ¿por qué? no pude? Luego trabajé brevemente con un gran diseñador visual y aprendí a amar el diseño de cosas como esta caja en la que estoy escribiendo, absolutamente obsesionada con los espacios en blanco, la proporción, las fuentes, el ruido visual, etc.

Luego aprendí a “codificar” estas cosas (casi literalmente) en un buen marco HTML / CSS donde cualquier tamaño de pantalla en el que aparecía el diseño, las proporciones eran hermosas, los colores elegantes y significativos, etc.

Los únicos libros que utilicé fueron todos los libros de Edward Tufte (genial, pero ciertamente no toda la historia). Pero mi punto real aquí es que a) tuve que decidir conscientemente ir a por ello, b) aprendí más de la mitad trabajando con otros diseñadores, yc) el resto lo aprendí de mi propia experimentación (que está en curso 🙂

Buena suerte.

Hay un par de cosas que hacer:

Comenzaría con algunos de los conceptos básicos sobre diseño. Un libro bueno y de fácil acceso es de Robin Williams, The Non-Designer’s Design Book. Otro libro que recomiendo es el Diseño de interacción interdisciplinaria. Se trata más del espacio digital.

Si quieres enfocarte específicamente en el diseño de aplicaciones, hay un buen curso de Udemy, llamado Sketch 3 de la A a la Z: conviértete en un diseñador de aplicaciones. (El nombre cambió desde que tomé el curso sobre cómo enfocarme específicamente en Sketch), pero tiene buenos principios de interfaz de usuario y cómo enfocarse en el diseño de aplicaciones.

Luego están los detalles como tipografía, color, principios específicos del sistema operativo, etc.

Para la tipografía, puede consultar el curso de Lynda.com sobre tipografía. Para el color, echa un vistazo a Josef Albers.

Lea siempre las especificaciones de diseño del sistema operativo, como Google Material Design y las Directrices de interfaz humana de iOS.

¡Espero que ayude!

Recomiendo estudiar Arquitectura de la Información. Un diseñador de UI nunca puede hacer justicia a ninguna interfaz, si no puede estructurar el contenido y su diseño de la manera más eficiente.

Las mejores interfaces no se juzgan en función de cómo se ven, sino de qué tan bien funcionan para completar la tarea central. Por ejemplo, echa un vistazo a Tumblr. El backend de tumblr es realmente simple. No tiene que ir al área de redacción para crear una publicación de blog. Inmediatamente eligió el tipo de publicación que tiene, y ya casi ha terminado. Es por eso que han sido galardonados con la mejor experiencia de usuario y de interfaz de usuario para blogs y CMS durante años. Porque se centran en las necesidades primarias de sus usuarios … para publicar contenido.

Del mismo modo, mira a Medium ahora. Se centran en artículos escritos. Entonces, cuando inicias sesión, estás haciendo exactamente eso. Escritura. Nada más. La simplicidad es el camino a seguir, en términos de interfaz de usuario.

Puede intentar usar un software de diseño de marco de alambre para aprender con las prácticas.

Cree asombrosos wireframes y acelere el trabajo de documentación con el optimizador de wireframes. Con el kit de estructura metálica masiva para iPhone, iPad, Android y Windows, puede dibujar estructuras metálicas atractivas en cualquier momento y en cualquier lugar. 1 clic exportará la estructura alámbrica a muchos otros formatos. Incluso los principiantes pueden manejarlo sin esfuerzo ya que la interfaz es similar con MS Word. Además, permite el almacenamiento de datos en nubes, ayudando a los miembros del equipo a compartir, revisar y coeditar documentos.

Puede encontrar más de 600 símbolos comunes en total para el diseño de la estructura metálica del sitio web, la estructura de Android, la estructura de iPhone, la estructura de iPad, la estructura de Windows 7 y más. Los símbolos están diseñados con alta fidelidad y también son flexibles para modificar el tamaño y el color. Estos símbolos de estructura metálica lo ayudarán a completar estructuras de alta calidad con el menor tiempo.

La interfaz de usuario / diseño visual tiene muchas similitudes con el diseño gráfico. Ambos requieren una gran comprensión al trabajar con cuadrículas, jerarquía, tipografía y color, entre otras cosas.

Mi carrera comenzó en diseño gráfico y se convirtió en diseño visual. Puedo decirle que muchos de los principios que aprendí en la impresión hace 20 años, todavía se aplican hoy en la creación de UI y experiencias de usuario.

Hay excelentes respuestas en este hilo … Debo agregar … realmente, realmente entiendo y uso la tipografía en todo su potencial. Mirar:

Mejor tipografía web para una mejor web.

Y

Curso de diseño gratuito

Específicamente el libro Diseño para hackers. Incluso como diseñador experimentado, lo uso todo el tiempo para educar a las partes interesadas, clientes, directores ejecutivos … quien quiera escuchar.

Una forma de mejorar sus habilidades de diseño de la interfaz de usuario es utilizar un software de estructura de alambre para diseñar su aplicación antes de comenzar cualquier desarrollo. Esto le permitirá ver todo el flujo de su aplicación y cómo el usuario interactuará con la aplicación. Yo personalmente uso JustInMind cuando diseño un sitio web o una aplicación móvil. Si está trabajando para otra persona, esta es una buena manera de mostrarles o diseñar antes de escribir cualquier código.

Otra forma de mejorar sus habilidades de interfaz de usuario es mirar aplicaciones similares en el mercado y ver cómo diseñaron su interfaz de usuario. Siempre es agradable ver cómo otros diseñadores implementaron su interfaz de usuario.

Regrese a los fundamentos. Siempre ayuda aprender los conceptos básicos. Comience con un curso gratuito como

Sería sorprendente si ha estado haciendo diseño UX sin tener que hacer un diseño visual / UI, pero suponiendo que no tenga experiencia en esta área, sugiero que la mejor manera es ver cómo termina el trabajo que hace en el diseño UX como decisiones de diseño o razones de diseño utilizadas por las personas que implementan los diseños visuales / de interfaz de usuario. Esa es la mejor manera de entender la relevancia de su trabajo para el diseño visual / UI, y desde allí puede adquirir gradualmente las habilidades y herramientas necesarias para hacer el trabajo.

Intente implementar lo que cree que disminuirá los clics de su mouse.

Su aplicación se juzga por los primeros 25 segundos que el usuario pasa en ella. Si no le gusta, puede perder su interés.

Los clics mínimos del mouse con el máximo atractivo sin arriesgar la simplicidad son la clave.