Pack de escenas 3D · Descarga gratuita

8 escenas 3D de desarrollo web, gratis y descargables una por una

Los packs de 3D casi siempre llegan en bloque: un archivo con ocho objetos dentro. Si de esos ocho te sirve uno, el trámite es abrir el editor, buscar el que quieres entre las capas, borrar los otros siete sin llevarte por delante una luz, y recolocar lo que quede. Diez minutos de fontanería antes de empezar a trabajar.

Aquí ese trabajo ya está hecho. Este pack son ocho escenas 3D animadas de desarrollo web en formato .spline, y cada objeto va en su propio archivo: te bajas el velocímetro, o el candado de la VPN, o el megáfono de anuncios, sin arrastrar los otros siete. Abajo tienes la escena completa en vivo para verlas todas juntas, y luego las ocho por separado con su descarga individual.

La escena completa, en vivo

Esto no es un video ni una captura: es la escena real corriendo en tu navegador. Pulsa el botón y podrás girarla con el ratón, acercarte y ver la animación de cada objeto. Se carga solo cuando la pides, para no gastarle datos a quien solo viene a por un archivo.

  • Las ocho escenas 3D de desarrollo web flotando juntas sobre un fondo azul claro: velocímetro, gráfica SEO, inicio de sesión, búsqueda WWW, VPN, anuncios, historial y engranajes
    Desarrollo web desarrollo-web.spline

Las ocho piezas, una por una

Cada tarjeta descarga un ZIP con una sola escena, su portada y el LEEME. Ninguna pasa de 43 KB, así que puedes bajarte las que te interesen sin pensarlo. Si las quieres todas, el pack completo está un poco más abajo.

Las descargas están alojadas en MediaFire. Son ZIP normales: al abrirlos encontrarás el archivo .spline, la portada en WebP y un LEEME.txt en español con los pasos para abrirlo.

Por qué cada pieza va en su propio archivo

Porque separar ocho objetos a mano es exactamente el tipo de tarea que nadie quiere hacer dos veces. En el editor implica desplegar el árbol de capas, identificar qué grupo corresponde a qué objeto —los nombres originales vienen en inglés y no siempre son obvios—, borrar siete grupos con cuidado de no tocar la cámara ni la luz, y guardar. Multiplicado por ocho, si quieres tenerlos todos sueltos.

Lo hice una vez, por código, y comprobé archivo por archivo que el resultado es idéntico al original: misma geometría, mismos materiales, misma luz, misma cámara y la misma animación flotante. No hay reexportación ni pérdida por el camino; es el mismo objeto, solo que sin los otros siete al lado. Abres el archivo, pulsas Play y ya se está moviendo.

Un detalle honesto sobre la posición: cada objeto conserva las coordenadas que tenía dentro del conjunto, así que al abrir un archivo suelto puede aparecer desplazado del centro en lugar de justo en medio. Se arregla en dos segundos —selecciónalo y pon su Position X e Y en 0, o mueve la cámara a tu gusto—, pero prefiero avisártelo aquí a que lo descubras tú.

Descarga el pack completo

Si prefieres tenerlo todo de una vez, este ZIP trae las ocho escenas sueltas más la escena completa con los ocho objetos juntos — nueve archivos .spline en total—, la portada del conjunto y el LEEME.txt. Pesa 204 KB: menos que una foto del móvil. La descarga es directa y no pide registro ni correo.

Descargar las 8 escenas + el conjunto (ZIP · 204 KB)

Si este pack te sirvió, mira también las 5 escenas 3D del primer pack y el resto de recursos gratuitos — publicamos uno nuevo cada semana.

Qué es Spline y por qué importa el formato

Spline es un editor 3D que funciona en el navegador —también tiene aplicación de escritorio— y tiene plan gratuito. Un archivo .spline es su archivo de proyecto: guarda la escena completa (objetos, materiales, luces, cámara y animaciones), no una imagen del resultado. La comparación más justa es un archivo de Figma frente a una captura de pantalla del diseño.

Ahí está la diferencia con bajarse un PNG. Un render es la fotografía de un set que ya se desmontó: si el cliente quiere ese mismo objeto en su verde corporativo, te toca enmascarar y rezar para que las sombras no te delaten. Con la escena cambias el material y el resto responde solo. El encuadre tampoco viene decidido: mueves la cámara y exportas otra vez, en vertical para una historia o en plano cerrado para una miniatura. Y la animación la ajustas, la ralentizas o la quitas — un GIF se mueve como se mueve, y punto.

De archivo a tu web en cuatro pasos

  1. Abre el editor en spline.design y arrastra el archivo .spline (o usa Import → Spline).
  2. Edita lo que necesites: colores, materiales, textos, cámara, animaciones.
  3. Pulsa Play para comprobar cómo se ve en movimiento.
  4. Ve a Export → Web: obtienes un enlace público o un código para incrustar la escena interactiva en tu página.

Un aviso que sale de haber publicado estas escenas en este mismo sitio: en Export → Play Settings hay un ajuste de Renderer que por defecto puede venir en WebGPU. Cambialo a WebGL 2 antes de publicar. Con WebGPU la escena funciona en tu navegador pero le sale un mensaje de error a quien no lo tenga, y como en el tuyo se ve bien, no te enteras. Nos pasó con dos escenas del pack anterior.

