Moodinary/UI
MOODINARY UI

El mismo cielo de la landing, ahora en piezas que podés usar.

Moodinary UI

Los componentes, tokens y reglas con los que está hecho Moodinary, documentados para que cualquiera construya pantallas que se sientan parte del mismo producto.

Moodinary mide el clima emocional de equipos, escuelas y organizaciones con pulsos anónimos de diez segundos. Este sistema es lo que hace que el formulario de quien responde, el panel de quien coordina y el informe impreso de una empresa se vean y se comporten igual.

Todo lo que ves acá es código real: los ejemplos usan el mismo paquete @moodinary/ui que podés instalar.

Un pulso de diez segundos de un lado, el clima del grupo del otro.

Estos son los componentes reales, conectados. Elegí un nivel y mirá cómo cambia el panel. Con menos de ocho pulsos en siete días aparece la niebla.

EEEquipo de ejemplo

¿Cómo te sentiste hoy?

Elegí un nivel. Nadie sabe que fuiste vos.

Panel · Equipo de ejemplo
Parcial

Promedio 3,7 con 11 pulsos.

Nivel promedio
3,7
Parcial
Pulsos
11
últimos 7 días

Por dónde empezar

Instalá el paquete, copiá un componente del registry o usá solo los tokens.

  1. 1InstalaciónPaquete npm, registry de shadcn y tokens CSS.
  2. 2FundamentosColor, tipografía, espaciado, radios e íconos.
  3. 3MarcaLogo, color, tipografía, ilustración, voz y aplicaciones.
  4. 4SpritesCielo, nubes, niebla y texto en píxeles, listos para animar.

Íconos en píxeles

Dibujados en una grilla de 16, en dos tonos. Pasá el mouse para ver el nombre.

Principios

Si no ayuda a entender cómo está la gente, no va.

  1. El color significa algo.

    Un tono por significado. El ánimo se pinta solo con la rampa de cinco niveles.

  2. Nada decorativo sin función.

    El grano casi invisible es la única excepción.

  3. Datos honestos.

    Los períodos sin pulsos se ven como huecos y toda proyección muestra su incertidumbre.

  4. Voz humana.

    Español rioplatense, oraciones completas, decimales con coma.

  5. Anonimato primero.

    Nada en la interfaz identifica a quien responde.

Componentes

66 piezas, agrupadas como en el panel.