¿Cómo diseñar una pantalla de carga personalizada en Bubble.io?

Paso 1: Accede al editor de tu aplicación Bubble.io iniciando sesión en tu cuenta de Bubble.io y abriendo la aplicación que deseas personalizar.

Paso 2: En tu editor, ve a la pestaña "Configuración" que se puede encontrar en el menú superior.

Paso 3: En la categoría "General", ubica la sección titulada "Apariencia general". Verás opciones para personalizar elementos como Favicon, color de la barra de progreso, color del girador del grupo repetitivo y, lo que es importante para las pantallas de carga, las imágenes de inicio para varios dispositivos.

Paso 4: Para pantallas de carga personalizadas en dispositivos móviles, puedes subir imágenes de inicio que se mostrarán mientras la aplicación se está cargando. Sigue estas medidas:

• Para iPhone (por ejemplo, imagen de inicio del iPhone 5): Usa una imagen con dimensiones de 640 x 1096 píxeles.
• Para iPad en modo retrato (por ejemplo, imagen de inicio del iPad - retrato): Usa una imagen con dimensiones de 1536 x 2008 píxeles.
• Para iPad en modo paisaje (por ejemplo, imagen de inicio del iPad - paisaje): Usa una imagen con dimensiones de 1496 x 2048 píxeles.

Paso 5: Haz clic en el botón de subir junto a la opción de imagen de inicio del dispositivo respectivo y selecciona la imagen que deseas usar desde tu computadora. La imagen debe ser una representación de tu marca o una indicación de que la aplicación se está cargando.

Paso 6: Después de subir, guarda tus cambios haciendo clic en el botón "Guardar" en la parte superior de la pestaña Configuración.

Paso 7: Previsualiza tu aplicación para asegurarte de que la pantalla de carga personalizada aparece correctamente en los dispositivos que personalizaste. Ajusta las imágenes si es necesario para una visualización óptima.

Paso 8: Para aplicaciones web o para mejorar aún más la experiencia de carga, considera implementar retroalimentación visual adicional como un girador personalizado o una barra de progreso usando las configuraciones "Color de la barra de progreso" y "Color del girador del grupo repetitivo". Puedes seleccionar un color para estos o hacerlos invisibles si lo deseas.

Recuerda, esto solo cubre los aspectos visuales de una pantalla de carga. Para una experiencia completa, es posible que necesites diseñar animaciones o lógica adicional utilizando flujos de trabajo que controlen cuándo y cómo aparece la pantalla de carga durante la operación de tu aplicación.