Proceso creativo de una App

Hola buenos días,

Con la entrada de la infografía ya he desvelado que he creado una app para la empresa que habíamos creado la evaluación pasada, pero ¿como hicimos esa aplicación? Hoy os lo enseño.

Con esta entrada os explico el proceso creativo de creación y los fallos para que vosotros no lo repitáis. Desde que se planteó esta tarea se nos ofreció principalmente la opción de App Inventor ya que era la que combinaba bien la sencillez y la gran cantidad de opciones respecto a, por ejemplo, Scratch (que pese a ser simple te da pocas opciones) o Android Studio (que se basa en código y sería un suicidio crear una aplicación sin haber trabajado con código con anterioridad). App Inventor simplifica el código árido de un programa de diseño de aplicaciones y lo transforma en bloques para que sea más fácil de usar. 

Sabiendo esto, os cuento. Yo empecé aprendiendo el funcionamiento básico. Como adecuo hacer con los programas que voy aprendiendo a usar primero toqueteo sin tener ni idea y si la cosa ya no avanza más y me pierdo recurro a tutoriales. Esto no es por nada en especial sino porque es muy difícil encontrar un tutorial que te enseñe a una velocidad respetable. Por mi cuenta llegue a entender las dos clases de paneles, lo visible y lo invisible, la pantalla del móvil donde se colocan objectos y la pantalla de bloques. Tras esto vi un par de vídeos sobre los layouts porque me frustraba al no entender como conseguir poner un componente al lado de otro o cosas así y pues lo solucioné así. Cuando ya entendí un poco la colocación de los objectos en pantalla fui componente por componente viendo el apartado de ayuda de la aplicación para entender el funcionamiento del código.

Para casos puntuales como el List Picker o el funcionamiento del Clock y el Tiny DB me iba viendo videotutoriales especializados en esa materia.

Nota: Cuando me di cuenta que se podía poner la aplicación en castellano ya me había acostumbrado a usarla en ingles.

Todo esto que os voy contando me iba ocurriendo durante la creación, a medida que se me iba ocurriendo cosas las iba añadiendo, por ejemplo, el botón de compartir no estaba pensada desde el principio y la barra lateral me parecía muy compleja al principio porque en el tutorial que vi usaban muchos relojes para retrasar el movimiento tras la presión en el botón. Sobre ello, no cambiaría nada, tal vez si hubiera sido otro caso el ir añadiendo cosas no pensadas desde el principio hubiera sido un rollo tremendo, pero en mi caso no me produjo ningún problema. Lo que sí resaltaría es que debería haber hecho un aprendizaje introductorio más completo para poder ir más rapido durante el proceso y ser más eficiente al no tener que andar consultando dudas durante el tiempo de creación.

Centrándome más en el proceso de construcción tengo que resaltar una cosa muy importante, no dejes las pruebas para el final. Aunque lo lógico es testear todo al final cuando haces trabajos que te exigen pensar mucho no es bueno dejar la prueba para el final ya que si algo falla tendrás que volver a pensar que cristo has montado ahí y entender el fallo. Si vas poco a poco testeando por ventana o por acción podrás olvidarte de esa acción y centrarte en otra cosa. Como segunda cosa de la que ya me habían avisado y no me parecía importante es nombrar bien las cosas, créeme es importante. Cuando tienes dos objectos y les llamas objecto 1 y objecto 2 cuando vayas a retomar la aplicación después de una semana tendrás que volver a mirar como se llama cada uno. Si sigues un patrón descriptivo que tu entiendas cuando vayas a retomar la aplicación después de una semana dirás "Seguro que yo con esto me refería a esto otro" y así ahorraras mucho tiempo y muchas confusiones.

Una labor ultra cansina es nombrar cosas, me refiero a, por ejemplo, cuando en un tinydb almacenas el valor de una camiseta y luego en el carrito tienes que ponerle nombre a esa camiseta tendrás que ir una por una nombrándolas. Así con todos los bloques de texto y imágenes de prendas de ropa y muchas otras cosas. Este trabajo si algo tiene es que a pesar de ser cansino es fácil de entender por lo que le dije a Luis que lo hiciese.

Uno de los problemas que se os planteará al crear una aplicación en grupo con App Inventor es que no podéis hacer el trabajo en común y tendréis que usar una cuenta, por lo que solo podrá trabajar uno a la vez. En nuestro caso yo trabajaba en la aplicación y ellos en el apartado gráfico desde Gimp ya que había que crear también varias camisetas y sudaderas de hombre y mujer para que la aplicación tuviese un mínimo de realismo.

Ese proceso gráfico fue bastante sencillo aunque igual de cansino que el que antes mencionamos ya que es muy monótono. Agarrar una foto de lo que queremos representar, agarrar otra de una camiseta o de la prenda que sea, variar el color de la camisetas mediante la herramienta de selección por color y la herramienta de colorear, y por ultimo exportar cada diseño. Algunas veces el diseño era minimamente más complejo desaturando y posterizando a dos colores la imagen a representar, como en el caso de la sudadera de la Torre de Hércules que se usó en la infografía de Curros Enriquez.

Termino ya enseñandoos la primera presentación que hicimos sobre lo que queríamos hacer, y la segunda presentación sobre el resultado. Si bien no he conseguido que funcione del todo, estoy muy orgulloso y satisfecho del trabajo hecho porque creo que el fallo es externo y de haber salido sería una aplicación preparada para ser usada en una situación real.

1º Presentación

2º Presentación

Como puedes ver, la diferencia es mínima en cuanto a ideas. Sí que es cierto que unificamos la ventana de elección de productos porque App Inventor no nos dejaba crear más pestañas y, en vez de que el scrollable fuese hacía abajo, lo hicimos hacía el lado.

Como ya se puede observar en la aplicación, no se ha podido hacer funcionar la ventana de prendas por lo que ya desde la pestaña de inicio hay que usar la pestaña lateral para navegar por las distintas pestañas.

Por último, espero que el enseñar el código de la aplicación en la segunda presentación os pueda servir para aprender algo para una hipotética aplicación en el futuro.

Saludos.