Por qué tu SVG trazado automáticamente tiene demasiados nodos (y cómo arreglarlo)
Los SVG trazados automáticamente suelen estar saturados de cientos de puntos de ancla innecesarios que los vuelven difíciles de editar y lentos de cortar. Aquí tienes por qué pasa y cómo conseguir trazados limpios.
En esta página
Convertiste un PNG en SVG, lo abriste para empezar a editarlo y el trazado está enterrado bajo puntos de ancla. Cientos de ellos, agrupados a lo largo de curvas que deberían haber necesitado cinco o seis. Cada vez que intentas mover apenas una forma, estás peleando con una docena de manejadores que nunca pediste.
Si te suena familiar, tu vectorizador no está roto. Está haciendo exactamente lo que hacen la mayoría de los trazadores automáticos: transcribir píxeles en lugar de dibujar formas. Aquí tienes por qué ocurre, por qué te frena más de lo que parece y cómo obtener vectores que salgan limpios desde el principio.
Qué significa realmente "demasiados nodos"
Cada trazado de un SVG está construido con puntos de ancla (también llamados nodos) conectados por segmentos de curva. Cada ancla lleva un par de manejadores Bézier que doblan la línea a ambos lados. Unos pocos puntos de ancla bien colocados pueden describir perfectamente una curva larga y suave: ese es el objetivo de los gráficos vectoriales.
El problema empieza cuando hay muchos más puntos de ancla de los que la forma necesita. Una curva que un diseñador dibujaría con cinco puntos termina con cincuenta. La imagen todavía se ve bien a simple vista, pero el trazado subyacente es un desastre.
Probablemente estás viendo nodos inflados si:
- Una curva simple tiene puntos de ancla cada pocos píxeles en lugar de cada pocos centímetros.
- Al seleccionar una forma se iluminan docenas de puntos donde esperarías solo unos cuantos.
- El archivo es sorprendentemente grande para lo simple que es la ilustración.
Por qué los trazadores automáticos acumulan nodos
La mayoría de las herramientas de trazado, como Image Trace de Illustrator y los motores basados en potrace que usan muchos conversores gratuitos en línea, funcionan siguiendo el límite entre los colores de tu imagen rasterizada y colocando puntos de ancla a lo largo de ese borde.
El detalle está en dónde cae ese límite. Tu PNG tiene antialiasing: esos píxeles suaves y semitransparentes que alisan los bordes en pantalla. Para un trazador, ese borde suave parece una línea ligeramente irregular, así que añade puntos para seguir cada ondulación. No se pregunta "¿esto es un arco o un segmento recto?"; transcribe el contorno de los píxeles, temblores incluidos. La agresividad con la que una herramienta hace esto varía mucho: aquí comparamos los principales vectorizadores de imágenes con IA.
Puedes verlo en los propios datos del trazado. Esto es, a grandes rasgos, cómo se ve uno de los penachos de la oreja de ese búho trazado automáticamente frente a dibujado de forma limpia:
<!-- Trazado automático: un mechón de la oreja, más de 40 puntos -->
<path d="M312.4,98.1 C313.0,97.8 313.9,97.2 314.6,96.9 C315.2,96.7
316.1,96.4 316.8,96.2 C317.4,96.0 318.3,95.7 319.0,95.5 ...(many more) Z"/>
<!-- Limpio: el mismo mechón, 6 puntos -->
<path d="M312,98 C320,70 360,68 372,96 C378,112 340,140 312,98 Z"/>La misma curva. Uno es una transcripción de cada píxel; el otro es una forma.
Por qué te ralentiza
Un trazado inflado no solo se ve desordenado en el editor: te cuesta tiempo de tres maneras concretas.
| Trazado automático (típico) | Vector limpio | |
|---|---|---|
| Puntos de ancla | Cientos por forma | Unas pocas docenas |
| Edición | Peleas con manejadores en cada ajuste | Remodelas directamente |
| Tamaño de archivo | Más pesado, más lento de cargar | Compacto |
| Máquinas de corte | Tirones, cortes irregulares, tiempos de corte largos | Cortes suaves y rápidos |
En herramientas de diseño
En Illustrator o Figma, cada punto de ancla adicional es algo que tienes que seleccionar alrededor, evitar o limpiar antes de poder hacer un cambio real. Remodelar una curva limpia requiere uno o dos puntos. Remodelar una transcrita significa pelear con todo el grupo, y buena suerte manteniéndola suave.
En máquinas de corte
Aquí es donde realmente duele. Cricut, Silhouette y las cortadoras láser siguen el trazado literalmente. Demasiados nodos hacen que la máquina avance a tirones por cada microsegmento: cortes más ásperos, tiempos de corte más largos y más posibilidades de que el material se rasgue. Un trazado limpio se corta con total suavidad.
Cómo conseguir nodos limpios
Hay tres formas de salir de esto, en orden aproximado de cuánto dolor te ahorran:
- Simplificar después. Object → Path → Simplify de Illustrator puede eliminar puntos de ancla. Ayuda, pero tiene pérdida: aproxima el trazado, lo que puede suavizar esquinas y distorsionar la forma. Además, sigues partiendo de un trazado inflado.
- Bajar el detalle del trazado. La mayoría de los trazadores te dejan reducir la complejidad, pero es una herramienta poco precisa: si la bajas lo suficiente para recortar nodos, empiezas a perder los detalles que querías conservar.
- Empezar limpio. La solución real es vectorizar desde el principio con algo que genere trazados limpios, para que no haya nada que limpiar.
Ese último punto es exactamente la razón por la que creamos PerfectVector. En lugar de transcribir el límite de los píxeles, su modelo se entrenó con archivos de diseño reales, donde una persona ya había decidido dónde deben ir los puntos de ancla y qué segmentos forman una sola curva en vez de tres. El resultado refleja ese criterio: curvas Bézier suaves, antialiasing resuelto y un número de nodos que parece algo que habría dibujado un diseñador.
Y no pasa solo con las ilustraciones: los logotipos y las letras se inflan de la misma manera, justo donde más necesitas bordes nítidos y cortes de vinilo limpios.
Pruébalo
Suelta un PNG o JPG en PerfectVector, sin iniciar sesión ni tarjeta de crédito. Verás el número de nodos y de colores directamente en tu resultado, para que puedas juzgar la diferencia por tu cuenta antes de descargar nada.
¿No puedo simplemente usar Simplify en Illustrator?
Puedes hacerlo, y ayuda. Pero Simplify funciona aproximando un trazado que ya está inflado, así que tiende a redondear esquinas y mover curvas de maneras que tienes que vigilar. Es un paso de limpieza encima de un punto de partida desordenado. Vectorizar con un resultado limpio evita la limpieza por completo: no hay nada que simplificar porque los puntos ya estaban bien colocados desde el principio.
Más del blog
¿Puedes convertir una foto a SVG? Qué pasa realmente (y cuándo funciona)
Puedes pasar una foto por un conversor de SVG, pero una foto detallada no se convertirá en un vector nítido. Esto es lo que realmente obtienes y qué fotos vale la pena convertir.
Cómo crear un SVG en capas para Cricut
Un SVG en capas corta cada color como su propia pieza. La forma más limpia es separar tu imagen por colores en un SVG primero, para que se suba a Cricut ya organizada en capas.