Design system
Cómo se ve y se comporta Smart Mobius.
La referencia del producto para quien diseña, programa o hereda el proyecto. No es una copia: cada página lee el código de la app, así que lo que ves es lo que usa.
Principios
01Un archivo mandaColor, tipografía, espacio, forma y movimiento salen de design.css. Cambiar el aspecto del producto es tocar ese archivo, no una pantalla.
02Un lienzo con tarjetasEl área de trabajo es un plano gris; cada bloque es una tarjeta blanca encima. Lo que separa dos bloques es el aire entre ellos.
03Jerarquía por peso, no por cajaUna etiqueta va en versalitas para que mande el valor. Un total se distingue por aire y peso, nunca encerrado en otro rectángulo.
04El color dice el estadoVerde para lo que cierra, rojo para lo que urge, ámbar para lo que está por vencer. Nada decorativo: el resto hereda.
05La acción vive con su objetoLo que actúa sobre un bloque va en su cabecera. Crear siempre en el mismo lugar, para no buscarlo.
06El dinero se escribe igual en todas partesLa cifra manda y su moneda la acompaña; las cifras en columna se alinean con números tabulares.