En los últimos meses he estado trabajando bastante en el diseño de prototipos con @figma
Hoy os quiero enseñar 5 tips muy útiles que he utilizado para diseñar un prototipo de aplicación al completo.
Si necesitas crear una paleta de colores rápida, quédate.
Dentro hilardo 🧵:
Yo no soy diseñador, pero como bien sabes, trabajar en una #startup es sinónimo de adaptarte y aprender para sacar las cosas adelante.
Necesitaba crear algo denominado System Color ( o sistema de colores por si no sabes ingléh) que viene a ser una guía de como usar los colores.
Como soy buena gente, he creado una paleta de colores para que veáis el proceso. Es mu sencillo.
1. Elige un color principal.
Te recomiendo que sea un color fácil de identificar y que no canse la vista.
He elegido este... ¿azul?: hsl(226, 35, 30).
A partir del color principal, vamos a crear toda la paleta.
2. Creamos sombras de colores.
Te recomiendo crear 4 sombras de colores, por lo que sería 4+1 = 5 -> 100/5 = 20.
Tenemos que ampliar 20% de sombra hasta llegar al negro absoluto.
Algo así 👇👇
3. Creamos tonos a blanco.
Para ello hacemos el mismo proceso que en el paso 2 pero con color blanco, en lugar de negro.
Quedaría algo así 👇👇
4. Creamos nuestra paleta final de colores.
Eliminamos el negro y blanco absoluto y creamos nuestra paleta completa de colores con la siguiente numeración y con el color principal en el medio.
5. Demos un sentido y un significado a esos números.
Ahora tenemos claro qué color usar y cuando.
Y listo! Ya tienes una paleta de colores rápida y sencilla, con la cual podrás empezar a crear tus prototipos y fallar cuanto antes!