Scroll Worldpor oso95

Scroll World Skill.

Un recorrido de cámara prerrenderizado controlado con el desplazamiento, no un mundo 3D en vivo.

Animación con scroll
Vídeo
Páginas de aterrizaje

Revisión de la fuente · Scroll WorldSKILL.md

Tarea Animación con scroll Produce • Una página de aterrizaje controlada por scroll con textos por sección y una llamada a la acción final • Imágenes de escena generadas, clips de cámara y los conectores necesarios • Recursos de vídeo optimizados, pósteres de respaldo y una revisión de las transiciones entre clips Antes de empezar El flujo documentado usa Higgsfield y una vía de vídeo de Monid, además de ffmpeg/ffprobe y un entorno de navegador. Las cuentas de proveedores, los créditos, las capacidades de los modelos y cualquier ruta opcional de imágenes requieren una verificación actualizada.

Resumen editorial · fuente revisada 2026-10-07 · no es un ejemplo generado

01 Qué hace

Scroll World

Un flujo de trabajo de página de aterrizaje con vídeo generado, basado en la arquitectura de cámara, la continuidad con fotogramas reales, el scroll-scrub y decisiones explícitas sobre móvil y presupuesto de renderizado.

Flujo basado en la fuenteNo es una prueba de ejecución

El enfoque de trabajo

Scroll World crea una página de aterrizaje cuya posición de scroll controla un vuelo de cámara prerrenderizado. Las imágenes de escena se convierten en clips de vídeo y un motor JavaScript asigna el desplazamiento al tiempo de reproducción. El mundo aparentemente tridimensional es metraje generado, no una escena WebGL navegable con geometría editable. Su portabilidad procede de un motor autónomo que puede integrarse en distintas pilas de frontend.

La fuente distingue entre un recorrido continuo hacia delante y un vuelo por un mundo en miniatura con clips de conexión independientes. En ambos casos, los fotogramas límite renderizados importan más que reutilizar una imagen original de aspecto similar. El siguiente clip debe condicionarse con metraje vecino real, y aun así hay que inspeccionar las uniones. El flujo también trata una cadena vertical para móvil como una decisión de producción aparte, con coste de renderizado adicional, no como un recorte silencioso de la película de escritorio.

Entregables previstos

Una página de aterrizaje controlada por scroll con textos por sección y una llamada a la acción final
Imágenes de escena generadas, clips de cámara y los conectores necesarios
Recursos de vídeo optimizados, pósteres de respaldo y una revisión de las transiciones entre clips

Ver el briefing de ejemplo

Del briefing a la revisión

01
Elige el recorrido
Define el tema, las escenas ordenadas, el kit de marca, la dirección de arte y el estilo de cámara. Confirma si la producción será solo para escritorio o con formato vertical nativo y aprueba una estimación de renderizado actualizada.
02
Establece el mundo visual
Genera imágenes cohesionadas con un briefing visual compartido. Revisa la coherencia entre escenas antes de comprometerte con una cadena de generaciones de vídeo de pago.
03
Encadena fotogramas reales
En un recorrido hacia delante, usa el final del clip anterior como entrada del siguiente. Para los conectores aéreos, usa fotogramas realmente renderizados de ambos clips vecinos en lugar de las imágenes originales de las escenas.
04
Codifica y prueba el scroll
Prepara recursos que admitan búsqueda, monta el motor portátil e inspecciona el comportamiento de las uniones, el scroll inverso, los pósteres de respaldo y el movimiento reducido. Prueba por separado la cadena vertical si se encargó.

02 Cuándo usarlo

Cuándo usarla

El flujo documentado usa Higgsfield y una vía de vídeo de Monid, además de ffmpeg/ffprobe y un entorno de navegador. Las cuentas de proveedores, los créditos, las capacidades de los modelos y cualquier ruta opcional de imágenes requieren una verificación actualizada.

Buena opción

Un recorrido narrativo de marcaÚtil cuando un producto o negocio puede explicarse como una secuencia de lugares o fases de un proceso que se benefician de una relación de cámara continua.
Integraciones independientes del frameworkEl motor documentado es JavaScript puro, así que el flujo de trabajo del metraje no depende de ningún framework de aplicación concreto.

Límites que conviene comprobar

Metraje generado, no prueba realEl mundo es una construcción ilustrativa. No debe presentarse como metraje documental de instalaciones, productos o acontecimientos que en realidad no muestra.
Servicios de pago y cambiantesEl renderizado requiere acceso a proveedores y presupuesto. La fuente contiene observaciones fechadas sobre proveedores, por lo que hay que comprobar esquemas de modelos, disponibilidad, facturación y comportamiento de las uniones antes de una nueva producción.

