Reflexión sobre el caso de estudio: La odisea de distribuir una Aplicación Web Progresiva
Autor: @lmk4t
Fecha: 25/11/25
Materia: Desarrollo de Aplicaciones Web Progresivas
Profesor: @frexus
Caso de estudio
He leído y analizado el caso publicado por el profesor:
https://steemit.com/pwa/@frexus/la-odisea-de-distribuir-una-aplicacion-web-progresiva
En este caso se aborda el tema de empaquetado para PWA, donde se presenta una situación real o simulada para aplicar los conceptos vistos en clase.
Esta lectura nos demuestra que la distribución es tan determinante en el éxito de una PWA, pues de nada sirve tener una aplicación técnicamente impecable si las personas no pueden encontrarla o usarla fácilmente. La forma en que una app se distribuye define su alcance, visibilidad y credibilidad. Una buena estrategia de distribución permite que más personas conozcan, instalen y adopten la aplicación. Publicarla en tiendas oficiales como Google Play le da más alcance, legitimidad y confianza. Los usuarios perciben las apps de las tiendas como más seguras y confiables, lo que permite que sean descargadas más rápido. Además, las tiendas ofrecen herramientas de posicionamiento (reseñas, valoraciones, categorías y recomendaciones) que aumentan la visibilidad.
Por otra parte, teneos la distribución privada o interna, la cual es conveniente cuando se busca controlar el acceso a la aplicación o proteger información sensible. Por ejemplo, en entornos empresariales, educativos o institucionales donde solo cierto grupo de personas debe usar la app.
Una de las áreas donde más se pueden explotar estas tecnologías reside en la educativa, la adopción de PWAs en la educación es fundamental. Sin embargo, muchos usuarios aún desconocen que una PWA puede instalarse como una aplicación nativa o funcionar sin conexión. Enseñarles a “agregarla a la pantalla de inicio”, usarla offline o entender sus ventajas es clave para su adopción. Mariana comprobó que su público no aprovechaba la instalación porque no sabía cómo hacerlo. Educar al usuario reduce barreras y convierte la tecnología en algo accesible y cercano.
Podemos observar que, en general, se brinda un mejor acceso a las PWA publicándolas en tiendas para que sean visibles para una gran parte de los usuarios. A pesar de ello, Considero que se podría mejorar la visibilidad de una PWA sin recurrir a tiendas mediante estrategias de posicionamiento SEO, uso de códigos QR, campañas en redes sociales, participación en comunidades, optimización de metadatos (manifest.json) y promoción en eventos presenciales. También puede incluirse en catálogos de software libre o sitios de innovación local. El objetivo es que el público la encuentre fácilmente desde distintos canales sin depender de las tiendas oficiales.
La experiencia de Mariana muestra que no existe un único camino de distribución. Combinar varios canales —web, tienda oficial y presencia física con QR— permitió llegar a públicos distintos sin excluir a nadie. Para proyectos educativos o sociales, esto enseña que la inclusión digital implica ofrecer opciones adaptadas a las capacidades y hábitos del público. La clave está en unir accesibilidad, visibilidad y confianza para maximizar el impacto y lograr que la tecnología realmente conecte con las personas.
Reflexión personal
Del caso aprendí que el éxito de una PWA no depende únicamente de su calidad técnica, sino de la estrategia utilizada para distribuirla. Mariana había desarrollado una aplicación funcional, rápida y con capacidades offline, pero aun así no lograba llegar a los usuarios porque su principal obstáculo era la visibilidad. La historia muestra que existen diferentes rutas de distribución —web directa, tiendas oficiales, canales privados y modelos híbridos— y que cada una tiene ventajas y limitaciones.
Yo habría tomado decisiones similares a las de Mariana, pero desde el principio habría pensado en una estrategia de distribución híbrida. Primero, mantendría la PWA disponible en la web con buen SEO para aprovechar su accesibilidad. Después, la empaquetaría para Google Play utilizando herramientas como PWABuilder o Bubblewrap, con el fin de ofrecer una opción más confiable para quienes buscan apps en tiendas oficiales.
Actividades complementarias
- Podcast escuchado: Empaquetar y distribuir una PWA https://audius.co/frexus/empaquetar-y-distribuir-una-pwa
Tema tratado: El podcast habla sobre Luis, que creó una PWA para promover el cuidado del medio ambiente la cual no era lo suficientemente visible. Por ello, fue empaquetada y publicada a los usuarios.
Práctica desarrollada:https://steemit.com/pwa/@frexus/empaquetar-tu-pwa-para-distribucion-en-tiendas
Se realizó una práctica para empaquetar una PWA. En este caso utilicé el mismo archivo de la práctica anterior, pues es sólo para prueba.
Paso 1: Entré a la página de PWA Builder y coloqué la URL de la página subida en GitHub.
Paso 2: Después de ello, en automático nos deja instalar en diferentes formatos, en este caso elegí para android.
Paso 3: Para instalar bubblewrap en windows ejecuté el comando npm install -g @bubblewrap/cli
Paso 4: Después de instalar ejecuté el comando --version para poder instalar el jdk y el sdk.
Paso 5:Ejecuté bubblewrap init --manifest https://lezlyeguerrero2004-debug.github.io/pruebaempaquetado/manifest.json en una carpeta para el proyecto. Después de esto nos hace unas preguntas para las configuraciones básicas de la instalación, como nombre de la app, ID del paquete, ruta de salida, etc.
Paso 6: Ya que se realizó el proceso, ejecuté bubblewrap build para crear los archivos .apk y .aab
Paso 7: Instalé el apk en mi celular.
Actividades lúdicas completadas:
Evidencias visuales
- Sopa de letras:
Ilustración 1. Evidencia Sopa de Letras. Fuente: Creación propia
La Ilustración 1 muestra los resultados de la sopa de letras realizada.
- Crucigrama
Ilustración 2. Evidencia Crucigrama. Fuente: Creación propia
La Ilustración 2 presenta los resultados obtenidos al realizar el crucigrama.
- Capturas de la práctica
Ilustración 3. Subida de PWA a PWA Builder. Fuente: Creación propia
En la ilustración 3 se muestra la pantalla de subida de la URL de la PWA al sitio de la herramienta.
Ilustración 4. Formatos de empaquetamiento. Fuente: Creación propia
La ilustración 4 presenta los formatos para el empaquetado de la PWA. Se eligió Android.
Ilustración 5. Instalación de bubblewrap. Fuente: Creación propia.
Se instaló bubblewrap desde la consola con el comando que se muestra en la ilustración 5.
Ilustración 6.Configuración de app. Fuente: Creación propia.
Como se puede notar en la ilustración 6, se deben especificar aspectos básicos de la pwa, como el dominio, ID, entre otros.
Ilustración 7.Exportación de archivos de descarga. Fuente: Creación propia.
Se exportan los archivos .apk y .aab con el comando que se muestra en la ilustración 7.
Ilustración 8.Descarga de la PWA. Fuente: Creación propia.
En la ilustración 8 se muestra la pantalla de la instalación correcta de la PWA en el dispositivo móvil.
Ilustración 9.Descarga de la PWA. Fuente: Creación propia.
En la ilustración 9 se observa la aplicación en la pantalla de inicio.
Conclusiones finales
Aprendí cómo una PWA no solo debe funcionar bien técnicamente, sino que también necesita una estrategia adecuada de distribución para llegar a los usuarios. Comprendí las diferencias entre publicar una PWA desde la web, empaquetarla para tiendas oficiales o combinar ambos modelos. En un contexto real, aplicaría estos conocimientos para elegir la ruta de distribución más adecuada según el público objetivo, asegurando visibilidad, accesibilidad y confianza al lanzar una aplicación.
Lo que fue más complicado para mí, fue el empaquetado con bubblewrap, pues me mandaba muchos errores al momento de exportar el build. Esto era debido a que el launchURL no estaba bien definido. Para arreglarlo modifiqué el archivo build y dejé el launchURL en "/".
Backlinks y referencias
- Post original del profesor en Steem
- Podcast del profesor en Audius
- Mi comentario en el post original
Este post forma parte de la actividad de aprendizaje correspondiente a tercera unidad.
Publicación realizada con fines educativos como parte del curso de Desarrollo de Aplicaciones Web progresivas.