Guía7 min de lectura

Vídeo de demo de portafolio de Bubble

Muestre la app de Bubble funcionando en vez de pedirle a un revisor que la imagine.

Convierta una construcción activa de Bubble en una entrada de portafolio que muestre la app funcionando, no una captura, para un revisor de contratación.

Ver cómo funcionaLos primeros 60 segundos de vídeo son gratuitos, con marca de agua.
Verifique su correo electrónico para descargarlo.

gogoscreen.com

Elegir una construcción que demuestre la habilidad

Elija una construcción de Bubble del portafolio que demuestre una habilidad real, no solo una plantilla.

Abrir la versión activa y preparar los datos

Abra la versión activa de la aplicación y prepare datos de demostración seguros de mostrar.

Escribir la indicación y revisar el resultado

Escriba la indicación de una línea, solicite el vídeo y revise el resultado antes de añadirlo al portafolio.

Una entrada de portafolio de Bubble tiene un único trabajo: convencer a alguien que no construyó la aplicación de que quien lo hizo sabe lo que está haciendo. Una imagen estática de la pestaña de diseño del editor no puede hacer eso. Muestra disposición, no comportamiento, y el trabajo en Bubble es sobre todo comportamiento. El flujo de trabajo que se dispara al pulsar un botón, la regla de privacidad que decide qué filas de datos puede ver un usuario con sesión iniciada, el motor responsivo que reordena elementos cuando el navegador se estrecha: nada de eso sobrevive a una captura de pantalla. Un breve vídeo de la aplicación realmente en funcionamiento cierra esa brecha para un revisor que tiene treinta segundos y ninguna intención de hacer clic él mismo en un enlace de vista previa.

GogoScreen toma una URL de aplicación web y una línea que describe qué mostrar, y después devuelve un MP4 narrado y editado unos dos minutos después. Para una aplicación protegida por un inicio de sesión, puede usar una cuenta de demostración proporcionada. La edición es mecánica más que creativa: zooms en los clics, suavizado del cursor, silencios muertos eliminados, subtítulos incrustados. Eso basta para convertir un flujo de trabajo real en algo que un revisor observa en lugar de algo que se le pide que se crea.

¿Qué debe mostrar realmente una demo de portafolio de Bubble?

Elija el único flujo de la aplicación que un cliente que contrata o un responsable de agencia preguntaría primero. Para una construcción de mercado, suele ser un anuncio creándose y después apareciendo en un resultado de búsqueda. Para una herramienta interna, suele ser un registro introduciéndose y una vista posterior actualizándose porque se ejecutó un flujo de trabajo. Resista la tentación de recorrer todas las páginas que tiene la aplicación. Un revisor que decide si contratar a alguien no necesita un recorrido completo, necesita la prueba de que una sola pieza de lógica real funciona de principio a fin.

La mayoría de las aplicaciones de Bubble construidas para un portafolio están en el subdominio predeterminado bubbleapps.io en lugar de un dominio comprado, y está bien mostrarlo tal cual. Lo que importa es si la URL apunta a la versión activa o a una versión de prueba todavía en revisión interna. Diga cuál es en el texto que rodea la página para que nadie asuma que un trabajo en curso es el producto terminado.

Decisión de portafolio	Qué le señala al revisor	Qué evitar
Se muestra la versión activa	La construcción está terminada y se respalda	Presentar la versión de prueba como si estuviera publicada
Un flujo, de principio a resultado	Se demostró una habilidad concreta, no solo una disposición	Un recorrido por cada página sin ninguna acción completada
Datos de demostración preparados con antelación	El revisor ve una aplicación creíble, no una tabla vacía	Datos reales de un cliente o un tipo de dato en blanco

¿Cómo se maneja una pantalla de inicio de sesión en el flujo?

Un número considerable de construcciones de Bubble que merece la pena mostrar en un portafolio están protegidas por el tipo de dato de usuario incorporado de la aplicación, porque el comportamiento interesante, la vista personalizada o el registro vinculado a una cuenta, solo aparece una vez que alguien ha iniciado sesión. Proporcione una cuenta de demostración en lugar de saltarse el flujo o narrar alrededor de él. En GogoScreen, las credenciales proporcionadas se cifran, se usan para una única renderización y después se eliminan. Si primero se planifica un storyboard, las credenciales se conservan cifradas durante esa sesión y se eliminan como máximo dos horas después de su último uso. Ese es el tratamiento real, descrito de forma directa en lugar de suavizado.

Si una pantalla real está detrás de pasos de incorporación irrelevantes para la habilidad que se demuestra, prepare la cuenta de demostración pasando esos pasos con antelación para que el flujo grabado empiece en el momento que importa. Alguien que ve a otra persona hacer clic en cinco pantallas de configuración antes de llegar a la función real dejará de ver el vídeo antes de que aparezca la función.

Elija una construcción de Bubble del portafolio que demuestre una habilidad real, no solo una plantilla.
Abra la versión activa de la aplicación y prepare datos de demostración seguros de mostrar.
Escriba la indicación de una línea, solicite el vídeo y revise el resultado antes de añadirlo al portafolio.

¿Qué datos deben estar en la aplicación en el momento de grabar?

Un tipo de dato vacío en Bubble hace que incluso una lógica correcta parezca rota, porque quien lo ve no puede saber si una lista está vacía por diseño o porque no se ha introducido nada. Introduzca dos o tres filas de contenido de relleno creíble antes de solicitar la renderización. Use nombres y organizaciones inventados en lugar de la información de un cliente real, incluso si la construcción se hizo para un cliente real, salvo que ese cliente haya aprobado explícitamente que se le muestre.