Aporta estos elementos

Historia de la empresaDescribe el tema y las escenas ordenadas, con un titular y un texto explicativo breve para cada fase.
Cámara y dirección de arteElige un recorrido realista, un vuelo aéreo por un mundo en miniatura o un tratamiento con ángulo fijo, junto con los colores y rasgos de marca aprobados.
Presupuesto de producciónIndica el acceso a proveedores, los límites de gasto y si hace falta una cadena vertical aparte. Reserva tiempo para revisar y sustituir los clips fallidos.

03 Decisiones importantes

Decisiones clave

Las uniones son un recurso de producción
Los fotogramas límite extraídos hacen de la continuidad una parte inspeccionable del flujo. Un fundido cruzado por sí solo no puede ocultar un gran cambio en la composición de la escena.
El móvil es un entregable explícito
Una cadena de cámara vertical puede conservar el sujeto y la composición en los teléfonos. Tratarla por separado hace visibles el presupuesto y el equilibrio visual, en lugar de ocultar un problema de recorte.

04 Ejemplo de brief

Prueba un briefing concreto

El briefing de ejemplo siguiente no se ha probado. Revisa la configuración de la skill antes de usarlo.

Revisa la configuración

Usa las referencias del motor y del flujo del repositorio. Comprueba las capacidades y los precios actuales de los proveedores y obtén aprobación antes de ejecutar generaciones de pago.

Archivo fuente original

https://github.com/oso95/scroll-world/blob/71cc36d3bb150248ae36a2c552f9cbf88802a79c/skills/scroll-world/SKILL.md

Empieza con un solo entregable

Adapta el alcance, el material de partida y las restricciones de este briefing antes de ejecutar la skill.

Briefing de ejemplo

Usa Scroll World para planificar un recorrido ilustrativo desde una plantación de té hasta una bebida terminada en cinco escenas en miniatura. Usa los colores de marca que te proporcionamos y un estilo de cámara aérea de diorama. Antes de generar nada, verifica el backend de renderizado actual y estima la producción solo para escritorio con margen para repeticiones. Muestra primero el plan de escenas y la dirección de las imágenes. No crees una cadena para móvil ni incurras en costes de renderizado sin aprobación.

Inspecciona el resultado

Comprueba el resultado real con estos criterios observables.

Se han revisado los clips vecinos justo antes y después de cada unión, en ambas direcciones de scroll.
El modo de movimiento reducido muestra imágenes fijas utilizables y textos de sección legibles.
Cualquier versión móvil declarada sirve realmente recursos verticales y no un recorte horizontal no divulgado.

OpenDesign ofrece un espacio de diseño local para agentes de programación. Este listado no significa que la skill esté incluida ni que sus herramientas externas, credenciales y dependencias de software estén incluidas.

Descargar OpenDesign Leer la guía rápida

05 Fuente y licencia

Fuente y licencia

Esta página describe la revisión fijada de la fuente enlazada abajo. El comportamiento y los requisitos originales pueden cambiar.

Propietario de la fuente: oso95
Repositorio: oso95/scroll-world
Archivo de la skill: skills/scroll-world/SKILL.md
Licencia: MIT
Versión revisada: 2026-10-07 · 71cc36d3bb15

Resumen editorial de la fuente

Un flujo de trabajo de página de aterrizaje con vídeo generado, basado en la arquitectura de cámara, la continuidad con fotogramas reales, el scroll-scrub y decisiones explícitas sobre móvil y presupuesto de renderizado.

Resumen original de OpenDesign, basado en la fuente enlazada. Las estrellas del repositorio son una señal de popularidad fechada, no el uso de la skill ni una puntuación de calidad.

06 Preguntas antes de empezar

Preguntas antes de empezar

¿Crea una escena 3D en tiempo real?

No. La página controla con el scroll un vídeo prerrenderizado. Eso produce movimiento de cámara sin ofrecer a los visitantes navegación libre por un modelo 3D en vivo.

¿Por qué no conectar las imágenes originales?

Los clips generados pueden diferir de sus referencias iniciales. Los fotogramas límite realmente renderizados ofrecen una transición visual más cercana que una nueva interpretación de la misma imagen.

¿Se incluye automáticamente una película para móvil?

No. La fuente exige una decisión aparte para una cadena vertical nativa. Los ajustes de reproducción específicos para teléfonos del motor son independientes de producir ese metraje adicional.

OpenDesign

Deja espacio para la siguiente iteración de diseño.

Mantén tu briefing, tu material de partida y tu trabajo de diseño juntos en un espacio de trabajo local. Revisa la configuración propia de la skill antes de añadirla a tu flujo de trabajo.

Descargar OpenDesign Explorar skills de diseño