Mejora estética del frontend
Instrucciones
Evita la estética mediocre de la "IA chapucera" y crea una interfaz sorprendentemente única.
## Cinco dimensiones principales
**1. Tipografía**
- ❌ Prohibido: Inter, Roboto, Arial, Fuentes del sistema
- ✅ Elige: Fuentes únicas y distintivas
- ✅ Combinación: Fuente de presentación + Fuente de cuerpo, alto contraste
- ✅ Consejos: Contraste extremo de grosor de fuente (100 vs 900), amplio rango de tamaño de fuente (3x+)
**2. Color y temática**
- ✅ Mantén una estética coherente utilizando variables CSS.
- ✅ Color dominante + color de acento vibrante
- ❌ Evitar: Degradado morado + fondo blanco
- ✅ Inspiración: Temas IDE, estética cultural
**3. Movimiento**
- ✅ Las animaciones CSS tienen prioridad (HTML)
- ✅ Biblioteca de movimiento
- ✅ Enfoque en el alto impacto: Carga de página cuidadosamente seleccionada > Microinteracciones dispersas
- ✅ Activador de desplazamiento, sorpresa al pasar el ratón
**4. Distribución espacial**
- ✅ Flujo asimétrico, superpuesto y diagonal
- ✅ Rompe la cuadrícula, usa el espacio en blanco con audacia O con densidad controlada
**5. Antecedentes**
- ✅ Crea atmósfera y profundidad
- ✅ Malla degradada, ruido, patrones geométricos
- ✅ Transparencia por capas, sombras dramáticas, bordes decorativos
## Principios clave
- Cada diseño debe ser diferente para evitar la convergencia repetitiva.
- Lograr una visión estética acorde con la complejidad.
La extrema complejidad requiere un diseño meticuloso, mientras que el minimalismo exige moderación y precisión.
Libérate del pensamiento convencional y toma decisiones verdaderamente únicas.
⚡ Resumen en una línea
Tipografía única + esquema de color llamativo + animación meticulosa + diseño innovador + fondo evocador = diseño front-end inolvidable
Rechazar: Inter/Roboto, fondo blanco con degradado morado, diseño monótono.
📋 Lista de verificación rápida
Dimensiones y elementos de inspección
¿Deberían evitarse las fuentes Inter/Roboto? ¿Existen combinaciones de colores únicas?
¿La paleta de colores tiene un tema unificado? ¿Deberían evitarse los degradados morados?
¿La animación incluye un efecto de carga cuidadosamente coreografiado?
¿El diseño se desvía de la cuadrícula convencional?
¿El fondo crea profundidad y atmósfera?
Descripción
Recomendado por
nene@YouMind
Por qué recomendamos esta habilidad
¿Cansado de los diseños genéricos de "AI slop"? Esta habilidad te ayudará a salir de la mediocridad, creando impresionantes interfaces frontend con tipografía única, colores atrevidos, animaciones ingeniosas, diseños espaciales innovadores y fondos con profundidad. Ofrece una guía estética práctica para que tu trabajo destaque entre la multitud de sitios web y logre un verdadero avance visual.
• Personalidad tipográfica única • Estética ciberpunk oscura • Diseño asimétrico y dinámico • Animaciones de carga cuidadosamente orquestadas • Creación de atmósfera inmersiva
Habilidades relacionadas
Ver todo
DiapositivasNeo-brutalista editorial dev
Convierte tu contenido temático, artículos, puntos de conocimiento, revisiones de proyectos, textos de cursos o presentaciones de herramientas en un conjunto de Slides horizontales con el 'Estilo editorial neo-brutalista para desarrolladores'. El estilo general fusiona el diseño neo-brutalista, la maquetación de revistas independientes y la estética de terminal de desarrollador: fondo beige, bordes negros gruesos, sombras duras, bloques de alto contraste, títulos ultra gruesos, fuente monoespaciada, diseño modular de web/terminal/tarjeta, creando una fuerte sensación de expresión de contenido técnico. Esta habilidad primero extrae la estructura del contenido, luego determina una idea central para cada página, y genera automáticamente título, oración explicativa, módulo de conocimiento, conclusión y componentes visuales apropiados. Es especialmente adecuada para escenarios de contenido como introducción de herramientas de IA, prácticas de agentes, desglose de proyectos de código abierto, organización de contenido de cursos, resumen de metodologías, explicación de funciones de productos y revisión técnica. El resultado final son Slides horizontales en formato 16:9, con una apariencia visual unificada, lectura clara, espacio en blanco suficiente y un estilo distintivo, logrando un efecto de expresión de alto nivel que parece 'como si un autor de proyecto de código abierto estuviera compartiendo tecnología, y al mismo tiempo una revista de diseño independiente estuviera contando una historia'.
ImagenPóster estilo relieve Han
Un sistema visual extraído de los relieves en piedra de la dinastía Han: figuras geométricas en silueta × colores clásicos de fondo × diseño editorial asimétrico. Ideal para carteles de eventos, avances de transmisiones en vivo, portadas de podcasts y más. Solo dinos el tema, y se encarga de grabar el contenido moderno en la estética de hace dos mil años.
EscribirTítulos virales estilo Dan Koe
Genera 7 títulos para el contenido del usuario, cada uno debe representar una característica central del estilo de Dan Koe, asegurando diversidad y opciones de elección. Este es un maestro en la creación de títulos que domina la psicología de la difusión viral y la estética del contenido de Dan Koe. Está diseñado para creadores, constructores de marca personal y nómadas digitales, dedicado a transformar temas aburridos en títulos virales con una calidad de «líder de pensamiento». 🌟 Habilidades principales Análisis profundo del contenido: extrae automáticamente los puntos débiles clave, el perfil de la audiencia y la promesa de valor a partir de palabras clave fragmentadas o guiones extensos. Siete dimensiones doradas: sigue estrictamente la lógica visual de Dan Koe, generando 7 ángulos de enfoque completamente diferentes de una sola vez.
Mejora estética del frontend
Instrucciones
Evita la estética mediocre de la "IA chapucera" y crea una interfaz sorprendentemente única.
## Cinco dimensiones principales
**1. Tipografía**
- ❌ Prohibido: Inter, Roboto, Arial, Fuentes del sistema
- ✅ Elige: Fuentes únicas y distintivas
- ✅ Combinación: Fuente de presentación + Fuente de cuerpo, alto contraste
- ✅ Consejos: Contraste extremo de grosor de fuente (100 vs 900), amplio rango de tamaño de fuente (3x+)
**2. Color y temática**
- ✅ Mantén una estética coherente utilizando variables CSS.
- ✅ Color dominante + color de acento vibrante
- ❌ Evitar: Degradado morado + fondo blanco
- ✅ Inspiración: Temas IDE, estética cultural
**3. Movimiento**
- ✅ Las animaciones CSS tienen prioridad (HTML)
- ✅ Biblioteca de movimiento
- ✅ Enfoque en el alto impacto: Carga de página cuidadosamente seleccionada > Microinteracciones dispersas
- ✅ Activador de desplazamiento, sorpresa al pasar el ratón
**4. Distribución espacial**
- ✅ Flujo asimétrico, superpuesto y diagonal
- ✅ Rompe la cuadrícula, usa el espacio en blanco con audacia O con densidad controlada
**5. Antecedentes**
- ✅ Crea atmósfera y profundidad
- ✅ Malla degradada, ruido, patrones geométricos
- ✅ Transparencia por capas, sombras dramáticas, bordes decorativos
## Principios clave
- Cada diseño debe ser diferente para evitar la convergencia repetitiva.
- Lograr una visión estética acorde con la complejidad.
La extrema complejidad requiere un diseño meticuloso, mientras que el minimalismo exige moderación y precisión.
Libérate del pensamiento convencional y toma decisiones verdaderamente únicas.
⚡ Resumen en una línea
Tipografía única + esquema de color llamativo + animación meticulosa + diseño innovador + fondo evocador = diseño front-end inolvidable
Rechazar: Inter/Roboto, fondo blanco con degradado morado, diseño monótono.
📋 Lista de verificación rápida
Dimensiones y elementos de inspección
¿Deberían evitarse las fuentes Inter/Roboto? ¿Existen combinaciones de colores únicas?
¿La paleta de colores tiene un tema unificado? ¿Deberían evitarse los degradados morados?
¿La animación incluye un efecto de carga cuidadosamente coreografiado?
¿El diseño se desvía de la cuadrícula convencional?
¿El fondo crea profundidad y atmósfera?
Descripción
Recomendado por
nene@YouMind
Por qué recomendamos esta habilidad
¿Cansado de los diseños genéricos de "AI slop"? Esta habilidad te ayudará a salir de la mediocridad, creando impresionantes interfaces frontend con tipografía única, colores atrevidos, animaciones ingeniosas, diseños espaciales innovadores y fondos con profundidad. Ofrece una guía estética práctica para que tu trabajo destaque entre la multitud de sitios web y logre un verdadero avance visual.
• Personalidad tipográfica única • Estética ciberpunk oscura • Diseño asimétrico y dinámico • Animaciones de carga cuidadosamente orquestadas • Creación de atmósfera inmersiva
Habilidades relacionadas
Ver todoDiapositivasNeo-brutalista editorial dev
Convierte tu contenido temático, artículos, puntos de conocimiento, revisiones de proyectos, textos de cursos o presentaciones de herramientas en un conjunto de Slides horizontales con el 'Estilo editorial neo-brutalista para desarrolladores'. El estilo general fusiona el diseño neo-brutalista, la maquetación de revistas independientes y la estética de terminal de desarrollador: fondo beige, bordes negros gruesos, sombras duras, bloques de alto contraste, títulos ultra gruesos, fuente monoespaciada, diseño modular de web/terminal/tarjeta, creando una fuerte sensación de expresión de contenido técnico. Esta habilidad primero extrae la estructura del contenido, luego determina una idea central para cada página, y genera automáticamente título, oración explicativa, módulo de conocimiento, conclusión y componentes visuales apropiados. Es especialmente adecuada para escenarios de contenido como introducción de herramientas de IA, prácticas de agentes, desglose de proyectos de código abierto, organización de contenido de cursos, resumen de metodologías, explicación de funciones de productos y revisión técnica. El resultado final son Slides horizontales en formato 16:9, con una apariencia visual unificada, lectura clara, espacio en blanco suficiente y un estilo distintivo, logrando un efecto de expresión de alto nivel que parece 'como si un autor de proyecto de código abierto estuviera compartiendo tecnología, y al mismo tiempo una revista de diseño independiente estuviera contando una historia'.
ImagenPóster estilo relieve Han
Un sistema visual extraído de los relieves en piedra de la dinastía Han: figuras geométricas en silueta × colores clásicos de fondo × diseño editorial asimétrico. Ideal para carteles de eventos, avances de transmisiones en vivo, portadas de podcasts y más. Solo dinos el tema, y se encarga de grabar el contenido moderno en la estética de hace dos mil años.
EscribirTítulos virales estilo Dan Koe
Genera 7 títulos para el contenido del usuario, cada uno debe representar una característica central del estilo de Dan Koe, asegurando diversidad y opciones de elección. Este es un maestro en la creación de títulos que domina la psicología de la difusión viral y la estética del contenido de Dan Koe. Está diseñado para creadores, constructores de marca personal y nómadas digitales, dedicado a transformar temas aburridos en títulos virales con una calidad de «líder de pensamiento». 🌟 Habilidades principales Análisis profundo del contenido: extrae automáticamente los puntos débiles clave, el perfil de la audiencia y la promesa de valor a partir de palabras clave fragmentadas o guiones extensos. Siete dimensiones doradas: sigue estrictamente la lógica visual de Dan Koe, generando 7 ángulos de enfoque completamente diferentes de una sola vez.
Encuentra tu próxima habilidad favorita
Explora más habilidades de IA seleccionadas para investigación, creación y trabajo cotidiano.