Los datos preparados también protegen la grabación de un estado vacío accidental. Si un resultado de búsqueda, un contador de panel o una lista filtrada no tienen nada que mostrar, la renderización mostrará exactamente eso y no hay forma de corregirlo después. Comprobar la aplicación a mano antes de enviar una renderización, de la misma forma en que se comprueba cualquier construcción de prueba antes de grabarla, detecta esto antes de retener tiempo para una renderización que hay que repetir.

¿Dónde encaja esto junto a una captura de pantalla o un GIF estático?

Una captura de pantalla responde "cómo se ve". Un vídeo responde "si funciona". La mayoría de los portafolios se benefician de tener ambos, con el vídeo haciendo el trabajo más pesado. Cualquiera que haya intentado comprimir un flujo de varios pasos en un GIF en bucle conoce las concesiones, y la guía de alternativa en vídeo al GIF de demostración de producto explica por qué un vídeo narrado breve suele comunicar más en menos espacio del que puede una imagen animada.

Escriba la indicación de una línea de la misma forma en que le explicaría algo a un colega mirando por encima de su hombro: nombre la pantalla de inicio, la acción y el resultado que espera ver. La guía de indicaciones de vídeo de demostración de un agente de IA tiene más detalle sobre cómo redactar una indicación con la precisión suficiente para que la renderización coincida con lo previsto, en lugar de algo parecido.

Tenga en cuenta el sonido incluso para una entrada de portafolio que probablemente se verá primero sin audio. Alguien que se desplaza por una página de portafolio en un portátil de oficina no va a activar el sonido de nada, un punto tratado directamente en la guía de vídeo de demostración de producto sin sonido. Los subtítulos incrustados en la renderización transmiten el mensaje cuando el audio no es una opción.

¿Cómo se compara esto con una entrada de portafolio de Firebase Studio?

La disciplina subyacente es la misma en distintas plataformas de construcción aunque cambien los detalles de cada una. Un vídeo de demostración de Firebase Studio plantea una pregunta distinta, ya que las aplicaciones de Firebase Studio suelen desplegarse en Firebase Hosting y la vista previa dentro del propio espacio de trabajo no es algo que un cliente pueda abrir sin acceso al proyecto. La guía de vídeo de página de destino de Firebase Studio y la guía de vídeo de lanzamiento en Product Hunt de Firebase Studio tratan ambas sobre poner una aplicación delante de un desconocido que nunca la ha visto, lo que se acerca al problema del portafolio pero no es idéntico, ya que quien mira un portafolio ya sabe quién construyó la aplicación y está evaluando a quien la construyó, no decidiendo si registrarse. La guía de compartir un proyecto de Firebase Studio con un cliente está aún más cerca, porque entregar trabajo a alguien que no va a hacer clic en un enlace de vista previa es el mismo problema que un portafolio resuelve para un revisor de contratación.

Para una construcción hecha con un agente de programación de IA en lugar de a mano en el editor de Bubble, la pregunta de revisión cambia de nuevo, y la guía de vídeo de demostración de una solicitud de cambios de un agente de IA cubre lo que necesita ver un revisor cuando el cambio bajo revisión viene de una solicitud de cambios generada en lugar de una persona arrastrando elementos a un lienzo.

Antes de añadir una renderización terminada a un portafolio, véala una vez como lo haría un desconocido: sin contexto, sin sonido, en un teléfono si el portafolio se va a ver en uno. Si el flujo sigue teniendo sentido en frío, está listo. Si necesita una explicación escrita debajo para tener sentido, el flujo era demasiado amplio y debe acotarse antes del siguiente intento. Para todo lo demás del flujo de trabajo, desde el recorrido de revisión para una construcción de Bubble hasta las alternativas de Bubble a una herramienta de grabación de pantalla guiada, la página de precios para conocer los planes y las recargas, la biblioteca completa de guías, las páginas de comparación y la página de inicio de GogoScreen para el propio flujo de trabajo de URL e indicación, trate esto igual que cualquier otra construcción en revisión: compruébelo a mano antes de que lo haga cualquier otra persona.

Aclaraciones

Antes de empezar

¿Por qué falla una captura de pantalla como entrada de portafolio de Bubble?

Una captura de pantalla muestra un fotograma de una pestaña de diseño. No puede mostrar un flujo de trabajo disparándose, una regla de privacidad liberando los datos correctos, ni el motor responsivo reordenando una página en distintos anchos, y eso es exactamente lo que quiere comprobar quien revisa una construcción de Bubble.

¿Debe un vídeo de portafolio de Bubble usar la versión activa o la versión de prueba?

Use la versión que se espera que el revisor confíe. Una versión activa en el propio dominio de la aplicación se lee como trabajo terminado. Una versión de prueba está bien para una construcción todavía en revisión, pero diga cuál es para que nadie confunda un borrador con la app publicada.

¿Qué pasa si la app de Bubble requiere un inicio de sesión para llegar a la pantalla interesante?

Proporcione una cuenta de demostración desechable mediante el proceso aprobado. En GogoScreen, las credenciales se cifran, se usan para una única renderización y después se eliminan. Si primero se planifica un storyboard, las credenciales se conservan cifradas durante esa sesión y se eliminan como máximo dos horas después de su último uso. Nunca entregue un inicio de sesión real de un cliente para este propósito.

Pegue una URL, describa un flujo y obtenga un vídeo de demostración de su aplicación web.

Los primeros 60 segundos de vídeo son gratuitos, con marca de agua. Verifique su correo electrónico para descargar el vídeo.

Ver precios Leer las guías