El retrofuturismo, como estética de diseño actual, combina un futuro predicho con el pasado.
Es a la vez vanguardista y nostálgico. Es alta tecnología, pintada con un toque deliberadamente rudimentario.
Para los diseñadores modernos, el retrofuturismo es una elección deliberada. Pero antes de la década de 1960, los creativos escribían, creaban arte y hacían películas que intentaban predecir lo que vendría. Sus obras nunca tuvieron la intención de ser kitsch; aspiraban a ser proféticas.
Podemos ver el retrofuturismo en la película de 1927 “Metrópolis”, que retrató el año 2026 como una distopía habitada por elegantes autómatas de metal y sombríos rascacielos art déco. Ofreció a su audiencia un portal a un tiempo distante, tan hermoso como aterrador.
El retrofuturismo también se vio en los libros y cómics de ciencia ficción populares entre las décadas de 1930 y 1950. Eran comunes las escenas de astronautas cabezones colonizando planetas distantes, con pistolas láser en mano y listos para luchar contra formas de vida alienígenas. Mostraban el mundo tecnológicamente avanzado del futuro, tal como lo imaginaban los artistas.
Hoy en día, los diseñadores adoptan este futurismo imaginado como una mirada nostálgica a un mundo alternativo. Los diseños web retrofuturistas transportan a los usuarios a través de esquemas de color tipo nebulosa, imágenes de otro mundo y tipografía inspirada en computadoras retro, lo que resulta en experiencias frescas y únicas.
Tipos de retrofuturismo
El crudo digitalismo del cyberpunk
Aunque vemos sus raíces en la ciencia ficción de los años 60 y 70, el término “cyberpunk” no existió hasta 1980, cuando Bruce Bethke escribió una novela titulada Cyberpunk.
La palabra es una mezcla de “punk”, en referencia al movimiento musical rebelde, y “cibernético”, que describe la mecanización de las funciones biológicas. Esta amalgama de palabras hace que el cyberpunk se sienta a la vez de alta tecnología y con un toque áspero.
A partir de ahí, el cyberpunk se abrió camino en la cultura popular con películas como “Blade Runner” en 1982 y “Ghost in the Shell” en 1995, junto con muchas otras películas de anime y publicaciones de manga. Videojuegos como “Cyberpunk 2077” también han contribuido a la popularidad de esta estética. En el diseño web, su sentido de anarquía y mecanización realmente solo ha despegado en los últimos años.
El cyberpunk es uno de los pilares principales del retrofuturismo. Los fallos y artefactos digitales que a menudo se encuentran en los diseños cyberpunk hacen que los espectadores sientan que están interactuando con tecnología inestable, capaz de colapsar en cualquier momento. Los esquemas de color a menudo recuerdan a paisajes urbanos deteriorados: azules, verdes y púrpuras apagados por capas de hollín industrial.
El cyberpunk es áspero. Es más Halcón Milenario que Enterprise. Hay una sensación de caos corriendo bajo su exterior aparentemente de alta tecnología.
El absurdo desconcertante del vaporwave
El vaporwave es una rama del retrofuturismo. Es un poco menos duro que el cyberpunk, pero aún evoca sentimientos de nostalgia, basándose en la cultura pop y los tropos de diseño de la década de 1990. Los esquemas de color del vaporwave suelen ser suaves, con pasteles de púrpura, rosa y azul. También son comunes las sombras paralelas marcadas y los degradados, junto con patrones geométricos como cuadrículas y triángulos.
La estética vaporwave se remonta a mediados de la década de 2010, con el surgimiento del género musical del mismo nombre. Con muestras de R&B de tono grave, líneas de sintetizador distorsionadas y cajas de ritmos monótonas, representaba la ironía sin el cinismo, deleitándose en la indulgencia más absurda de los años 90.
El arte visual del vaporwave también toma prestados los aspectos más cursis de la cultura pop e integra lo absurdo. Las portadas de álbumes y los memes asociados a este movimiento de música electrónica adoptaron esquemas de colores llamativos e incorporaron elementos visuales disparatados, como estatuas romanas fuera de lugar.
En el diseño web, el vaporwave es una rama más alegre del retrofuturismo. En lugar de predecir un futuro distópico, abraza los elementos más cursis de la cultura pop de los 90. Sin embargo, no es raro que los diseñadores web recurran tanto al cyberpunk como al vaporwave al crear sitios web retrofuturistas.
Empieza gratis
Crea sitios web personalizados y escalables, sin escribir código. Empieza a construir en Webflow.
Ejemplos de retrofuturismo
El retrofuturismo no es para todo el mundo, y eso está bien. Pensemos en el Cybertruck de Elon Musk. Aunque parece más adecuado para transportar rocas en la luna que para llevar la compra por los suburbios, mucha gente ha hecho sus pedidos para el lanzamiento del vehículo. Es un diseño polarizante que divide a la gente entre quienes encuentran su futurismo tosco algo ridículo y quienes les encantaría crearlo ellos mismos. El diseño web retrofuturista funciona de la misma manera: o eres fan o simplemente no lo entiendes.
El retrofuturismo no funcionará para todos los diseños web, pero es una estética audaz que dejará una gran impresión en cualquier sitio que toque. Echemos un vistazo a algunos ejemplos para mostrarte las diferentes formas en que los diseñadores lo están utilizando en su trabajo.
Descubre música local
Con una pantalla de inicio que parece la introducción de una cinta de ejercicios en VHS, Discover Local Music tiene todas las señas de identidad del vaporwave. Nos encanta la mezcla de tipografías, los tubos de neón en morado y rosa, y el abrazo total y sin complejos a la estética de los años 80.
Mark Alink
Mark Alink es una herramienta de gestión de marcadores de código abierto. Con texto luminoso, remolinos de estrellas y toques de azul y amarillo, este sitio combina el vaporwave con una influencia cyberpunk, visible en sus fallos de pantalla y cursores parpadeantes.
The Nifty Portal
The Nifty Portal, un proyecto de arte NFT, encarna todo lo que es el cyberpunk. La fuente de la pantalla superior parece sacada de una corporación interplanetaria del año 2200. Con finas líneas vectoriales que dividen las páginas, tipografía de terminal de ordenador, iconos que parpadean al enfocar y fondos atmosféricos, los espectadores sienten que están mirando una pantalla de ordenador en las profundidades de un mundo alienígena.
Cuadrícula 3D retro
Aunque no es un sitio web completo, querrás echar un vistazo a Retro 3D Grid. Con un verde que parece sacado directamente de un viejo monitor Apple IIe, esta cuadrícula animada añadirá un toque de encanto retrofuturista a cualquier sitio web en el que la integres.
Y lo que es mejor, puedes clonarla gratis, lo que te ofrece un excelente punto de partida para tus propios proyectos de diseño retro-tecnológico.
Portafolio de Lars Olson
Lars Olson adopta el espíritu vaporwave sin utilizar ninguno de sus tropos de diseño habituales. No encontrarás ni una sola estatua romana ni degradados kitsch. En su lugar, Lars lleva los principios del vaporwave en direcciones diferentes.
El sitio web de Lars presenta elementos visuales disparatados, como una piña, delfines y formas de fondo inspiradas en el clip art de los 90. También encontrarás una llamativa paleta de verdes, azules y morados fluorescentes.
Ribbon Finance
El sitio de criptomonedas Ribbon Finance presenta su producto con una tipografía al estilo de 8 bits.
Aunque Ribbon Finance disfruta de la nostalgia de la tecnología antigua, encontrarás muchos toques modernos. La apertura cuenta con una microinteracción cautivadora que despliega cuadrados de colores brillantes. Este motivo se repite en todo el diseño, con un efecto al pasar el cursor que ilumina varios elementos con una luz fluorescente.
Ribbon Finance fusiona el pasado con lo moderno, convirtiéndose en la destilación perfecta del retrofuturismo.
Chafik Design
El ingeniero de datos e IA Chafik combina lo mejor del vaporwave y el cyberpunk en su portafolio con elementos como un alienígena bailando en la sección principal, degradados en morado y azul, y texto con efecto de fallo. Fiel a la temática, Chafik afirma ser "de otro planeta" y anima a sus clientes potenciales a contactarlo para "hacer el futuro realidad".
Portafolio de Nikita Rybai
El portafolio de Nikita Rybai ofrece una experiencia de usuario cyberpunk inmersiva.
Aunque esta es una propuesta más pulida, aún conserva toques de los aspectos más crudos del cyberpunk. La sección principal presenta una extraña configuración de formas geométricas que se desplazan al pasar el cursor. También hay otros detalles de baja fidelidad, como un icono de correo pixelado y texto al estilo de línea de comandos por todo el sitio.
Lleva tus propios diseños al pasado y al futuro
Mientras que muchas tendencias de diseño prefieren las líneas suaves y el refinamiento, el retrofuturismo desafía ese perfeccionismo. Adopta visuales que imitan errores y fallos, y se deleita con tipografías pixeladas y toscas. El retrofuturismo toma lo que ya no está de moda y lo transforma en algo nuevo.
Y esa es la belleza del diseño web: cada diseñador tiene el poder de mezclar y combinar las tendencias y estilos que prefiera. Sea lo que sea que estés creando, ¡nos encantaría verlo hecho en Webflow!
