A finales de 2020, en el feed de cualquier comunidad de diseño UI empezaron a aparecer mockups con un mismo lenguaje visual: superficies translúcidas con blur de fondo, bordes sutiles, sombras suaves. La estética imitaba cristal esmerilado o vidrio escarchado, y muy pronto recibió un nombre: glassmorphism. El acuñador del término fue Michał Malewicz —el mismo diseñador polaco que un año antes había popularizado el neumorfismo en otra publicación viral.
La coincidencia de autoría merece atención. Malewicz propuso dos estéticas en menos de doce meses, formalizadas con el mismo método (artículo en plataforma de medios de diseño + ejemplos visuales virales en Dribbble). Las dos estéticas tuvieron acogida inicial similar. Las dos enfrentaron problemas operativos parecidos en accesibilidad. Y, sin embargo, sus destinos han sido radicalmente distintos. El neumorfismo se extinguió del producto real en menos de tres años. El glassmorphism, cinco años después, sigue presente en sistemas operativos top y conserva cierto seguimiento profesional aunque con matices.
¿Qué explica la diferencia? Conviene desglosarlo, porque la respuesta dice más sobre cómo sobreviven las estéticas digitales que cualquier análisis individual de cada una.
La estética y su atractivo inicial
El glassmorphism propone un lenguaje visual con tres elementos combinados: fondo difuminado (background blur), transparencia parcial del componente, borde sutil que distingue la pieza del resto del lienzo. La combinación produce sensación de profundidad —el ojo lee el componente como elemento elevado sobre lo que tiene detrás—, sin recurrir a sombras pronunciadas ni a relleno de color sólido.
El antecedente histórico es claro. Apple introdujo blur translúcido en macOS Yosemite (2014), iOS 7 (2013) y posteriormente en iOS 11+ con materiales como el Vibrancy. Microsoft hizo algo similar con su lenguaje Fluent Design (2017). Cuando el término “glassmorphism” se popularizó en 2020, en realidad estaba etiquetando lenguaje que llevaba seis o siete años en el sistema operativo de Apple, ahora aplicado por diseñadores web y de producto fuera del ecosistema OEM.
El atractivo inicial del estilo era doble. Visualmente, producía piezas con sensación de modernidad y ligereza que el flat extremo había perdido. Funcionalmente, introducía profundidad sin volver al skeuomorphism —no había texturas simuladas, había transparencia material—. Era posición intermedia entre el flat puro y el realismo decorativo, en línea con la dirección que iOS y macOS habían tomado años antes.
Lo que funciona del glassmorphism
Hay contextos donde el glassmorphism aporta valor real. Conviene reconocerlos antes de pasar a las críticas.
Como acento sobre fotografía o vídeo de fondo. Cuando una interfaz tiene contenido principal multimedia (fotografía, vídeo, mapa), las superficies de información (controles, etiquetas, panels de información) se benefician de translucidez. El usuario percibe el contenido principal continuamente y los elementos UI se integran sin tapar visualmente lo que importa. Aplicaciones de fotografía, edición de vídeo, navegación, streaming, son contextos donde el glassmorphism funciona naturalmente.
Como diferenciador puntual de jerarquía. Una notificación que aparece sobre la interfaz, un panel modal que se levanta para una acción específica, una barra de control que flota sobre contenido: en estos contextos, el glassmorphism comunica visualmente que el elemento es temporal o superpuesto. Es metáfora del cristal sobre la mesa: ves a través, pero ves también el cristal.
Como acabado para superficies fijas en sistemas con fondo dinámico. Si la interfaz cambia de fondo (modo claro/oscuro automático, fondos personalizados, fondos animados), las superficies de cristal se adaptan al fondo cambiante con coherencia visual. Es una de las pocas estéticas que sostienen sistemas con fondo variable sin necesidad de reglas complejas.
En estos tres contextos, el glassmorphism no es decoración: es decisión funcional con beneficio operativo claro.
Donde rompe: el problema de accesibilidad
El problema mayor del glassmorphism aparece cuando se aplica como sistema completo en lugar de como acento puntual. La razón es accesibilidad cromática.
El análisis de Nielsen Norman Group y otras fuentes técnicas señalan el problema central: la transparencia y el blur reducen el contraste efectivo entre texto y fondo a niveles que pueden caer por debajo de los umbrales WCAG. El estándar WCAG 2.1 marca 4.5:1 como mínimo para texto normal y 3:1 para texto grande. Un componente de glassmorphism mal calibrado, con texto blanco sobre fondo translúcido sobre fondo variable, puede caer al 2:1 o 1.5:1 dependiendo de qué hay detrás.
Cuando esto ocurre, los usuarios con baja visión, fatiga visual, condiciones de luz adversas (pantalla con reflejo, brillo bajo de batería) tienen dificultades para leer. El componente que en el mockup se ve elegante puede ser invisible en uso real para una proporción significativa de usuarios.
La fricción es operativa, no cosmética. Y se agrava cuando el blur es dinámico (depende del fondo que esté detrás): el diseñador no puede prever todos los fondos posibles, así que tiene que asumir el peor caso o introducir lógica adicional que ajuste contraste según fondo. Las dos opciones son operativamente costosas.
Donde rompe: el coste de rendimiento
El segundo problema operativo es performance. El blur de fondo en tiempo real es operación gráfica costosa. La GPU tiene que renderizar lo que hay detrás del componente, aplicar filtro de blur con parámetros específicos, componer el resultado con la transparencia del componente y dibujar todo. En dispositivos móviles modestos —que siguen siendo amplia mayoría del mercado mundial—, esa operación produce caída visible de framerate.
iOS y macOS resuelven el problema en parte mediante hardware optimizado y APIs nativas (UIVisualEffectView en iOS, NSVisualEffectView en macOS). Aplicaciones que usan estas APIs nativas obtienen blur de calidad con coste razonable. Aplicaciones web que intentan replicar el efecto con backdrop-filter: blur() en CSS pagan coste de rendimiento que en dispositivos modestos es significativo.
La consecuencia operativa es que aplicaciones web con glassmorphism aplicado masivamente sufren degradación de rendimiento que puede notarse en scroll, animaciones, transiciones. Equipos que han intentado el efecto en producción han tenido que retroceder: aplicar blur solo en algunos componentes, reducir intensidad, o sustituir por colores semi-translúcidos sin blur.
Donde rompe: la facilidad de mal uso
Hay un tercer problema más sutil que merece atención. El glassmorphism es estilo fácil de aplicar mal sin saberlo. Una variación pequeña en blur, transparencia o fondo puede convertir un componente elegante en uno ilegible. Y, dado que los mockups de presentación suelen mostrarse en condiciones controladas (fondos seleccionados, sin contenido real), los problemas aparecen tarde, cuando el componente toca producción real.
El sector profesional ha desarrollado algunas reglas operativas para mitigar este riesgo:
- Aplicar el efecto solo a unos pocos elementos clave (barra navegación, botones primarios, tarjetas importantes), no a todos los componentes.
- Mantener intensidad de blur moderada (10-20px típicamente) para preservar legibilidad sin perder el efecto.
- Asegurar contraste mínimo de texto sobre componente glassmorphizado, calculado contra el peor caso de fondo posible.
- Probar el efecto con contenido real, no solo con fondos seleccionados.
Las reglas son razonables pero no siempre se aplican. Equipos que adoptan el estilo sin disciplina obtienen resultados estéticamente atractivos en presentación pero operativamente débiles en producción.
Lo que enseña sobre tendencias UI
El glassmorphism es ejemplo útil de una dinámica más amplia que afecta al oficio del diseño UI. Las tendencias visuales se popularizan rápido, generan mucho material en plataformas como Dribbble, Behance, Figma Community. Una vez popularizadas, se aplican a contextos donde funcionan y a contextos donde no funcionan, y la distinción entre uno y otro tarda en consolidarse.
Tres lecciones operativas para diseñadores en activo:
Las tendencias visuales no son recetas universales. Cada tendencia funciona en algún contexto específico. Aplicarla universalmente porque “está de moda” produce resultados subóptimos. Antes de adoptar un estilo, conviene preguntarse en qué contexto concreto aporta valor y en qué contexto no.
La accesibilidad debe ser filtro temprano, no corrector posterior. Un estilo que requiere trabajo adicional sustancial para alcanzar accesibilidad WCAG estándar tiene techo de aplicabilidad. Si el componente típico necesita verificación caso por caso, el estilo tiene fricciones operativas que se acumulan en proyectos grandes.
El rendimiento importa especialmente en mercados emergentes. Diseñadores de producto digital tienden a probar interfaces en hardware reciente. Pero gran parte del mercado mundial usa dispositivos con tres o cuatro años de antigüedad. Estilos que funcionan bien en iPhone 15 pueden ser frustrantes en Android de gama media. Probar el efecto en hardware modesto antes de adoptar es práctica que pocos equipos sostienen.
El estado actual: glassmorphism como acento maduro
Cinco años después de su popularización, el glassmorphism ha encontrado su lugar legítimo en el oficio. No domina sistemas completos como algunos predicaron en 2020-2021, pero tampoco se ha extinguido como predicaron los críticos más severos.
El estilo se ha asentado como acento puntual aplicable a componentes específicos en contextos donde aporta valor: barras de navegación que flotan sobre contenido, paneles modales temporales, controles superpuestos a fotografía o vídeo. En esos casos, sigue siendo solución elegante con buena recepción de usuario.
Donde no se ha sostenido es como reemplazo del flat refinado para sistemas completos. Material 3 sigue dominando Android, Apple Human Interface Guidelines sigue dominando iOS. Diseños web responsivos contemporáneos aplican glassmorphism con moderación, no como base.
Es probablemente el destino más razonable para una tendencia visual: incorporación al repertorio de soluciones disponibles, sin desplazar al lenguaje base. Diseñadores con buen criterio lo usan donde funciona y eligen otra cosa donde no.
Por qué glassmorphism sobrevivió donde neumorfismo no
Volvemos a la pregunta de la apertura. ¿Por qué dos estéticas propuestas por el mismo autor en el mismo año tuvieron destinos opuestos?
La respuesta tiene tres dimensiones que conviene articular.
Primero, el respaldo de plataforma. macOS, iOS, Windows 11 y Vision Pro incorporan elementos de cristal en sus sistemas operativos de manera nativa, con APIs específicas que resuelven internamente los problemas de accesibilidad y rendimiento. Apple lleva más de una década refinando blur translúcido (iOS 7 en 2013, Yosemite en 2014, todas las versiones posteriores). Microsoft incorporó “Mica” y “Acrylic” como variantes en Windows 11 (2021). Vision Pro (2024) lleva la estética al extremo en interfaces espaciales.
El neumorfismo nunca tuvo respaldo equivalente. Ningún sistema operativo lo adoptó como lenguaje base. Quedó como propuesta de diseñador individual sin infraestructura técnica detrás. Cuando los problemas de accesibilidad aparecieron, no había APIs nativas que los resolvieran; cada diseñador tenía que implementarlo a mano, y casi todos lo hacían mal.
Segundo, la barrera técnica como filtro. El blur en tiempo real requiere GPU. El sistema operativo lo gestiona con APIs optimizadas. Las aplicaciones que quieren replicar el efecto manualmente —especialmente en web— pagan coste de rendimiento alto. Esa barrera técnica funciona como filtro: las implementaciones serias usan APIs nativas o frameworks bien construidos; las implementaciones amateurs simplemente no llegan a producción porque rinden mal.
El neumorfismo no tenía esa barrera. Cualquier diseñador con Photoshop y CSS básico podía generar mockups y código. La accesibilidad amateur del trend fue precisamente lo que destruyó su reputación: miles de implementaciones mediocres en producción real.
Tercero, la metáfora visual sostenible. El cristal translúcido es metáfora física que el cerebro humano interpreta intuitivamente. Vemos cristal en el mundo real; entendemos que tiene profundidad, que deja pasar luz, que separa espacios sin ocluir. La estética digital basada en cristal hereda esa intuición.
El neumorfismo proponía metáfora más extraña: superficies blandas con luz sutil que evocaban juguetes de plástico. La metáfora era menos universal y, aplicada masivamente, producía sensación de juguete genérico antes que de interfaz adulta. Es diferencia sutil pero, sumada al resto, decisiva.
Una observación final
Para diseñadores que estudian tendencias visuales con perspectiva, los dos casos —neumorfismo y glassmorphism— enseñan lo mismo: la tendencia que sobrevive es la que tiene caso de uso real respaldado por infraestructura técnica seria, no la que produce mejores mockups iniciales. Malewicz propuso ambas con la misma seriedad de oficio. Una sobrevivió; la otra no. La diferencia no es de calidad del autor —el trabajo de Malewicz es solvente en ambos casos— sino de las condiciones que el ecosistema digital ha tenido para acoger cada estética.
Es lección que vale para cualquier propuesta visual emergente. La aceptación inicial en redes sociales y plataformas de comunidad de diseño no determina supervivencia. La adopción real en sistemas operativos, las APIs nativas que resuelven problemas operativos, la metáfora visual sostenible: esos son los factores que distinguen un trend de cinco años de uno de tres meses. Diseñadores con buen criterio aprenden a leerlos antes de comprometer proyectos enteros a una estética nueva.
A cinco años del momento en que ambos trends compitieron por atención del oficio, el glassmorphism ha encontrado su lugar como acento maduro y el neumorfismo ha quedado como nota a pie de página. La próxima estética que emerja —y emergirá— se medirá con esos mismos criterios. Vale la pena tenerlos presentes.
Fuentes consultadas:
- Glassmorphism: Definition and Best Practices — Nielsen Norman Group
- 12 Glassmorphism UI Features and Best Practices — UX Pilot
- What is Glassmorphism? UI Design Trend 2024 — Designs by Daveo
- How Glassmorphism in UX Is Reshaping Modern Interfaces — Clay Global
- UI Trends: Neumorphism vs Glassmorphism vs Neubrutalism — CCC Reative