42

Cómo ha evolucionado el modo oscuro

153Puntos

hace 2 meses

Curso de Diseño en Modo Oscuro
Curso de Diseño en Modo Oscuro

Curso de Diseño en Modo Oscuro

Aprenderás las claves del diseño Darkmode, no solo a aplicar los preceptos de diseño a nivel visual, sino a entender la viabilidad e idoneidad de los diferentes componentes, estilos y requerimientos para asegurar la mejor experiencia de uso de un producto digital a los usuarios/as. Diseñarás tu propia App en modo oscuro, utilizando la herramienta Figma y aprenderás cómo utilizar esta fantástica herramienta para el diseño de Apps en darkmode tanto para iOS como para Android.

Es curioso cómo nos vamos adaptando a la realidad en la que vivimos y perdemos la perspectiva del pasado. Tendemos a pensar que la manera en la que percibimos el mundo es la realidad, y, sin embargo, simplemente es una interpretación subjetiva de lo que está ocurriendo en el momento.

Ahora nos parece imposible que, tiempo atrás, los seres humanos pudieran comunicarse o citarse para ir a comer o tomar algo, sin concertarlo vía WhatsApp. O que para buscar información, tuvieran que recurrir a una enciclopedia en papel. Pero, espera, ¡ese pasado no es tan lejano!

En el campo de la tecnología esta sensación todavía es mayor. En un sector tan cambiante, el sentir demasiada comodidad del presente y sus herramientas puede hacernos sentir incómodas cuando pasa el tiempo.

Y el mundo del diseño digital y de interfaces no escapan a esta sensación. Como diseñadores nos acostumbramos a las tendencias, a mirar distintas páginas de diseño y a repetir los mismos patrones continuamente. Casi sin darnos cuenta, volvemos a tendencias anteriores y revisitamos ideas y conceptos.

¡Esto no es necesariamente malo, al revés!  Sólo mirando de dónde venimos, podemos llegar a saber hacia dónde queremos dirigirnos. Y esto es, precisamente, lo que pasó con el modo oscuro.

Cómo surge el diseño en modo oscuro

En el caso del diseño en modo oscuro, entender cómo ha ido evolucionando la tecnología que soporta nuestros diseños es fundamental para aprender cómo podemos potenciar los colores para emocionar y conectar mejor con los usuarios/as o cómo saber dejar elementos secundarios en un segundo plano.

Si nos remontamos a la historia del diseño de interfaces; conocer por qué se pasó de interfaces sobre fondo negro y con texto verde, a interfaces en las que los diseñadores intentabamos copiar el mundo real, es clave.

En 2008 con las primeras interfaces de iOS, Apple reimpulsó el esqueumorfismo. Esta tendencia añadía detalles de los objetos originales en los íconos, como el antiguo logo de Instagram como una cámara de instantáneas. Convenientemente, decidieron eliminarlo con iOS 7 en 2013.

En cualquier caso, en las primeras interfaces que podríamos denominar esqueumórficas, en las de Xerox Parc y Apple se aprecia ese intento de acercar el mundo real a los usuarios/as para facilitarles el uso de esas primeras computadoras.

Las limitaciones tecnológicas que nos ofrecían los monitores del momento marcaron en parte el diseño de interfaces.Por una parte existía una limitación en los colores que se podían plasmar, y a medida que la tecnología iba avanzando, surgió la posibilidad de incorporar más colores, más gradientes y más sombras.

Esto fue así hasta el momento en el que la tecnología permitió a las personas que dedicaban su vida profesional al diseño, tener libertad absoluta con la tecnología vinculada a los monitores en color. Por fin pudimos plantearnos esas interfaces de fondo oscuro para destacar los elementos que se consideren más importantes. O simplemente jugar con sombras y tonalidades de fondos en una interfaz “light”

MODO OSCURSO.png

Los colores en darkmode

Y hablando de los colores, mencionaba antes la importancia de usar los colores a la hora de diseñar para conectar mejor con nuestros usuarios. Es importante recordar que diseñar interfaces es un modo de comunicarnos con nuestros usuarios y darles las guías para que moviéndose por la  pantalla puedan conseguir lo que el producto tiene que ofrecerles.

Y eso lo conseguimos no solo con una buena experiencia de uso y jerarquía de los elementos, sino también saber manejar colores que, como diseñadores, elegimos en nuestros proyectos.

