Orange UI (Mobile)

OrangeUI nace como respuesta a un problema claro: la inconsistencia visual en las soluciones digitales de Queo.

A partir de ese diagnóstico, comenzamos adoptando Tidewind UI como base visual —una librería inspirada en Tailwind CSS— que nos permitió elevar la estética general y establecer un primer nivel de coherencia entre productos.

Sin embargo, pronto entendimos que Queo necesitaba más que un sistema prestado: necesitaba una identidad visual propia, construida desde la marca.

Así iniciamos el diseño de OrangeUI, un sistema de diseño centrado en la experiencia móvil, con fuerte inspiración en Material Design y Human Interface, pero adaptado a nuestras necesidades. Se basa en accesibilidad (botones grandes, jerarquía clara), y una paleta cromática pensada para comunicar: un naranja energético como color principal, contrastes en negro y gris, y acentos secundarios como verde cítrico, magenta o azul, aplicados a diferentes módulos del ecosistema Queo (Green Sites, Workspaces, Parking, etc.).

El sistema está construido en Figma con enfoque atómico (Atomic Design), lo que nos permite escalar componentes desde átomos hasta organismos de forma modular. Integra además un sistema de voz y tono, tipografías renovadas (Avenir para títulos, Ubuntu Sans para cuerpos), y una arquitectura visual adaptable que acompaña el crecimiento de la marca.

OrangeUI es un ejemplo de cómo el diseño de producto puede y debe partir desde la identidad para escalar con consistencia y visión.