Educación Tecnológica Actividades para los estudiantes estudiantes Mi primera app Serie PROFUNDIZACIÓN NES Primer año Educación Tecnológica Mi primera app JEFE DE GOBIERNO Horacio Rodríguez Larreta G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. MINISTRA DE EDUCACIÓN María Soledad Acuña JEFE DE GABINETE Luis Bullrich DIRECTOR GENERAL DE PLANEAMIENTO EDUCATIVO Javier Simón GERENTA OPERATIVA DE CURRÍCULUM Mariana Rodríguez SUBSECRETARIO DE TECNOLOGÍA EDUCATIVA Y SUSTENTABILIDAD Santiago Andrés DIRECTORA GENERAL DE EDUCACIÓN DIGITAL Mercedes Werner GERENTE OPERATIVO DE TECNOLOGÍA E INNOVACIÓN EDUCATIVA Roberto Tassi SUBSECRETARIA DE COORDINACIÓN PEDAGÓGICA Y EQUIDAD EDUCATIVA María Lucía Feced Abal SUBSECRETARIO DE CARRERA DOCENTE Manuel Vidal SUBSECRETARIO DE GESTIÓN ECONÓMICO FINANCIERA Y ADMINISTRACIÓN DE RECURSOS Sebastián Tomaghelli SUBSECRETARIA DE LA AGENCIA DE APRENDIZAJE A LO LARGO DE LA VIDA Eugenia Cortona 2 Educación Tecnológica Mi primera app DIRECCIÓN GENERAL DE PLANEAMIENTO EDUCATIVO (DGPLEDU) GERENCIA OPERATIVA DE CURRÍCULUM (GOC) Mariana Rodríguez G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. EQUIPO DE GENERALISTAS DE NIVEL SECUNDARIO: Bettina Bregman (coordinación), Cecilia Bernardi, Ana Campelo, Cecilia García, Marta Libedinsky, Carolina Lifschitz, Julieta Santos ESPECIALISTAS: Sebastián Frydman (coordinación), Alejandro Breitman AGRADECIMIENTOS: a Micaela Viegas Domina LECTURA CRÍTICA: Vanina Arca SUBSECRETARÍA DE TECNOLOGÍA EDUCATIVA Y SUSTENTABILIDAD (SSTES) DIRECCIÓN GENERAL DE EDUCACIÓN DIGITAL (DGED) GERENCIA OPERATIVA DE TECNOLOGÍA E INNOVACIÓN EDUCATIVA (INTEC) Roberto Tassi ESPECIALISTAS DE EDUCACIÓN DIGITAL: Julia Campos (coordinación), Pamela Catarin, Josefina Gutierrez EQUIPO EDITORIAL DE MATERIALES Y CONTENIDOS DIGITALES (DGPLEDU) COORDINACIÓN GENERAL: Silvia Saucedo COORDINACIÓN EDITORIAL: Marcos Alfonzo EDICIÓN Y CORRECCIÓN: Bárbara Gomila CORRECCIÓN DE ESTILO: Ana Premuzic DISEÑO GRÁFICO Y DESARROLLO DIGITAL: Octavio Bally, Ignacio Cismondi ASISTENCIA EDITORIAL: Leticia Lobato ILUSTRACIÓN: Susana Accorsi PRODUCCIÓN AUDIOVISUAL: Joaquín Simón, Sebastián Frydman ISBN: en trámite Se autoriza la reproducción y difusión de este material para fines educativos u otros fines no comerciales, siempre que se especifique claramente la fuente. Se prohíbe la reproducción de este material para venta u otros fines comerciales. Las denominaciones empleadas en este material y la forma en que aparecen presentados los datos que contiene no implican, de parte del Ministerio de Educación del Gobierno de la Ciudad Autónoma de Buenos Aires, juicio alguno sobre la condición jurídica o nivel de desarrollo de los países, territorios, ciudades o zonas, o de sus autoridades, ni respecto de la delimitación de sus fronteras o límites. La mención de empresas o productos de fabricantes en particular, estén o no patentados, no implica que el Ministerio de Educación del Gobierno de la Ciudad Autónoma de Buenos Aires los apruebe o recomiende de preferencia a otros de naturaleza similar que no se mencionan. Fecha de consulta de imágenes, videos, textos y otros recursos digitales disponibles en Internet: 15 de junio de 2020. © Gobierno de la Ciudad Autónoma de Buenos Aires / Ministerio de Educación. Dirección General de Planeamiento Educativo / Gerencia Operativa de Currículum, 2020. Carlos H. Perette y Calle 10 – C1063 – Barrio 31 - Retiro - Ciudad Autónoma de Buenos Aires. © Copyright © 2020 Adobe Systems Software. Todos los derechos reservados. Adobe, el logo de Adobe, Acrobat y el logo de Acrobat son marcas registradas de Adobe Systems Incorporated. 3 Educación Tecnológica Mi primera app ¿Cómo se navegan los textos de esta serie? Los materiales de Profundización de la NES cuentan con elementos interactivos que permiten la lectura hipertextual y optimizan la navegación. Estos reflejan la interactividad general de la serie. Para visualizar correctamente la interactividad se sugiere bajar el programa Adobe Acrobat Reader que constituye el estándar gratuito para ver e imprimir documentos PDF. Pie de página Volver a vista anterior Adobe Reader Copyright © 2020. Todos los derechos reservados. Ícono que permite imprimir. Portada G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Al cliquear regresa a la última página vista. Flecha interactiva que lleva a la página posterior. Folio con flechas interactivas que llevan a la página anterior y a la página posterior. 4 Itinerario de actividades Actividad 1 Introducción al mundo de las apps 1 Organizador interactivo que presenta la secuencia completa de actividades. Actividades Actividad 1 Introducción al mundo de las apps Botón de navegación. Todos los días se producen nuevas aplicaciones para celulares y con muchas funcionalidades, pero ¿esto fue siempre así? Posición de la actividad en la secuencia. Íconos y enlaces 1 Cita o nota aclaratoria. Click para abrir pop-up: Ovidescim repti ipita voluptis audi iducit ut qui Los números indican las referencias de notas al final del documento. Título del texto, de la actividad o del anexo Indica enlace a una actividad o un anexo. El color azul y el subrayado indican un vínculo a la web o a un documento externo. 4 Educación Tecnológica Mi primera app Itinerario de actividades Actividad 1 G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Introducción al mundo de las apps Actividad 2 Herramientas y habilidades del desarrollo en el mundo profesional Actividad 3 Descubrí el desarrollo de apps con MIT App Inventor 2 Actividad 4 ¡Manos a la obra! Resolución de un caso de desarrollo móvil Actividad 5 Desafío creativo Actividad 6 Ateneo de apps. Compartí tu proyecto 1 2 3 4 5 6 5 Educación Tecnológica Mi primera app Introducción al mundo de las apps Actividad 1 G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Todos los días se producen nuevas aplicaciones para celulares y con muchas funcionalidades, pero ¿esto fue siempre así? Cuando se mencionan las aplicaciones para celulares, se las suele llamar de forma abreviada apps y, a través de ellas, se pueden realizar muchas acciones y atender muchas necesidades. Es en el contexto del desarrollo de las apps donde se pueden abordar problemáticas y crear tantas soluciones como se quiera. Siempre que se piense en un problema y en una alternativa de solución para ello. Por ejemplo: Conjunto de apps presentes en los dispositivos Android. a. Identifiquen algunas aplicaciones representadas de la imagen anterior y mencionen para qué sirven. b. Destaquen dos aplicaciones que usan en la vida cotidiana y que consideran que son muy fáciles de usar. Expliquen por qué las perciben de esa manera. Es posible encontrar apps que dan respuesta a una cantidad de necesidades diferentes. 6 Educación Tecnológica Mi primera app G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. c. Describan cuál es la finalidad de las siguientes aplicaciones: Teléfono Android con distintas aplicaciones instaladas. Sin dudas, podemos encontrar algo en común: todas ellas son programas informáticos y son el resultado de un proceso de elaboración o desarrollo. Pero ¿qué es realmente una app? ¿De qué se compone? ¿Cómo se crea una app? ¿Sobre qué pilares está soportada una app? ¿Desde dónde se las descarga? ¿Cómo se las instala? ¿Cuántas aplicaciones existen? ¿Para qué se usan las apps? ¿Qué necesidades pueden resolver las apps? ¿Qué app innovadora creen que pueda llegar a lanzarse próximamente? ¿Para qué plataformas se está desarrollando actualmente (celular, televisor, auto, reloj inteligente, etc.)? ¿Cuál será el campo de aplicación con mayor potencial en el desarrollo de apps? Escuchen a Micaela Viegas Domina, desarrolladora de aplicaciones para celulares, quien les brindará información para comenzar a dar respuesta a estas preguntas. 7 Educación Tecnológica Mi primera app A partir de la escucha atenta de la entrevista, respondan las preguntas en cuestión en un documento de texto. Pueden realizarlo en un procesador de textos como OpenOffice Writer o Documentos de Google (pueden consultar el tutorial de OpenOffice Writer y el tutorial de Documentos de Google en el Campus Virtual de Educación Digital). G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Para profundizar • “¿Cuántas apps hay en Google Play? ¿Cuántas merecen la pena?”, en Andro4all del 24 de febrero de 2018, por Alberto Quero Guardia. • "Cómo funciona la app que escanea productos desde el celular e indica en qué comercio cercano se los puede comprar más barato", en Infobae del 10 de septiembre de 2019. • “Preguntados 2: probamos el sucesor del exitoso videojuego argentino”, en La Nación del 16 de octubre de 2018, por Franco Rivero. • “Cómo crear una app móvil exitosa”, en Digital House. • “La era de las apps: pequeños programas para satisfacer necesidades”, en Tecnopymes, del 27 de febrero de 2019. • “¿Cómo lograr el éxito de una aplicación? Preguntémosle a Maslow”, en 480 del 6 de marzo de 2018, por Laura Pérez Codorniu. • “La importancia de las apps móviles en las empresas”, en Economía Tic. • “Cree apps que se enfoquen primero en las necesidades del usuario final”, en TechTarget del 5 de agosto de 2015, por Brian Katz. Las apps pueden resultar muy cómodas, prácticas y atractivas para quienes las usan, pero no es lo único que se desarrolla para que funcione un sistema. La mayoría de las apps que se utilizan diariamente se vinculan con plataformas informáticas para poder lograr el funcionamiento del sistema. A la izquierda, una imagen de un zócalo para microcontrolador que resulta un componente central del hardware. A la derecha, un ejemplo de código fuente o programación de un proyecto de software. 8 Educación Tecnológica Mi primera app G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Un sistema es un conjunto de partes que funcionan relacionándose entre sí con un objetivo común y preciso. Para el caso de un sistema informático, se puede decir que las partes que se relacionan son diferentes equipos electrónicos (hardware) y programas informáticos (software). Podemos mencionar, entonces, un tipo de arquitectura de sistema, llamado “clienteservidor”, donde las aplicaciones y las computadoras (denominadas “clientes”) interactúan con un componente que centraliza y almacena la información llamado “servidor” (gran computadora). d. Analicen las siguientes imágenes e indiquen cuáles de las apps mencionadas en el punto anterior creen que usan este modelo de arquitectura. Representaciones simplificadas de la arquitectura cliente-servidor, donde el servidor centraliza la información y modera las interacciones. 9 Educación Tecnológica Mi primera app G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. e. A continuación, podrán ver y analizar dos sistemas. Cada uno de ellos tiene un objetivo específico; sin embargo, en ambos sistemas se interrelacionan las apps que usan los usuarios con la plataforma informática (componentes del resto del sistema). Imágenes alusivas al control de un sistema. En este caso, una persona piloteando un dron, mientras que en la imagen de la derecha se indican las partes principales que componen un dron. Vuelo y control de un dron A partir del análisis de este diagrama, contesten las siguientes preguntas: • ¿Cuáles son las partes del sistema y qué función cumple cada una de ellas? • ¿Cómo se comunican las distintas partes? ¿Son comunicaciones físicas o virtuales? • ¿Qué rol cumple la app dentro del sistema? • ¿Con qué partes del sistema interactúa el usuario? Uso e intercambio de información en Snapchat Observen el video “¿Qué es Snapchat?”, en el canal de ComputerHoy.com. Luego, analicen la infografía “Snapchat para no iniciados”, en La crónica Badajoz del 15 de junio de 2016. Pantalla de inicio de Snapchat. 10 G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Educación Tecnológica Mi primera app f. Indaguen y consulten con algún familiar (padres, madres, tíos/as y abuelos/as) sobre los cambios y los nuevos hábitos de uso de la tecnología. Anoten su caso de estudio en un documento de texto. Por ejemplo, para indagar cómo hacían antes para averiguar dónde quedaba una cierta calle y su altura, o para viajar de un lugar a otro, para ver aquellos programas o eventos que les gustaban, o para saber novedades sobre sus familiares, o cómo se enteraban de las noticias. g. A modo de cierre de la actividad, les proponemos analizar la infografía Proceso de desarrollo de apps, en Genially, sobre el proceso de desarrollo de las apps (también aplicable al desarrollo de software en general). • Investiguen sobre cada uno de los roles e indiquen con cuál se identifican mejor. Si realizan una búsqueda en internet, será importante definir qué sitios consultarán, qué palabras clave o filtros utilizarán para la búsqueda, y cómo evaluarán la fiabilidad de la información. Para eso, puede resultarles útil seguir estas recomendaciones: - Recurrir a sitios oficiales o reconocidos en el ámbito sobre el cual investigarán. - Buscar más de una fuente de información. - Prestar atención a la sección “About” o “Acerca de” (allí encontrarán datos sobre los responsables del sitio). - Asegurarse de que la información esté actualizada. Pueden consultar, además, los tutoriales “¿Cómo hago para verificar si la información en una página web está actualizada?” y “¿Cómo hago para validar una página web?”, ambos en el Campus Virtual de Educación Digital. 11 Educación Tecnológica Mi primera app Para profundizar G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Algunos enlaces de referencia: • “Etapas del desarrollo de una aplicación móvil”, en DoApps del 15 de agosto de 2018, de Jonathan Nolasco. • “¿A quién necesitas para crear una app?”, del blog personal del programador Diego Laballós, del 19 de octubre de 2016. • “¿Cómo armar un equipo de desarrollo de software?”, en Northware del 28 de julio de 2014. Volver al itinerario Actividad 2 Herramientas y habilidades del desarrollo en el mundo profesional Luego de la exploración de diversas apps, se mencionó que cumplen diferentes funciones y que algunas de ellas resultan más prácticas o más sencillas de usar, mientras que otras no son tan claras, o las interacciones no resultan intuitivas. ¿Cómo se analiza o se aborda este tema de la practicidad o de la sencillez en el uso de las apps? Experiencia de usuario (UX) Este concepto se conoce como experiencia de usuario o UX, por sus siglas en inglés (ver glosario en el anexo 2. "Glosario".). La experiencia de usuario es el conjunto de factores y elementos relativos a la interacción del usuario/a con un entorno o con un dispositivo concreto, que da como resultado una percepción positiva o negativa de dicho producto. Es decir, que una misma app puede resultar sencilla o positiva para un/a usuario/a, y compleja o negativa para otro/a. Pero ¿cómo se obtiene una respuesta que indique si, para la mayoría de los/las usuarios/as, la app se entiende y es fácil de usar o no? Anexo 2. Glosario Para ello, los/las usuarios/as deben dar retroalimentación u opinión (comentarios o puntajes y calificaciones) y los/las desarrolladores/as podrán mejorar o cambiar las partes de las apps que resulten negativas. ¿Esto se sabe solo al final del proceso cuando se instalan las apps? No. A la hora de crear una app, este tema es central, y la UX se involucra en el proceso de su diseño, como puede observarse en el ejemplo Rol del equipo de diseño y desarrollo en el proceso de creación. 12 G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Educación Tecnológica Mi primera app a. ¿Qué apps conocen que integran espacios para calificaciones y reseñas? Imagen alusiva al proceso de interpretación y valoración del usuario. ¿Qué perciben los usuarios al interactuar? Análisis de un caso de UX Por ejemplo, WhatsApp permite ahora “borrar” mensajes enviados. Suponé este escenario: le estás escribiendo un mensaje a un/a amigo/a y, accidentalmente, se lo envías a otro contacto. No hay problema, ahora se puede “borrar” y listo, nadie se da cuenta. Pero ¡no sucede eso! Pasa lo siguiente: 13 G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Educación Tecnológica Mi primera app Conversación de WhatsApp con una secuencia de mensajes eliminados. Si se lo piensa desde la experiencia del usuario, se puede pensar que el usuario o usuaria espera que se pueda “borrar”. Sin embargo, se notifica al receptor que el mensaje fue borrado por lo que realmente no fue borrado, sino que resulta sospechoso y es probable que recibamos algún mensaje o repregunta del receptor al respecto. Como puede verse en esta situación, de Giphy. En realidad, el mensaje no se borra, se bloquea; razón por la cual se le debería decir al usuario “bloquear mensaje” y no “eliminar”. Sin embargo, WhatsApp decidió no plantearlo de esta manera. b. ¿Podría WhatsApp dejar que eliminen directamente el mensaje? Si técnicamente existe esa posibilidad, ¿por qué creen que no se desarrolla? ¿Qué se gana y qué se pierde, desde la experiencia de usuario, con esta función y esta notificación de "mensaje eliminado"? c. En grupo, seleccionen tres apps y completen el “Formulario de retroalimentación” del anexo 1 "Formulario de retroalimentación". Para cada una de ellas y reporten la experiencia de usuario. Compartan su opinión y compárenla con la del resto de sus compañeros/as. Anexo 1. Formulario de retroalimentación Interfaz de usuario (UI) A la hora de abordar el tema de la experiencia que tienen los usuarios y usuarias con las aplicaciones, se pone en juego también cómo se disponen y se crean las interfaces de usuario o UI, por sus siglas en inglés (ver el anexo 2. "Glosario"), también denominadas “pantallas” o “interfaces gráficas”. Para ello se las piensa, diseña y testea. Anexo 2. Glosario 14 G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Educación Tecnológica Mi primera app Las apps se realizan en un proceso de desarrollo que involucra varias etapas y con el trabajo de un equipo de profesionales. d. Analicen el siguiente ejemplo. ¿Qué diferencias encuentran entre estas interfaces gráficas? ¿Qué problemas pueden ocurrir en la versión de la izquierda? ¿Qué cambios hay en la versión central? ¿Y qué agregados hay en la opción de la derecha? 15 Educación Tecnológica Mi primera app A la hora de diseñar o de crear aplicaciones, se debe tener en cuenta para qué dispositivo o dispositivos se desea diseñar y para qué sistema operativo. No es lo mismo diseñar apps para el sistema operativo Android que para el iOS. G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Cada sistema operativo cuenta con su entorno de desarrollo para elaborar aplicaciones. Se decidió desarrollar aplicaciones para Android, dado que existen mayor cantidad de dispositivos y usuarios/as. Conociendo el entorno de desarrollo MIT App Inventor 2 Comenzarán a desarrollar aplicaciones en un entorno de desarrollo integrado (IDE) para Android que permite crear apps de forma simple, llamado MIT App Inventor 2. En este entorno, podrán crear apps de forma sencilla utilizando diferentes bloques funcionales y componentes. e. Ingresen a la plataforma MIT App Inventor y exploren sus características. Vista principal de un proyecto en MIT App Inventor 2. 16 G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Educación Tecnológica Mi primera app f. Armen un muro colaborativo en el que se analicen los aspectos más significativos de App Inventor 2 y se respondan las siguientes preguntas: - ¿Qué observan al ingresar? - ¿Qué elementos encuentran? - ¿Cómo está organizada la interfaz? - ¿Para qué creen que sirve cada elemento? g. Luego de contestar y de conversar con sus compañeros/as sobre lo que han explorado, lean el Instructivo para comenzar a desarrollar apps en el entorno de App Inventor 2 (IDE), en el que se explica cómo comenzar a interactuar con el entorno. Volver al itinerario Actividad 3 Descubrí el desarrollo de apps con MIT App Inventor 2 MIT App Inventor 2 permite crear aplicaciones muy diversas. Para comenzar a conocer las opciones, los componentes y los bloques, lo mejor es hacerlo a través de la creación de diferentes proyectos. Proyecto N.º 1: App que habla ¿Conocen apps que “hablen”? ¿Quiénes son los usuarios habituales de estas apps? ¿Para qué son necesarias? a. Exploren el entorno y ubiquen los componentes que se mencionan en el siguiente recuadro: Para este proyecto, deberán utilizar los siguientes componentes: 17 Educación Tecnológica Mi primera app G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. b. Vean a continuación el video “Desarrollando el primer proyecto”. Instalen la aplicación o simulen el comportamiento de la app. Para probar la app pueden instalarla a través de un código QR (pueden ver el video “Instalando la app mediante un código QR”) o a través de un archivo instalador APK (ver anexo 2. "Glosario"). Si no, pueden emular la aplicación para probarla en un dispositivo virtual. Anexo 2. Glosario c. ¿Qué componentes de esta app son visibles? ¿Cuáles no son visibles? Es posible diferenciar los componentes utilizados en visibles y no visibles. Los componentes no visibles aparecerán debajo del teléfono (en el visor o vista de diseñador). ¿Los componentes de disposición, como el horizontal arrangement, son partes visibles o no visibles? Se considera que son partes visibles dado que estructuran y brindan un ordenamiento en la interfaz gráfica o pantalla al agrupar u ordenar otros componentes, ya que son parte del diseño de estas. Pueden ver más información en la guía Conociendo los componentes para ajustar la disposición de los elementos en pantalla. Proyecto N.º 2: Personalizando nuestro proyecto El proyecto anterior permite que el teléfono emita un mensaje predefinido. ¿Cómo podría modificarse el proyecto para poder elegir el mensaje que comunicar? 18 Educación Tecnológica Mi primera app d. Exploren las opciones para lograrlo e impleméntenlo. G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Para este proyecto, les sugerimos ver e incorporar el siguiente componente: Proyecto N.º 3: Compartiendo fotos con mis contactos desde mi propia app Cotidianamente las personas se comunican y comparten información y multimedios a través del teléfono, generalmente vía WhatsApp, registrando mediante la cámara y enviándolo a través de internet. e. ¿Cómo es ese proceso de enviar un contenido multimedia de lo que observan a través de una app? ¿Qué aplicaciones conocen que puedan enviar y recibir fotos, videos, audios? Para este proyecto, deberán utilizar estos componentes: Formalizando el proceso de desarrollo Hasta el momento han desarrollado tres proyectos de apps para dispositivos móviles. ¿Qué pasos han realizado para lograrlo? 19 Educación Tecnológica Mi primera app G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. f. Registren por escrito los pasos realizados para elaborar cada app. Proyecto N.º 4: Midiendo con sensores Los teléfonos cuentan con numerosos sensores que se utilizan para mejorar la experiencia de usuario en el uso del dispositivo. Un ejemplo puede ser el sensor de proximidad para apagar la pantalla cuando hablamos por teléfono y queremos evitar que se aprieten los números, o para escuchar un audio de forma privada o el sensor de luz para aumentar el brillo de la pantalla si hay mucha luz en el ambiente. g. Les proponemos desarrollar una app que utilice estos sensores para informarnos de estas medidas (luz y proximidad). ¿Qué bloques o componentes se requieren? h. Para pensar en grupos: ¿Qué sensores pueden identificar en un teléfono inteligente? ¿Para qué se los utiliza? i. Analicen y discutan la experiencia de usuario que tuvieron con la app de ejemplo que desarrollaron. ¿Cómo la mejorarían? Proyecto N.º 5: ¡Necesitamos un GPS! Numerosas aplicaciones utilizan la localización del GPS para informar dónde se encuentran distintos lugares de nuestro interés y dónde se encuentra el/la usuario/a. 20 Educación Tecnológica Mi primera app G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Para este proyecto, deberán utilizar estos componentes: j. Desarrollen una app que, mediante un botón, muestre su ubicación actual en un mapa. k. ¿Cómo personalizar la visualización en el mapa? Prueben modificar el zoom. l. ¿Cómo generarían una ubicación fija? Prueben ubicar el marcador en otro punto modificando los campos de latitud y longitud. En la guía Conociendo la paleta de componentes disponibles en el entorno de App Inventor 2. Interfaz de usuario, pueden ver la información de los diferentes elementos. Volver al itinerario Actividad 4 ¡Manos a la obra! Resolución de un caso de desarrollo móvil Se propone desarrollar, como primer proyecto integrador, una calculadora con las operaciones matemáticas básicas (suma, resta, multiplicación y división). Apps calculadoras presentes en iOS y en Android. 21 Educación Tecnológica Mi primera app Para ello, están invitados a ver otras aplicaciones de calculadoras en Google Play a fin de poder analizar las distintas interfaces gráficas propuestas. A modo de integrar los conceptos ya vistos y armar una “Calculadora 2.0”, se les propone agregar “funciones innovadoras”, como borrar el resultado al agitar el celular, utilizando el acelerómetro. G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. a. Describan la interfaz gráfica desarrollada. ¿Por qué eligieron esa disposición? ¿Cuál es el criterio para determinar si una funcionalidad es innovadora o no? Una vez realizada la calculadora, el desafío consistirá en agregar nuevas funciones matemáticas más complejas (por ejemplo: raíz cuadrada, x^y, logaritmos, etc.) y proponer el uso de otros sensores para ampliar la funcionalidad de las calculadoras (por ejemplo, expresar la intensidad de luz en distintas unidades). b. ¿Qué cambios aplicaron a la interfaz gráfica para sumar las nuevas funcionalidades? c. ¿Cuál es el criterio preponderante (diseño visual, simplicidad para la interacción del usuario, aspecto funcional, etcétera)? Para reflexionar ¿Cuál fue el proceso para pensar la interfaz gráfica? ¿Cuál es el criterio para determinar si una funcionalidad es innovadora o no? ¿Qué componentes utilizaron en la app? ¿Podrían haber utilizado otros para resolver las mismas funciones? ? Volver al itinerario Actividad 5 Desafío creativo Actualmente el mundo del software y, en especial, el de las apps, no se circunscribe exclusivamente a una computadora, a un teléfono o al uso de internet. El avance de la tecnología y los protocolos de comunicaciones digitales permitieron extender las funcionalidades del software al hardware. Un ejemplo concreto de esto es el proyecto que se muestra en el video “Regulando lámpara RGB”. Como se puede observar en el video anterior, se pueden transmitir datos de control hacia un dispositivo de hardware. En este caso en particular, enviamos un valor numérico por Bluetooth, que representa la intensidad de cada color de luz y, de esta manera, logramos distintos efectos de iluminación. 22 G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Educación Tecnológica Mi primera app Así, podemos observar cómo se integra un sistema de control con el desarrollo de una app. La aplicación tomará información de sensores (acelerómetro, luxómetro, micrófono, etc.) y le enviará comandos al dispositivo velador y, en consecuencia, activará los actuadores (luces, motores, parlantes, etc.). En búsqueda de soluciones creativas Ustedes han sido contactados/as, por sus conocimientos y habilidades de desarrollo, para plantear soluciones a problemáticas muy importantes. a. A continuación, recibirán los casos para resolver. En grupos deberán analizar dichos casos y plantear una alternativa de solución (explicación y representación) mediante una lluvia de ideas para cada uno de ellos, y completar un documento por cada caso. Imaginen soluciones. ¡Sean creativos/as! b. Elijan uno de ellos o generen una problemática que resolver. Trabajen en equipo y divídanse los roles de diseño, programación y pruebas. Roten de forma tal que quienes integren el equipo conozcan el detalle de cada rol de trabajo. Se sugiere diseñar las pantallas en papel para, luego, diseñarlas en MIT App Inventor 2, previo a codificarlas y para, finalmente, probarlas. ¡Manos a la obra! 23 G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Educación Tecnológica Mi primera app Es importante mencionar aquí un concepto llamado producto mínimo viable o MVP, por sus siglas en inglés (ver anexo 2. "Glosario"). Esto significa que, a la hora de crear y diseñar una solución, se debe pensar cuáles son las funcionalidades mínimas del proyecto que permiten dar respuesta a la problemática. De esa manera, es posible establecer prioridades y resolver primero esas funciones. Luego, si se dispone de más tiempo o recursos, se puede desarrollar el resto. Pero esta forma de abordar el desarrollo también permite ver si esas funciones principales son realmente útiles y permiten validar el proyecto para seguir avanzando. ¡Ténganlo en cuenta! Anexo 2. Glosario En esta actividad, se espera que los/las estudiantes comprendan que las aplicaciones móviles puedan comunicarse con dispositivos externos al teléfono. En este caso, la app interactúa mediante Bluetooth con otro dispositivo. Volver al itinerario Actividad 6 Ateneo de apps. Compartí tu proyecto Una parte fundamental dentro de todo proyecto técnico es la comunicación de este. La presentación de un proyecto puede estar dirigida a los/las usuarios/as, a otros pares o, incluso, a un inversor que esté interesado en él. Para eso, les proponemos lo siguiente: a. Armar una presentación de diez diapositivas sobre la problemática elegida, en la que expliquen su proyecto a docentes y a compañeros/as. Pueden realizarla en un editor de presentaciones como Presentaciones de Google u OpenOffice Impress (pueden consultar el Tutorial de Google Drive Presentaciones y el tutorial de OpenOffice Impress en el Campus Virtual de Educación Digital). Debe incluirse la idea inicial de cómo surgió el proyecto, el proceso de desarrollo, como también las conclusiones finales y las experiencias aprendidas. Tener en cuenta que quienes verán la presentación no necesariamente tienen conocimiento tecnológico o vinculado al desarrollo de software. b. Probar su app y la de sus compañeros/as. Tengan en cuenta aspectos de diseño y de funcionalidad, y consideren la experiencia de usuario. c. Brindar una opinión constructiva de las apps y de las presentaciones de los otros grupos a través del anexo 1. “Formulario de retroalimentación”. Para obtener un buen feedback o retroalimentación, es recomendable tratar de dar aportes a sus compañeros/as de forma tal que permitan enriquecer la propuesta y, al mismo tiempo, generar preguntas que amplíen y profundicen el diálogo y la discusión. Anexo 1. Formulario de retroalimentación Volver al itinerario 24 Educación Tecnológica Mi primera app Anexo 1 Formulario de retroalimentación G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Gracias por tomarse el tiempo de completar el formulario de retroalimentación. Al proporcionar su retroalimentación están ayudando a entender qué es lo que se ha hecho bien y qué mejoras se deben implementar en la app. Nombre del grupo: Nombre de la app analizada: 1. ¿Cuán satisfechos/as están con los siguientes aspectos? Colocar X según corresponda: Criterios Muy satisfecho Satisfecho Neutral Insatisfecho Muy insatisfecho Diseño UI Navegación UX Estabilidad (errores, correcciones) Funcionalidad/ complejidad Otro: ______________ 2. 3. 4. 5. ¿Qué aspecto consideran el más destacado? ¿Qué correcciones aplicarían para mejorar el funcionamiento de la app? ¿Cambiarían algo del diseño? ¿Qué? ¿Por qué? Si fuesen usuarios/as de esta app, ¿qué les gustaría que se incorporara? Siéntanse en libertad de agregar cualquier otro comentario, observación o sugerencia: 25 Educación Tecnológica Mi primera app Anexo 2 G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Glosario algoritmo: conjunto de instrucciones organizadas de manera lógica y ordenada, que permite solucionar un determinado objetivo. APK: archivo ejecutable de aplicaciones para Android. app: abreviatura de la palabra en inglés application. Es un programa que se ejecuta en un dispositivo móvil. arquitectura de software: conjunto de patrones y abstracciones coherentes que proporcionan un marco definido y claro para interactuar con el código fuente del software. domótica: conjunto de técnicas orientadas a automatizar una vivienda, que integran la tecnología en los sistemas de seguridad, la gestión energética, el bienestar o las comunicaciones. emulador: software que imita las características de un dispositivo real a fin de probar las funcionalidades de una aplicación que debe ejecutarse dentro de ese dispositivo real, que ha sido emulado, recreado virtualmente. IDE (integrated development environment), entorno de desarrollo integrado: entorno que ha sido empaquetado como un programa de aplicación cuya función es actuar como un editor de código, un compilador, un depurador y un constructor de interfaz gráfica. UI (user interface), interfaz de usuario: conjunto de pantallas en una aplicación que le permiten al usuario interactuar con el sistema. disposición /layout: forma de organizar una pantalla de un software. lenguaje de programación: lenguaje formal que, mediante una serie de instrucciones, le permite a un programador escribir un conjunto de órdenes, acciones consecutivas, datos y algoritmos para crear programas que controlen el comportamiento físico y lógico de una máquina o de un sistema. microcontrolador: circuito integrado programable, capaz de ejecutar las órdenes grabadas en su memoria. Está compuesto de varios bloques funcionales que cumplen una tarea específica. MIT (Massachusetts Institute of Technology): El Instituto de Tecnología de Massachusetts es una universidad privada en Cambridge, Massachusetts (Estados Unidos), considerada una de las mejores y más prestigiosas universidades a nivel mundial. MIT App Inventor 2: IDE en línea que permite el desarrollo de apps para Android mediante programación en bloques. 26 G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Educación Tecnológica Mi primera app MVP (minimum viable product), producto mínimo viable: es un prototipo con funcionalidades mínimas. nicho de innovación: porción de un segmento del área del conocimiento que posee características y necesidades homogéneas que aún no están del todo cubiertas por los desarrollos existentes. pensamiento computacional: proceso que permite formular problemas de forma tal que sus soluciones puedan ser representadas como secuencias de instrucciones y algoritmos. prototipado de software: proceso previo al desarrollo del software, en el cual se pueden maquetar las principales características del sistema y su interfaz con el usuario. sensor: dispositivo capaz de detectar magnitudes físicas o químicas, llamadas variables de instrumentación, y transformarlas en variables eléctricas que puedan ser procesadas por un sistema. sistemas de control: conjunto de dispositivos encargados de administrar, ordenar, dirigir o regular el comportamiento de otro sistema con el fin de reducir las probabilidades de fallo y obtener los resultados deseados. software: conjunto de programas y rutinas que les permiten a las computadoras, a los dispositivos móviles o a las máquinas realizar determinadas tareas. UX (user experience), experiencia de usuario: todas las decisiones de diseño involucradas para mejorar la experiencia a la hora usar un software. 27 G.C.A.B.A. | Ministerio de Educación | Dirección General de Planeamiento Educativo | Gerencia Operativa de Currículum. Educación Tecnológica Mi primera app Listado de imágenes Página 6. Pantalla con aplicaciones Android. Pixabay, https://bit.ly/2MMhw9R. Pantalla de celular con aplicaciones Android, aporte de Josefina Gutierrez. Página 7. Teléfono Android con apps. Pixabay, https://bit.ly/2Uy3qNz. Página 8. Pxhere. Wikimedia commons, https://bit.ly/30wU1cP. Pixabay, Pixabay License, https://bit.ly/3dTFs7f. Página 10. Drone, Unsplash, Manuel Goche, https://bit.ly/3dVhAjA. Logo Snapchat. Piqsels, Wikimedia Commons, https://bit.ly/37jrYiC. Página 11. Proceso de desarrollo de apps. Genially, https://bit.ly/2XXBBR7. Página 13. Diseño en el proceso de creación de apps. Genially, https://bit.ly/3cTDsKP. Experiencia y retroalimentación. Pxhere, Wikimedia Commons, https://bit.ly/3dYGXks. Página 15. Diseño pantallas app en papel. Pxhere, Wikimedia Commons, https://bit.ly/2zpltOJ. Diseño de app, mesa de trabajo I. Pxhere, Wikimedia Commons, https://bit.ly/3cXe3jg. Diseño de app, mesa de trabajo II. Pixabay, https://bit.ly/3dTNe0V. Capuchino (adaptación). Pngimg, Wikimedia Commons, https://bit.ly/3dXCsXw. Página 16. Logo MIT App Inventor. Wikimedia Commons, https://bit.ly/2XXIrGh. Página 17. Smartphone Samsung plateado, Pexel, https://bit.ly/2YrJ3CP. Página 19. Smartphone Samsung plateado, Pexel, https://bit.ly/2YrJ3CP. Foto de desayuno con celular. Pexel, https://bit.ly/2MRLoSm. Página 21. Calculadora Android, aporte de Bárbara Gomila. Recursos audiovisuales: https://bit.ly/2BlgH5L 28 /educacionba buenosaires.gob.ar/educacion