Mejora estética 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, mediante tipografía única, colores audaces, animaciones sutiles, diseño espacial innovador y fondos con profundidad, para crear interfaces frontend impresionantes. Ofrece una guía estética práctica que hará que tu trabajo se destaque entre la multitud de sitios web, logrando una verdadera ruptura visual.
Personalidad tipográfica única Estética cyberpunk oscura Diseño dinámico asimétrico Animaciones de carga cuidadosamente orquestadas Creación de atmósfera inmersiva
Habilidades relacionadas
Ver todo
DiapositivasNeobrutalismo editorial dev
Convierta su 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 un "estilo editorial neobrutalista para desarrolladores". El estilo general combina diseño neobrutalista, maquetación de revista independiente y estética de terminal de desarrollador: fondo blanco crema, bordes negros gruesos, sombras duras, bloques de color de alto contraste, títulos muy gruesos, fuente monoespaciada, y 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 diapositiva, y genera automáticamente títulos, frases explicativas, módulos de conocimiento, conclusiones y componentes visuales adecuados. Es especialmente adecuada para presentaciones de herramientas de IA, prácticas de Agent, desgloses de proyectos open source, organización de contenido de cursos, resúmenes de metodologías, explicaciones de funcionalidades de productos y revisiones técnicas. El resultado final son slides horizontales en formato 16:9, con una apariencia visual unificada, lectura clara, suficiente espacio en blanco y un estilo distintivo, que presenta un efecto de alta expresión como "un autor de proyecto open source compartiendo tecnología, y al mismo tiempo una revista de diseño independiente 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 de fondo clásicos × maquetación asimétrica y editorial. Ideal para carteles de eventos, avances de transmisiones en vivo, portadas de podcasts y más. Solo di el tema, y se encarga de grabar el contenido moderno en la estética milenaria.
EscribirIP Pequeño - Títulos Dan Koe
Genera 7 títulos para el contenido del usuario, cada título debe representar una característica central del estilo de Dan Koe, asegurando diversidad y opciones. Este es un maestro en la creación de títulos que domina la psicología de la viralización y la estética de contenido de Dan Koe. Está diseñado para creadores, constructores de marca personal y nómadas digitales, dedicado a transformar tus temas aburridos en títulos virales con la esencia de un 'líder de pensamiento'. 🌟 Capacidades principales Análisis profundo de contenido: extrae automáticamente los puntos clave, el perfil de la audiencia y la propuesta de valor de palabras clave fragmentadas o guiones de miles de palabras. Siete dimensiones de oro: siguiendo estrictamente la lógica visual de Dan Koe, genera 7 ángulos de enfoque completamente diferentes de una sola vez.
Mejora estética 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, mediante tipografía única, colores audaces, animaciones sutiles, diseño espacial innovador y fondos con profundidad, para crear interfaces frontend impresionantes. Ofrece una guía estética práctica que hará que tu trabajo se destaque entre la multitud de sitios web, logrando una verdadera ruptura visual.
Personalidad tipográfica única Estética cyberpunk oscura Diseño dinámico asimétrico Animaciones de carga cuidadosamente orquestadas Creación de atmósfera inmersiva
Habilidades relacionadas
Ver todo
DiapositivasNeobrutalismo editorial dev
Convierta su 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 un "estilo editorial neobrutalista para desarrolladores". El estilo general combina diseño neobrutalista, maquetación de revista independiente y estética de terminal de desarrollador: fondo blanco crema, bordes negros gruesos, sombras duras, bloques de color de alto contraste, títulos muy gruesos, fuente monoespaciada, y 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 diapositiva, y genera automáticamente títulos, frases explicativas, módulos de conocimiento, conclusiones y componentes visuales adecuados. Es especialmente adecuada para presentaciones de herramientas de IA, prácticas de Agent, desgloses de proyectos open source, organización de contenido de cursos, resúmenes de metodologías, explicaciones de funcionalidades de productos y revisiones técnicas. El resultado final son slides horizontales en formato 16:9, con una apariencia visual unificada, lectura clara, suficiente espacio en blanco y un estilo distintivo, que presenta un efecto de alta expresión como "un autor de proyecto open source compartiendo tecnología, y al mismo tiempo una revista de diseño independiente 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 de fondo clásicos × maquetación asimétrica y editorial. Ideal para carteles de eventos, avances de transmisiones en vivo, portadas de podcasts y más. Solo di el tema, y se encarga de grabar el contenido moderno en la estética milenaria.
EscribirIP Pequeño - Títulos Dan Koe
Genera 7 títulos para el contenido del usuario, cada título debe representar una característica central del estilo de Dan Koe, asegurando diversidad y opciones. Este es un maestro en la creación de títulos que domina la psicología de la viralización y la estética de contenido de Dan Koe. Está diseñado para creadores, constructores de marca personal y nómadas digitales, dedicado a transformar tus temas aburridos en títulos virales con la esencia de un 'líder de pensamiento'. 🌟 Capacidades principales Análisis profundo de contenido: extrae automáticamente los puntos clave, el perfil de la audiencia y la propuesta de valor de palabras clave fragmentadas o guiones de miles de palabras. Siete dimensiones de oro: siguiendo estrictamente la lógica visual de Dan Koe, genera 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.