Saltar al contenido principal

LEYES UX / UI PARA DISEÑADORES

El Protocolo Binario. Un icono visual inyectado sin contexto es solo ruido indeseable. Para mantener la cohesión y la majestuosa belleza algorítmica de nuestra marca mundial, estás obligado como creador de contenido a obedecer estas reglas matemáticas al implementar componentes vectoriales en tu Viewport.


📏 1. Tolerancia Cero al Mix Perimetral (Resoluciones)

Jamás emparejes estúpidamente estilos que existen en ecosistemas diametralmente distintos. No encimes ni agrupes visual y cercanamente un burdo Ícono de un Cofre en Pixeles (8-Bit Mode) interactuando en el mismo plano focal con un minimalista botoncito vectorial finísimo (Neón SVG).

  • El Pixel Art exige por naturaleza vastos espacios vacíos alrededor de su propia caja para "respirar su pesada estructura cuadrada" (Padding Matrix).
  • Las finas líneas vectoriales Web exigen agruparse matemáticamente entre ellas cerca de limpios Strings de texto o código. Nunca las mezcles.

🎨 2. Color Coding System (Identificadores Visuales)

El pintado de nuestros valiosos íconos jamás es al azar o porque combinan bonito. Las variables cromáticas tienen su semántica purpósea inyectada; el color en los SVG debe ayudar al usuario instantáneamente a saber qué sucede.

>_ ACCIÓN (VERBOS)

Para iconos limpios navegables (Enviar Datos, Scroll Abajo, Buscar String, Link URL).

Cyan Eléctrico

HEX#00F0FF
RGBrgb(0, 240, 255)
RGBArgba(0, 240, 255, 0.9)
HSLhsl(184, 100%, 50%)
HSLAhsla(184, 100%, 50%, 0.9)

>_ ALERTA (FATAL ERRS)

El modo Pánico de Sistema (Errores de Formulario web vacíos, Eliminar Proyecto, Bloqueo de Acceso Seguro).

Rosa Ajolote

HEX#FF2A6D
RGBrgb(255, 42, 109)
RGBArgba(255, 42, 109, 0.8)
HSLhsl(341, 100%, 58%)
HSLAhsla(341, 100%, 58%, 0.8)

>_ ÉXITO (THE WINNER)

La dopamina. Cuando algo corrió como magia (Test Aprobado en Escuela, Pago Completo Realizado con Éxito, Logros obtenidos).

Verde Terminal

HEX#05FF00
RGBrgb(5, 255, 0)
RGBArgba(5, 255, 0, 0.9)
HSLhsl(119, 100%, 50%)
HSLAhsla(119, 100%, 50%, 0.9)