Para llegar a conseguir que nuestro proyecto o producto brille, tenemos, no solo que entender a nuestros usuarios como entes independientes, sino como personas que viven en un entorno y en un mundo de eterno cambio.

Dentro de este eterno cambio en el que vivimos, el mundo no es estático. La vida siempre avanza. Nos vemos en medio de las modas, de los relanzamientos y nos atrapan los pensamientos de “si la competencia tiene esto hecho así yo también lo quiero”. Esta necesidad de seguir la estela de otros puede ser referida a la competencia directa de nuestro producto digital, o simplemente de otras grandes aplicaciones de uso cotidiano.

Vuelvo a hablar de la moda de los diseños oscuros en las interfaces porque a veces este mundo cambiante al que hacía referencia nos impide tener foco en los fundamentos de nuestra labor como diseñadoras. Esta labor tiene que estar siempre basada en tres factores:

  • Dar oídos y forma a lo que los usuarios quieren.
  • Entender en qué momento tiene o no sentido usar un modo u otro.
  • Respetar los requisitos básicos de accesibilidad y de usabilidad en todo momento.

Relacionado con estos factores, están las 3 ventajas que, generalmente, nos aporta el modo oscuro y que nos ayuda a mejorar los productos:

  • La sensación de innovación del producto
  • Ofrecer una experiencia personalizada al usuario
  • Dar un diseño universal

Como diseñadoras, ¿pensamos siempre en nuestros usuarios/as o nos dejamos guiar por lo que nos apetece hacer?

Pensando en todo esto, he creado un curso que junte historia, usuario, usabilidad y accesibilidad para que cualquier persona pueda ejecutar un diseño en modo oscuro siendo conscientes de lo que aporta y de sus limitaciones.

Invitación especial: Una vez veas este curso, te invito al taller personalizado y remoto con Torresburriel Estudio que tendremos el martes, 5 de octubre a las 10am (COL). Solo debes haber realizado el curso e inscribirte previamente. Pronto te compartiremos por aquí el formulario de inscripción.

¡Nos vemos en la primera clase!

Curso de Diseño en Modo Oscuro
Curso de Diseño en Modo Oscuro

Curso de Diseño en Modo Oscuro

Aprenderás las claves del diseño Darkmode, no solo a aplicar los preceptos de diseño a nivel visual, sino a entender la viabilidad e idoneidad de los diferentes componentes, estilos y requerimientos para asegurar la mejor experiencia de uso de un producto digital a los usuarios/as. Diseñarás tu propia App en modo oscuro, utilizando la herramienta Figma y aprenderás cómo utilizar esta fantástica herramienta para el diseño de Apps en darkmode tanto para iOS como para Android.
meri
meri
minimeri

153Puntos

hace 2 meses

Todas sus entradas
Escribe tu comentario
+ 2
Ordenar por:
6
14706Puntos

Muy interesante saber eso, soy uno de los fans de que mis apps tengan modo oscuro, y me encanta saber como se origino!

3
5849Puntos
2 meses

igual 😄

5
31599Puntos

Un curso de diseño excelente. Eres una gran profe. 😁 Saber el contexto histórico es increíble. ¡Muchas gracias!

1
153Puntos
2 meses

Gracias a ti por tus palabras, iris!

3
20541Puntos

Lo nuevo que aprendí en este blog:

  • La sensación de innovación del producto

  • Ofrecer una experiencia personalizada al usuario

  • Dar un diseño universal

Mi pregunta es ¿Qué productos digitales actuales no es conveniente el modo oscuro y porqué?

2
2232Puntos
El modo oscuro es mi favorito y es interesante saber un poco sobre la historia de algo que usamos todos los días
2
1639Puntos

Super interesante y de gran aporte en el diseño ¡Me encanto!
Como diseñadores debemos de seguirle el paso a los avances tecnologicos y tendecias, y pues soy muy fan del modo oscuro jaja.
Exelente!

2
9124Puntos

Personalmente me gusta más el modo oscuro siento que es muy cómodo para leer y no ten cansa tanto la vista como el modo de día.

2
9124Puntos

No soy en único que siente que en el desarrollo web lo puedo ver como un lienzo en blanco donde puedes plasmar tu creatividad o dejar que tus usuarios lo cambien conforme sus gustos como una pintura interactiva