Antes de ponerla en producción

Una escena 3D en vivo no es una imagen: se dibuja en tiempo real en el equipo de quien visita tu página. Tres costumbres que ahorran sustos:

  • Una escena por página. Como pieza protagonista de una cabecera funciona de maravilla; tres compitiendo en la misma pantalla, no. Con archivos sueltos la tentación de poner cuatro es real — resiste.
  • Prueba en un móvil de verdad, no solo en el modo responsive del navegador. Y si pones un titular encima de la escena, ajusta el fondo o las luces hasta que el texto se lea sin esfuerzo.
  • Guarda el archivo original como maestro. No lo sobrescribas con la versión de un proyecto concreto: duplica y edita la copia. Y si una página no puede permitirse el 3D en vivo, el plan B es exportar la misma escena como video o imagen — nadie pierde.

Licencia y uso

Sobre este pack

Conviene decir con claridad qué parte de este pack es trabajo mío. Los modelos 3D no lo son: no reivindico su autoría ni la presento como propia. Lo mío es todo lo que hay alrededor —la división de la escena en ocho archivos independientes y la verificación de que cada uno conserva intacta su geometría, sus materiales, su luz y su animación; la traducción de los nombres al español; el recorte de las ocho portadas; la organización de los nueve ZIP con su LEEME.txt; y la escena completa publicada aquí para que puedas verla antes de descargar nada—. Eso es lo que convierte un archivo en bloque en algo que se puede usar pieza por pieza.

Cómo usarlo

Por mi parte la descarga es directa: no te pido registro, ni el correo, ni atribución. Lo que exija la licencia de cada archivo lo fija su autor, no yo. Si el pack te sirve y quieres compartirlo, enlaza este artículo en lugar de subir los ZIP a otro sitio: así quien lo reciba tendrá siempre la versión actualizada.

Y una advertencia que prefiero dar antes que callar: no puedo conceder derechos en nombre de terceros. Antes de que una escena acabe en un encargo comercial —la cabecera de la landing de un cliente, la sección de producto de una tienda o una campaña de pago—, comprueba que las condiciones de ese archivo concreto encajan con ese uso. Es un minuto de revisión y evita el disgusto.

Si crees que algo no debería estar aquí

Si eres el autor de alguna de estas escenas, o representas a quien lo es, y no quieres que se distribuya desde aquí, escríbeme a agpublicista2021@gmail.com indicando este artículo y el archivo concreto. Retiro el enlace mientras reviso el caso, en un plazo de 48 a 72 horas: primero se retira, después hablamos si hace falta. El procedimiento completo está en el aviso legal.

Preguntas frecuentes

¿Puedo bajarme solo una de las ocho escenas?

Sí, y esa es justo la idea de este pack. Cada uno de los ocho objetos va en su propio archivo .spline, con su ZIP y su enlace de descarga independiente. Si solo necesitas el velocímetro no tienes que bajarte los otros siete ni entrar al editor a borrarlos uno a uno. También está el ZIP con las ocho juntas más la escena completa, por si prefieres tenerlo todo de una vez.

¿Qué es un archivo .spline y con qué se abre?

Es el archivo de proyecto del editor 3D Spline (spline.design): guarda la escena completa —objetos, materiales, luces, cámara y animaciones—, no una imagen renderizada. Se abre arrastrándolo al editor de Spline, que funciona en el navegador o con su aplicación de escritorio y tiene plan gratuito.

¿Las escenas sueltas conservan la animación?

Sí. Cada archivo individual mantiene su cámara, su luz y el movimiento flotante que tenía dentro del conjunto: lo abres, pulsas Play y ya se mueve solo, sin reconstruir nada. Lo único que cambia es que el objeto conserva la posición que ocupaba en la escena completa, así que puede aparecer descentrado al abrirlo; se arregla poniendo su Position X e Y en 0.

¿Cómo publico la escena en mi web o la llevo a Blender?

Las dos cosas salen del menú de exportación de Spline. Con Export → Web obtienes un enlace público o un código para incrustar la escena interactiva en tu página. Y con Export → 3D Formats la exportas como GLTF, GLB, OBJ, STL o USDZ para seguir trabajándola en otro software. También puedes sacarla como imagen (JPG/PNG) o video (MP4/GIF/WebM).

¿Con qué condiciones puedo usarlas?

La descarga es libre y no pide registro ni correo. Para el uso, la referencia es la sección «Licencia y uso» de este mismo artículo: las condiciones de cada archivo las fija quien lo creó, así que conviene comprobarlas antes de que una escena acabe en un encargo comercial. Y si quieres compartir el pack, enlaza este artículo en lugar de volver a subir el ZIP a otro sitio.

Compartir

Sigue aprendiendo

Más recursos para tu próximo proyecto

Packs y herramientas que combinan de maravilla con estas escenas.

Ver todos los recursos →

Lienzo en YouTube

Un pack nuevo cada semana

Iconos, sonidos, escenas 3D, plantillas de After Effects y procesos creativos reales. Suscríbete y no te pierdas el próximo recurso gratuito.