Descargador de IconScout: guía de iconos, 3D y archivos Lottie
Guía del descargador de IconScout: obtén iconos, ilustraciones 3D y animaciones Lottie, entiende los formatos SVG, PNG y JSON y úsalos con limpieza en tus diseños.
El descargador de IconScout te da iconos, ilustraciones 3D y animaciones Lottie con solo pegar el enlace de un recurso, de modo que puedes crear una interfaz o una presentación cuidada sin comprar un plan completo por unos pocos archivos. Esta guía explica cada tipo de archivo, qué formato elegir para cada trabajo y cómo mantener todo un proyecto visualmente coherente.
¿Qué puedes obtener en IconScout?
IconScout es un mercado y una biblioteca de recursos de diseño. Las tres categorías que más interesan a la mayoría de la gente son:
- Iconos: iconos sueltos y conjuntos de iconos en muchos estilos, como línea, relleno, dos tonos y color plano.
- Ilustraciones 3D: objetos y escenas renderizados que dan profundidad a páginas de aterrizaje y presentaciones.
- Animaciones Lottie: pequeños archivos animados que se usan en aplicaciones, sitios web y presentaciones para indicadores de carga, bienvenida, estados vacíos y microinteracciones.
También hay ilustraciones, pegatinas y otros recursos, pero los iconos, el 3D y Lottie son el núcleo de la mayoría de las solicitudes.
¿Qué formato de archivo debes usar?
Los formatos son donde la mayoría de los principiantes pierde tiempo. Aquí tienes la versión corta.
SVG para iconos e ilustraciones planas
El SVG es un formato vectorial. Se escala a cualquier tamaño sin perder nitidez, pesa muy poco y puedes cambiar los colores en el código o en una herramienta de diseño. Usa SVG para iconos de sitios web, interfaces de aplicaciones, logotipos en maquetas y preparación para impresión.
PNG para colocarlo rápido
El PNG es una imagen rasterizada con transparencia. Es ideal para diapositivas, publicaciones en redes sociales y correos, donde no necesitas editar la forma. Expórtalo con un tamaño de al menos el doble del tamaño en que se mostrará para que se vea nítido en pantallas de alta densidad.
JSON para animaciones Lottie
Una animación Lottie es un archivo JSON que describe el movimiento. Una página web o una aplicación la reproduce con una pequeña biblioteca de reproductor. Es mucho más ligera que un GIF y se mantiene nítida a cualquier tamaño. Algunas bibliotecas también ofrecen una versión dotLottie, que es un paquete comprimido.
Cómo elegir en 3D
Las ilustraciones 3D se entregan normalmente como PNG con fondo transparente, a veces con ángulos adicionales o variantes de color. Pesan más que los iconos, así que comprímelas antes de usarlas en una página web.
Cómo usar el descargador de IconScout
- Busca en IconScout. Usa primero el filtro de tipo: iconos, 3D, Lottie o ilustraciones. Después añade una palabra clave como payment, shopping cart o success.
- Abre la página del recurso y comprueba el estilo, el nombre del paquete y los formatos disponibles.
- Copia el enlace de la barra de direcciones.
- Abre el descargador de IconScout, pega el enlace y envíalo.
- Descarga el archivo y descomprímelo si llega como un paquete.
- Pruébalo en tu diseño antes de descargar más. Un icono con el estilo correcto vale más que veinte que no combinan.
Si prefieres explorar toda la biblioteca libremente, también existe el acceso a IconScout mediante la cuenta, que se abre con la extensión, el navegador seguro o la versión en la nube.
Cómo mantener la coherencia de un conjunto de iconos
El error que hace que las interfaces parezcan amateur es mezclar estilos. Sigue estas reglas.
- Una familia por proyecto. Elige un paquete y descarga de él. Si necesitas un icono que el paquete no tiene, busca la misma etiqueta de estilo, no solo el mismo tema.
- El mismo grosor de trazo. Compara iconos de línea de 2 px con iconos de línea de 2 px. No mezcles líneas finas y gruesas.
- El mismo estilo de esquinas. Esquinas redondeadas con esquinas redondeadas, angulosas con angulosas.
- El mismo tamaño de cuadrícula. Coloca todos los iconos en una cuadrícula de 24 px o 32 px para alinear con facilidad.
- Una sola lógica de color. Usa un único color o una paleta definida de dos colores ligada a tu marca.
Cómo usar bien las animaciones Lottie
Es fácil abusar de Lottie. Unas pocas animaciones pequeñas hacen que una interfaz parezca viva; diez a la vez resultan ruidosas.
- Usa la animación para explicar: una marca de verificación tras el pago, un indicador de carga mientras llegan los datos, un movimiento suave en un estado vacío.
- Mantén los bucles cortos y tranquilos. Busca un movimiento que apoye el contenido, no que compita con él.
- Respeta a los usuarios que prefieren menos movimiento. Ofrece una versión estática o pausa la animación para ellos.
- Comprueba el tamaño del archivo. Un archivo Lottie sencillo ocupa unos pocos kilobytes; uno complejo con muchas capas puede ser mucho más grande.
- Ajusta los colores de la animación a tu marca antes de publicarla.
Si trabajas el movimiento para vídeo, nuestra guía de plantillas de Motion Array cubre otro enfoque para los recursos de animación.
Cómo usar ilustraciones 3D en diseños reales
El arte 3D capta la atención, pero puede parecer genérico si solo se usa como decoración. Úsalo donde ayude a un mensaje: una sección principal con un único objeto potente, una tarjeta de característica con un concepto reconocible o la diapositiva de título de una presentación.
Mantén una sombra suave, una dirección de luz coherente y una paleta de colores limitada. Si tu página ya tiene fotos, no añadas 3D encima. Elige un único lenguaje visual por página.
Licencia y atribución
Cada recurso de IconScout tiene condiciones de licencia que dependen del tipo de licencia y, a veces, del creador. Algunos recursos requieren atribución, y ciertos usos, como vender el propio recurso o crear una biblioteca competidora, no están permitidos.
Comprueba la licencia en la página del recurso antes de publicar y conserva el nombre del recurso o del paquete junto con los archivos de tu proyecto. No redistribuyas los archivos descargados como si fueran tu propio paquete de iconos.
Puedes leer más sobre las condiciones habituales en recursos de stock y licencias explicados.
Ejemplos prácticos
Una página de precios: usa un conjunto de iconos de línea para las viñetas de características, una ilustración 3D para la sección principal y una diminuta marca de verificación Lottie para el estado de confirmación.
Una presentación para inversores: usa iconos PNG de un mismo paquete en cada diapositiva y un objeto 3D en la portada. No hacen falta animaciones, así que prescinde de Lottie.
La bienvenida de una aplicación móvil: tres archivos Lottie, uno por pantalla, con la misma paleta y la misma velocidad de movimiento.
Cómo encaja ZTOOLZ: ZTOOLZ ofrece acceso compartido a IconScout mediante cuentas propiedad de la plataforma, como una página de descarga donde pegas un enlace o como acceso a la cuenta que se abre con la extensión, el navegador seguro o la versión en la nube. No es una suscripción personal, y debes comprobar la licencia de cada recurso para tu proyecto. Abre el descargador de IconScout para ver nuestro precio actual, o añádelo a un plan personalizado con el botón + en la tienda.
Preguntas frecuentes
¿Puedo descargar animaciones Lottie como archivos JSON?
Sí, los recursos Lottie se ofrecen en JSON y, a veces, también en un formato dotLottie comprimido. Se reproducen con una biblioteca de reproductor Lottie en una página web o una aplicación.
¿Debo usar SVG o PNG para los iconos?
Usa SVG cuando el icono vaya a cambiar de tamaño o de color, como en sitios web y aplicaciones. Usa PNG para colocarlo rápido en diapositivas, documentos y publicaciones donde solo necesitas una imagen.
¿Puedo cambiar los colores de un icono descargado?
Con SVG, sí, en cualquier editor vectorial o en el código. Con PNG, los cambios de color son limitados. Los colores de Lottie se pueden cambiar con herramientas de edición de Lottie.
¿Necesito dar atribución?
Depende de la licencia del recurso. Consulta en la página del recurso si exige atribución y conserva el nombre del paquete para poder dar el crédito si hace falta.
¿Las ilustraciones 3D sirven para imprimir?
Pueden servir, si descargas una versión de alta resolución. Compara las dimensiones en píxeles con el tamaño de impresión y consulta nuestra guía sobre archivos para impresión frente a web antes de enviarlo a la imprenta.
