Calificando envíos de Show HN sobre patrones de diseño de IA
(adriankrebs.ch)- Con el reciente aumento de envíos a Show HN, empezaron a repetirse landing pages con una apariencia similar, y se puntuaron patrones comunes tomando como base las 500 páginas más recientes de Show HN
- Los criterios de puntuación cubren 15 elementos entre tipografías, colores, layout y patrones de CSS; incluyen elementos como hero centrado, VibeCode Purple, borde de color a la izquierda, shadcn/ui y Glassmorphism
- La detección se hizo cargando las páginas con un navegador headless basado en Playwright y leyendo el DOM y los estilos computados; no se usó el método de que un LLM evaluara capturas de pantalla
- Los resultados se dividieron en Heavy slop 21%, Mild 46% y Clean 33%; no se concluye que un sitio fue generado por IA por un solo patrón, sino que se separa por rangos según cuántos patrones cumple
- Esta tendencia se acerca más a una falta de inspiración que a un problema grave, y en adelante podría hacer falta un diseño más trabajado para destacar entre resultados parecidos
Aumento de Show HN y puntuación de patrones de diseño
- La cantidad de envíos a Show HN aumentó mucho, al punto de que la administración de Hacker News llegó a restringir los envíos de Show HN para cuentas nuevas
- En proyectos recientes de Show HN se repitió una impresión genérica y estéril, y en vez de dejarlo solo como una sensación subjetiva, se lo puntuó usando como referencia 500 páginas
- El objetivo de la puntuación fueron las 500 landing pages más recientes de Show HN, clasificadas según patrones comunes de diseño de IA
Criterios de patrones de diseño de IA
- Los patrones comunes se agrupan, en general, en tipografías, colores, particularidades de layout y patrones de CSS
- El borde de color a la izquierda funcionó como una señal fuerte de diseño generado por IA, y de hecho apareció repetidamente en varias páginas
-
Tipografías
- Inter se usa en general, pero destaca sobre todo en titulares hero centrados
- Los LLM también usan con frecuencia combinaciones como Space Grotesk, Instrument Serif y Geist
- También se incluye la composición de un hero centrado en Inter donde una sola palabra se enfatiza en serif italic
-
Colores
- El llamado VibeCode Purple aparece de forma repetida
- Se ve a menudo la combinación de modo oscuro permanente, texto principal en gris medio y etiquetas de sección en mayúsculas
- En tema oscuro, también se incluyen casos donde el contraste del texto principal apenas supera el mínimo aceptable
- El abuso generalizado de gradientes, grandes resplandores de color y sombras de caja de color también forman parte del patrón
-
Particularidades de layout
- Se repite el típico hero centrado basado en tipografía sans
- Es frecuente la composición con un badge justo encima del H1 del hero
- También entra en los criterios el patrón de borde de color en la parte superior o el borde izquierdo de las tarjetas
- Se repite la colocación de feature cards idénticas con íconos en la parte superior
- También se incluyen como criterio la secuencia numérica de pasos 1, 2, 3, filas de banners de estadísticas, sidebars o navegación con íconos emoji, y títulos y etiquetas de sección en mayúsculas
-
Patrones de CSS
-
shadcn/ui
- Glassmorphism
-
Método de detección y resultados
- Cada sitio se cargó con un navegador headless basado en Playwright, y un pequeño script dentro de la página leía el DOM y los estilos computados para revisar los patrones
- Todos los patrones se procesaron con inspecciones determinísticas de CSS o del DOM; no se usó el método de tomar capturas y dejar que un LLM hiciera una evaluación visual
- Este método puede generar falsos positivos, pero en QA manual se confirmó que rondan aproximadamente entre 5% y 10%
- Si hay interés en reproducir, mejorar o puntuar el propio sitio con el código de puntuación, se dejó abierta la posibilidad de publicarlo
- No se concluye que un sitio fue generado por IA por un solo patrón; se divide en 3 rangos según cuántos de los 15 patrones cumple
- Heavy slop: cumple 5 o más patrones, 105 sitios, 21%
- Mild: 2 a 4, 230 sitios, 46%
- Clean: 0 a 1, 165 sitios, 33%
- Estos resultados se acercan más a una falta de inspiración que a un problema serio
- En la validación de ideas de negocio, el diseño llamativo nunca fue realmente lo central, y aun antes de la IA muchos sitios ya se parecían entre sí, como ocurría con Bootstrap
- Hay una diferencia clara entre los casos en que alguien pule el diseño manualmente y los casos en que se publica casi tal cual la salida por defecto del LLM
- Incluso antes de los LLM, usar plantillas de CSS/HTML tal cual producía un fenómeno parecido
- En adelante, para destacar dentro de este slop, podría volver a hacer falta un diseño más trabajado
- Al mismo tiempo, si los principales usuarios de la web pasan a ser agentes de IA, sigue sin estar claro cuánta importancia conservará el diseño
1 comentarios
Comentarios en Hacker News
Ya doy por hecho que la mayoría de los side projects ahora se hacen con ayuda de IA
Normalmente hay limitaciones de tiempo, así que si la IA te ahorra tiempo, no hay muchas razones para no usarla
Además, también es el lugar perfecto para probar nuevas herramientas de IA con las que es difícil experimentar en el trabajo de la empresa
Al principio, el título de este post no captaba bien la idea principal y usaba mal vibe coded, así que no lograba transmitir bien el tema realmente más interesante: las similitudes visuales de los frontends generados por IA
Ahora el título está mejor, y "Show HN submissions tripled and now mostly have the same vibe-coded look" se ve mucho más preciso
Veo demasiado seguido sitios en modo oscuro donde el texto principal y el texto secundario están en tonos marrón oscuro o beige, y la legibilidad es terrible
Para irte a la segura, la relación de contraste entre texto y fondo debería ser de al menos 4:1
Tampoco es difícil de corregir; basta con meter las Web Content Accessibility Guidelines en las skills
https://webaim.org/resources/contrastchecker
Lo divertido es justamente el proceso de pensar en el problema, resolverlo, implementarlo uno mismo, aprender algo nuevo e imaginar si podría volverse popular y útil; si solo chasqueas los dedos con IA para obtener el resultado, esa diversión desaparece
En el trabajo diario, bueno, puedes usar IA para reducir tareas aburridas, pero no quiero hacer eso también en mis side projects
Y además, pagar 200 dólares al mes por el privilegio de usar IA en proyectos personales me parece demasiado tonto
Todos mis side projects empezaron para aprender algo, así que usar IA como un botón para saltar al final no tiene nada de sentido
Y justo eso es lo que la gente quiere ver cuando alguien dice "les muestro mi side project"
Normalmente lo realmente urgente está del lado de los proyectos comerciales
La lista de patrones de diseño está bien, pero creo que falta un elemento importante: el grid de rectángulos redondeados
https://correctarity.com/roundedrects
Tal vez lo que en el post llaman "Icon-topped feature card grid" sea lo más cercano al nombre formal
Como mínimo, es una corriente que viene desde la época en que Apple presentó la patente de rounded corners
También hay que ver esto
https://news.ycombinator.com/showlim
A muchas cuentas con poco historial en HN ahora les toca ver esta pantalla, y eso también influye en la caída del lado derecho del gráfico del OP
Ask HN: Please restrict new accounts from posting - https://news.ycombinator.com/item?id=47300329 - March 2026 (515 comments)
Is Show HN dead? No, but it's drowning - https://news.ycombinator.com/item?id=47045804 - Feb 2026 (425 comments)
La gente quiere escribir código con herramientas de 2026 y aun así ser evaluada con criterios de 2016
En 2016, ver 10 mil líneas de código implicaba por sí solo cierto proof-of-work, y eso naturalmente venía acompañado de pruebas, reflexión y meses de pulir cosas a fuerza de chocar con problemas
Pero en 2026, 10 mil líneas de código podrían significar solo que gastaste algo de dinero en tokens, y si se trata de convertir una especificación grande de OpenAPI a una API de cierto lenguaje, incluso puede generarse rapidísimo de una sola vez
Perfectamente podría pasar que más del 90% del proyecto nunca se haya ejecutado ni una vez en escenarios reales, y que solo haya pasado pruebas unitarias escritas por la propia IA
Eso no está inherentemente mal, pero el criterio de evaluación tiene que cambiar
Aunque el umbral de Show HN no necesita ser altísimo, sí debería estar un poco por encima de "escribí unas líneas en un cuadro de texto"
No porque eso sea malo, sino porque el costo de captar la valiosa atención humana se volvió demasiado barato
Es un poco amargo, pero la verdad es que antes de la IA ya existían bastantes proyectos del tipo que se pueden hacer solo con una idea y unos cuantos prompts
Las herramientas de programación con IA solo ampliaron un poco la lista de "proyectos que ya vimos demasiadas veces"; en realidad se siente más bien como una oleada aún más fuerte del mismo tipo de proyectos que ya nos inundaban desde antes
Muy seguido veo gente que arma un producto en un fin de semana y luego le pone un precio ridículo basándose en lo que esa categoría de producto cobraba hace unos años
Parece que no terminan de aceptar que ese precio originalmente reflejaba el esfuerzo que antes hacía falta para llegar hasta ahí
Ahora la situación es distinta
Hacen presentaciones exageradamente pulidas o un nuevo branding y aun así quieren que se valore como un logro bajo los estándares de antes, pero al final es como fabricarse tus propios méritos
No me convence mucho eso de que cuando los agentes de IA se vuelvan los principales usuarios de la web, el diseño ya no importará tanto
Si el mundo de la superficie quedó arruinado por enfermedades y guerras, y contaminado por promesas vacías de innovación y restos de metales pesados, entonces habrá que construir un nuevo Eden
Me gusta la idea de Gemini, pero igual quisiera expresarla como un medio visual
Creo que incluso con limitaciones del nivel de Dillo se puede hacer algo bello, y si se usa Wireguard mesh como capa de transporte y las invitaciones se dan y se retiran según la confianza personal,
tal vez las ideas puedan volver a florecer en un lugar donde las plataformas gigantes no amplifiquen ni promedien todo hasta volverlo plano
Si hablamos de diseño, los sitios de proyectos tecnológicos, desde el solo founder SaaS hasta la empresa que recibió 2 mil millones de dólares de YC, se vienen viendo casi iguales desde hace años
A estas alturas solo espero que el LLM al menos de vez en cuando alucine un CSS un poco distinto
Han ido rotando olas como Bootstrap, Web 2.0, Tailwind, Material UI, Rails, NextJS, y ahora simplemente toca la IA
No hace falta actuar como si la industria antes no hubiera usado atajos
Puedes presumir código artesanal, pero quienes usan software con fines de negocio nunca estuvieron demasiado interesados en eso
Además, la filosofía misma de la informática siempre ha ido más o menos hacia que cualquiera pueda programar, ¿no?
También se ha opuesto a barreras de licencia, así que el hecho de que el código se esté volviendo un commodity y que la barrera de entrada casi haya desaparecido parece una extensión natural de eso
Algunos envíos de Show HN al principio parecían impresionantes, pero cuando los miras de cerca ni funcionan, o se nota demasiado que son código de IA presentado como si alguien lo hubiera escrito directamente
Antes GitHub servía hasta cierto punto como señal curricular, pero ahora, si la IA hace la mayor parte, ese valor de señal prácticamente desaparece
Me gustaría que no mostraran solo el resumen, sino también los resultados detallados
Por ejemplo, que pongan listas de envíos con puntajes altos y bajos para poder hacer uno mismo el vibe check de si la metodología tiene sentido
Y en vez de un gráfico de pastel con categorías arbitrarias en un único momento, sería mejor mostrar cambios de tendencia a lo largo del tiempo
Si se trata de un MVP o de una etapa exploratoria, una UI hecha por LLM es perfectamente aceptable
Pero cuando el juguete empieza a convertirse en producto, llega el momento de retocar la UI en serio
En interfaces para personas, al final el toque humano sí tiene valor
El problema de que la IA inunde HN con bots está relacionado, pero es un tema aparte y de otra naturaleza
No creo que el núcleo del problema sea la generación por IA en sí
Pero una UI/UX generada por IA y hecha al aventón sí es un problema real
La estética vibe-coded muchas veces se siente como una señal de "no se pensó a fondo cómo funciona esto de verdad", y aunque la tecnología de base sea sólida, eso basta para que sea una señal de alerta