Ups CT002537 PDF

UNIVERSIDAD POLITCNICA
SALESIANA
SEDE CUENCA
CARRERA DE INGENIERA DE SISTEMAS
Tema:
Diseo e Implementacin de una Aplicacin para Dispositivos
Android en el Marco del Proyecto Pequeas y Pequeos Cientficos
de la Universidad Politcnica Salesiana
Tesis previa a la obtencin del

ttulo de Ingeniero de Sistemas
Autor:
Diego Fernando Quisi Peralta
Director:
Ing. Vladimir Robles Bykbaev
Cuenca, Diciembre 2012

Ing. Vladimir Robles Bykbaev.
CERTIFICO
Haber dirigido y revisado prolijamente la tesis titulada Diseo e Implementacin

de una Aplicacin para Dispositivos Android en el Marco del Proyecto Pequeas y
Pequeos Cientficos de la Universidad Politcnica Salesiana, realizado por el
estudiante Diego Fernando Quisi Peralta, y por cumplir los requisitos autorizo su
presentacin.
Cuenca, Dicie mbre de 2012
Ing. Vladimir Robles Bykbaev.

Director de Tesis
2
DECLARATORIA DE RESPONSABILIDAD
Yo Diego Fernando Quisi Peralta portador de la cedula de ciudadana 010461646-1,

estudiante de la carrera de Ingeniera de Sistemas, certifico que los conceptos
desarrollados, anlisis realizados, as como el desarrollo e implementacin son de
exclusiva responsabilidad del autor. Los textos de otros autores llevan su
correspondiente cita bibliogrfica y autorizo a la Universidad Politcnica Salesiana
el uso de la misma para fines acadmicos.
3
DEDICATORIAS
Dedico esta tesis a Dios, por darme todas las bendiciones, salud y estar en mi vida
siempre, a mi Madre Luisa Peralta de quien siempre he recibido su amor,
comprensin, paciencia, y quien siempre ha estado incondicionalmente a mi lado
para lograr mis metas y objetivos y sobre todo por su gran apoyo, cario y amor a lo
largo de toda mi vida siendo un gran ejemplo para m y mi formacin como persona
y profesional.
A mis tos Bolvar Peralta, Edison Peralta, Cecilia Peralta, Elizabeth Peralta, Beatriz
Peralta y a toda mi familia quienes siempre estuvieron en los buenos y malos
momentos, por la motivacin para cumplir mis objetivos, quienes siempre confiaron
en m y estuvieron all para darme un consejo o ayudarme incondicionalmente en
todo momento y gracias a ellos hoy puedo alcanzar esta meta en mi vida.
A mi enamorada Liliana Chaglla que todo este tiempo de la Universidad siempre

estuvo all para apoyarme en todo momento, enseando y compartiendo su
conocimiento, esto va para la mujer que nunca me dejo rendirme y siempre me dio
las fuerzas necesarias para poder cumplir este objetivo tan importante en mi vida.
Gracias.
A todos mis amigos que han compartido los buenos y no tan buenos momentos
conmigo y que da a da me ensearon lo que significa la verdadera amistad.
A todos los profesores quienes siempre estuvieron all, brindndonos siempre su

orientacin y ayuda en todo momento.
4
AGRADECIMIENTOS
A Dios por ser mi gua, compaero darme la vida, a mi madre Luisa Peralta,
gracias a todo su esfuerzo, apoyo y confianza que deposito en m y sobre todo su
amor. A toda mi familia especialmente a mis tos Bolvar, Cecilia, Edison, Elizabeth
y Beatriz Peralta quienes me animaron, apoyaron con su gran cario y siempre
estuvieron all incondicionalmente. Gracias a todos ellos soy quien soy hoy en da.
Agradezco especialmente a mi enamorada y amiga la Ingeniera Liliana Chaglla,

quien ha sido un apoyo incondicional en los buenos y malos momentos. Ayudarme
en toda la carrera universitaria. Gracias por ser tan especial y nica, de verdad que
le admiro como persona y tambin como una gran profesional. Agradezco a Dios
por haberte puesto dentro de mi vida. Te Amo Mucho y Gracias por todo.
Mi agradecimiento sincero al Ing. Vladimir Robles Bykbaev. Por su cooperacin,

direccin, paciencia, entrega y valiosos consejos que me permitieron alcanzar los
objetivos de esta tesis y por su gran apoyo incondicional, su conocimiento y
experiencia que a lo largo de todo mi carrera me supo transmitir.
Y a todos mis amigos y profesores por su apoyo, nimo, tiempo y compaa en las
diferentes etapas de mi vida. Gracias por formar parte de mi vida, por todo lo que
me han brindado y por todas sus bendiciones.
5
TABLA DE CONTENIDOS
CAPTULO 1 6
1 INTRODUCCIN.......................................................................................................... 12
1.1 Introduccin ............................................................................................................. 12
1.2 Antecedentes............................................................................................................ 13
1.2.1 Justificacin ...................................................................................................... 13
1.2.2 Descripcin del Problema .................................................................................. 13
1.3 Alcance.................................................................................................................... 14
1.4 Objetivos ................................................................................................................. 14
1.4.1 Objetivos General.............................................................................................. 14
1.4.2 Objetivos Especficos ........................................................................................ 15
1.5 Experiencias del Proyecto Pequeas y Pequeos Cientficos de la Universidad Politcnica
Salesiana [3]........................................................................................................................ 15
CAPTULO 2 15
2 ESTUDIO DE LA TECNOLOGA A DESARROLLAR ............................................... 21
2.1 Estudio de HTML 5 para dispositivos mviles ............................................................ 21
2.2 Estudio del entorno de desarrollo Android .................................................................. 22
2.3 Comparacin de la plataforma de desarrollo Android con HTML 5 para dispositivos
mviles. .............................................................................................................................. 27
2.3.1 Aplicaciones HTML5 para dispositivos mviles. ............................................... 28
2.3.2 Aplicaciones nativas. ......................................................................................... 28
2.4 Especificaciones de la tecnologa de desarrollo. .......................................................... 30
2.4.1 Instalacin y configuracin de JDK 7 ................................................................. 30
2.4.2 Instalacin y configuracin del SDK de Android ................................................. 33
2.4.3 Instalacin y configuracin de Eclipse Indigo...................................................... 39
2.4.4 Instalar el plugin de Android para Eclipse ........................................................... 39
2.4.5 Creacin de un nuevo proyecto Android ............................................................. 41
CAPTULO 3 . 39
3 DISEO DEL SOFTWARE. .......................................................................................... 45
3.1 Levantamiento de Requerimientos de Software........................................................... 45
6
3.1.1 Definicin de Stakeholders ................................................................................ 45
3.1.2 Tcnicas de Elicitacin [26] ............................................................................... 46
3.1.3 Suposiciones y Dependencias............................................................................. 46
3.1.4 Requerimientos Funcionales............................................................................... 47
3.1.5 Requerimientos no Funcionales .......................................................................... 50
3.1.6 Restricciones..................................................................................................... 51
3.1.7 Evolucin previsible del sistema......................................................................... 51
3.1.8 Validacin de requerimientos ............................................................................. 51
3.2 Diseo de la aplicacin. ............................................................................................ 51
3.2.1 Casos de Uso .................................................................................................... 51
3.2.2 Diagrama de Clases del Mundo Elctrico y Verde ............................................... 53
3.2.3 Diagramas de Secuencia del Mundo Elctrico y Verde......................................... 62
3.3 Anlisis de las herramientas de desarrollo. ................................................................. 63
3.3.1 Grficos en Android .......................................................................................... 63
3.3.2 AsyncTask [27]................................................................................................. 64
3.3.3 Reproduccin de sonido [31].............................................................................. 65
3.3.4 Desarrollo Html5 [23]........................................................................................ 66
CAPTULO 4 . 67
4 IMPLEMENTACIN, DOCUMENTACIN Y PRUEBAS .......................................... 73
4.1 Implementacin y seleccin de los mdulos de aprendizaje. ....................................... 73
4.2 Desarrollo de pruebas con los dispositivos mviles en el laboratorio ............................ 75
4.3 Desarrollo de pruebas con nios y nias. ................................................................... 77
4.4 Documentacin. ....................................................................................................... 81
4.4.1 Descarga e Instalacin de la aplicacin. .............................................................. 81
4.4.2 Manual de Usuario ............................................................................................ 84
4.5 Publicacin de la aplicacin en la tienda de Google..................................................... 85
5 CONCLUSIONES.......................................................................................................... 95
6 RECOMENDACIONES................................................................................................. 97
7 TRABAJOS FUTUROS ................................................................................................. 97
8 BIBLIOGRAFA............................................................................................................ 98
9 ANEXOS...................................................................................................................... 102
9.1 ANEXO 1: CERTIFICADO DE VALIDACIN DE REQUERIMIENTOS. ...............102
9.2 ANEXO 2: ENCUESTA PRACTICADA A LOS NIOS Y NIAS ..........................104
7
NDICE DE FIGURAS
ILUSTRACIN 1 PROM EDIO DEL NIVEL DE CONOCIMIENTO DE LOS NIOS Y NIAS

RESPECTO A LOS TEMAS A BARCA DOS EN LOS TA LLERES, ANTES Y DESPUS DE LOS
MISMOS.................................................................................................................................................................... 16
ILUSTRACIN 2 INTERS DE LOS NIOS Y NIAS EN LA S CA RRERAS PROFESIONA LES
PREVIO A LOS TA LLERES (PRE-TEST)........................................................................................................ 16
ILUSTRACIN 3 INTERS DE LOS NIOS Y NIAS EN LA S CARRERAS ............................................... 16
ILUSTRACIN 4 RESPUESTA DE LOS NIOS Y NIAS A LA PREGUNTA TE GUST EL
TALLER PEQUEAS Y PEQUEOS CIENTFICOS? ............................................................................... 17
ILUSTRACIN 5 INTERS DE LOS PA DRES DE FAMILIA EN QUE SUS NIOS Y NIAS
PARTICIPEN EN TALLERES DE ESTE TIPO. .............................................................................................. 17
ILUSTRACIN 6 TA LLERES EN EL AULA DE CIENCIA CON LA ESCUELA FRA NCISCA D VILA.
..................................................................................................................................................................................... 18
ILUSTRACIN 7 TA LLERES EN EL AULA DE CIENCIA CON LA ESCUELA CARLOS CRESPI. ....... 18
ILUSTRACIN 8 INAUGURA CIN Y ENTREGA DE DIPLOMAS A 1ER GRUPO DE PEQUEAS Y
PEQUEOS CIENTFICOS. VISITA DE SECRETA RIO DEL SENESCYT, REN RAMREZ. ........ 19
ILUSTRACIN 9 REUNIN CON PADRES DE FAMILIA EN LA ESCUELA CA RLOS CRESPI. .......... 19
ILUSTRACIN 10 COM POSICIN DE HTM L5 [9]............................................................................................... 22
ILUSTRACIN 11 COM PATIBILIDAD DE LOS NA VEGA DORES W EB CON HTM L5 [10] ................... 22
ILUSTRACIN 12 ARQUITECTURA DE ANDROID ........................................................................................... 23
ILUSTRACIN 13 CICLO DE VIDA DE UN ACTIVITY [20] ............................................................................... 26
ILUSTRACIN 14 PORCENTAJES DE DISTRIBUCIONES DE ANDROID UTILIZADAS
ACTUA LM ENTE [21] ........................................................................................................................................... 27
ILUSTRACIN 15 SITIO W EB DE ORA CLE PARA LA DESCA RGA DEL JDK .......................................... 30
ILUSTRACIN 16 DESCA RGA DEL JDK................................................................................................................ 31
ILUSTRACIN 17 INSTALA CIN DE JDK 7 ......................................................................................................... 31
ILUSTRACIN 18CARA CT ERSTICAS DE INSTA LA CIN DEL JDK .......................................................... 32
ILUSTRACIN 19 ESTADO DE LA INSTA LACIN DEL JDK ......................................................................... 32
ILUSTRACIN 20 SITIO WEB PA RA LA DESCARGA DEL SDK DE A NDROID...................................... 33
ILUSTRACIN 21 INSTALA CIN DEL SDK DE A NDROID ............................................................................ 33
ILUSTRACIN 22 DIRECTORIO DE INSTA LACIN DEL SDK DE ANDROID ......................................... 34
ILUSTRACIN 23 PA QUETES DE INSTA LA CIN DE ANDROID ................................................................. 34
ILUSTRACIN 24 INSTALA CIN DE LAS PLATAFORMAS DISPONIBLES DE A NDROID ................ 35
ILUSTRACIN 25 ADM INISTRA CIN DE DISPOSITIVOS VIRTUALES DE A NDROID ....................... 36
ILUSTRACIN 26 CREACIN DE UN NUEVO DISPOSITIVO VIRTUAL DE ANDROID ....................... 36
ILUSTRACIN 27 CONFIGURA CIN DE UN NUEVO DISPOSITIVO VIRTUA L DE ANDROID......... 37
ILUSTRACIN 28 VISUA LIZA CIN DE LOS DISPOSITIVOS VIRTUA LES ANDROID. ........................ 38
ILUSTRACIN 29 EJECUCIN DEL DISPOSITIVO VIRTUAL ANDROID .................................................. 38
ILUSTRACIN 30 SITIO W EB DE DESCARGA DEL ECLIPSE INDIGO 3.7 ................................................ 39
ILUSTRACIN 31 INSTALA CIN DEL PLUGIN ADT EN ECLIPSE............................................................... 40
ILUSTRACIN 32 A GREGACIN EL REPOSITORIO DE A NDROID ............................................................ 40
ILUSTRACIN 33 SELECCIN E INSTA LACIN DE LOS PAQUETES DE A NDROID .......................... 41
ILUSTRACIN 34 CREACIN DE NUEVO PROYECT O DE A NDROID ....................................................... 42
8
ILUSTRACIN 35 CONFIGURA CIN DE UN NUEVO PROYECTO ANDROID. ....................................... 43
ILUSTRACIN 36 EJECUCIN DE LA APLICACIN A NDROID................................................................... 43
ILUSTRACIN 37 SITIO W EB DE DESCARGA DE SENCHA ANIMATOR ................................................. 67
ILUSTRACIN 38 INSTALA CIN DE SENCHA ANIMATOR.......................................................................... 67
ILUSTRACIN 39 DIRECTORIO DE INSTA LACIN DE SENCHA ANIMATOR....................................... 68
ILUSTRACIN 40 INSTALA CIN TERMINADA DE SENCHA ANIMATOR .............................................. 68
ILUSTRACIN 41 PA NTA LLA PRINCIPA L DE SENCHA ANIMATOR ........................................................ 69
ILUSTRACIN 42 CONFIGURA CIN DEL NUEVO PROYECTO DE ANDROID ...................................... 69
ILUSTRACIN 43 PA NEL DE OBJETOS DE SENCHA ANIMATOR .............................................................. 70
ILUSTRACIN 44 PA NEL DE PROPIEDADES DE SENCHA ANIMATOR ................................................... 70
ILUSTRACIN 45 PA NEL LNEA DE TIEM PO DE SENCHA ANIMATOR .................................................. 71
ILUSTRACIN 46 ESPACIO DE TRA BAJO DE SENCHA ANIMATOR ......................................................... 71
ILUSTRACIN 47 PA NEL DE ESCENAS DE SENCHA ANIMATOR ............................................................. 71
ILUSTRACIN 48 PA NEL DE CONTROL DE TIEM PO DE SENCHA ANIMATOR ................................... 71
ILUSTRACIN 49 ENTRA DA DE LA DOCTORA ATMICA EN EL MUNDO ELCTRICO EN 200MS.
..................................................................................................................................................................................... 73
..................................................................................................................................................................................... 73
..................................................................................................................................................................................... 74
ILUSTRACIN 52 ENTRADA DEL RBOL CALIPTO EN EL M UNDO VERDE EN 200MS ................... 74
ILUSTRACIN 55 DISPOSITIVO MVIL DE PRUEBA COBY. ....................................................................... 76
ILUSTRACIN 56 DISPOSITIVO MVIL DE PRUEBA SAMSUNG GA LAXY TA B 2.............................. 76
ILUSTRACIN 57 DISPOSITIVO MVIL DE PRUEBAS ASUS TF101 .......................................................... 77
ILUSTRACIN 58RESULTADO DE LA PREGUNTA CM O FUE LA EXPERIENCIA DE
UTILIZACIN DE LOS TABLETS PARA EL APRENDIZAJE M ULTIM EDIA DEL MUNDO
VERDE? ..................................................................................................................................................................... 77
ILUSTRACIN 59 RESPUESTA A LA PREGUNTA. AUM ENT EL GRA DO DE INTERS DE
APRENDIZAJE UTILIZANDO LOS TABLETS? ............................................................................................. 78
ILUSTRACIN 60 RESPUESTA A LA PREGUNTA. LA UTILIZA CIN DE LA APLICACIN DEL
MUNDO VERDE EN LOS TABLETS FUE?...................................................................................................... 78
ILUSTRACIN 61 PRUEBA CON NIAS DE LA ESCUELA "FRANCISCA D VILA"............................. 79
ILUSTRACIN 62 PRUEBA CON LA S NIAS E INSTRUCTORES. ............................................................... 79
ILUSTRACIN 63 PRUEBA CON UN NIO DE LA ESCUELA "CA RLOS CRESPI" CON EL TABLET
COBY. ........................................................................................................................................................................ 80
ILUSTRACIN 64 PRUEBAS CON NIOS DE LA ESCUELA "CARLOS CRESPI".................................... 80
ILUSTRACIN 65 PRUEBA CON UN ESTUDIANTE DE LA ESCUELA CA RLOS CRESPI CON LA
TABLET SAMSUNG GA LAXY TA B 2.............................................................................................................. 81
ILUSTRACIN 66 GESTOR DE DESCA RGA S DE APLICACIONES PLAY STORE [35]. .......................... 81
ILUSTRACIN 67 BSQUEDA DE LA APLICACIN EN PLA Y STORE ..................................................... 82
ILUSTRACIN 68 DESCRIPCIN DE LA APLICACIN DEL M UNDO VERDE ........................................ 82
ILUSTRACIN 69 ACEPTA R Y DESCA RGA R LA APLICACIN DEL MUNDO VERDE ....................... 83
ILUSTRACIN 70 INSTALA CIN COM PLETA DE LA APLICACIN MUNDO VERDE........................ 83
ILUSTRACIN 71 ICONO DE LA APLICA CIN DEL M UNDO VERDE....................................................... 84
ILUSTRACIN 72 M EN PRINCIPAL DEL M UNDO VERDE .......................................................................... 84
ILUSTRACIN 73 M EN DE SUBTEMAS DEL M UNDO VERDE. ................................................................. 84
ILUSTRACIN 74 TRAMOS DEL M UNDO VERDE ........................................................................................... 85
9
ILUSTRACIN 75 CREACIN DE UNA CUENTA EN GMAIL. ....................................................................... 86
ILUSTRACIN 76 CONDICIONES DE SERVICIOS Y POLTICAS DE SEGURIDAD DE GOOGLE. ... 86
ILUSTRACIN 77 PA NTA LLA DE BIENVENIDA A GMAIL............................................................................ 87
ILUSTRACIN 78 CREACIN DEL PERFIL DESARROLLADOR EN GOOGLE PLAY............................. 87
ILUSTRACIN 79 ACUERDO DE DISTRIBUCIN PARA DESA RROLLADORES.................................... 88
ILUSTRACIN 80 PA GO DE CUOTA DE REGISTRO. ........................................................................................ 88
ILUSTRACIN 81 PA NEL DE A DMINISTRA CIN DE PUBLICACIONES EN ANDROID. .................... 89
ILUSTRACIN 82 VENTANA PA RA SUBIR EL PROYECTO DE ANDROID. ............................................. 89
ILUSTRACIN 83 SELECCIN DEL .APK ............................................................................................................. 89
ILUSTRACIN 84 CUA DRO DE PROGRESO DE SUBIR LA APLICA CIN AL SERVIDOR.................. 90
ILUSTRACIN 85 INFORMACIN DE LA APLICA CIN SUBIDA A L SERVIDOR. ................................ 90
ILUSTRACIN 86 ESPECIFICA CIONES DE LA INFORMACIN DEL M UNDO VERDE. ...................... 91
ILUSTRACIN 87 ESPECIFICA CIONES GRA FICAS DEL MUNDO VERDE. .............................................. 92
ILUSTRACIN 88 CATEGORIZACIN Y DETA LLE DE CONTACTO DEL MUNDO VERDE. ............. 92
ILUSTRACIN 89 ESPECIFICA CIN DEL PRECIO Y DISTRIBUCIN DEL M UNDO VERDE............ 93
ILUSTRACIN 90 PRESENTA CIN DE LA APLICA CIN EN GOOGLE PLAY DEL M UNDO VERDE.
..................................................................................................................................................................................... 94
NDICE DE TABLAS
TABLA 1 TALLERES REALIZADOS POR LOS NIAS Y NIOS EN EL AULA DE PEQ UEAS Y PEQUEOS
CIENTFICOS. .............................................................................................................................................................. 16
TABLA 2 MATRIZ DE LOS STAKEHO LDERS. ..................................................................................................................... 45
10
CAPTULO 1
11
1 INTRODUCCIN
1.1 Introduccin
Las Tecnologas de la Informacin y la Comunicacin TICs estn sufriendo un

desarrollo vertiginoso, lo cual est afectando a prcticamente todos los campos de
nuestra sociedad, y la educacin no es una excepcin [1], lo que conlleva a que las
tecnologas de informacin lleguen a ser un pilar bsico en la sociedad. Por ello, los
gobiernos estn invirtiendo en su desarrollo, de modo que las escuelas, colegios y
universidades puedan emplear las TICS como una herramienta de soporte en la
enseanza.
Actualmente las TICS ya estn cambiando ciertos procesos educativos mediante el

internet, como por ejemplo, educacin a distancia, el auto aprendizaje, cursos en
lnea, video conferencia, etc., lo que produce que sea un complemento o
enriquecimiento de la enseanza tradicional. Otro campo de utilizacin lo constituye
el apoyo en el aprendizaje, en donde las TICSson integradas pedaggicamente
dentro del proceso de enseanza del aula, como por ejemplo, el uso de dispositivos
mviles para un aprendizaje didctico [4].
Las TICS estn jugando un papel muy importante en el desarrollo de los pases,
siendo un factor importante para que los mismos puedan llegar a alcanzar ventajas
competitivas frente a los dems. El Ecuador no est dentro de pases que lideran
propuestas de innovacin en polticas y regulaciones que buscan desarrollar y
asimilar estas tecnologas. Esto produce que en el pas los estudiantes, entre una de
sus causas, no se enfoquen al mbito de la investigacin.
En este mundo globalizado, para poder lograr la inclusin de las TICS, es

importante incorporarlas en los entornos educativos y aplicar su uso, a travs del
uso de los dispositivos mviles para el aprendizaje o educacin virtual en los nios.
Una posible solucin a esta problemtica es que se empiece a inculcar la auto-

investigacin desde temprana edad, motivando esencialmente al estudio de las
ciencias exactas. Esto permitir crear en los nios y nias un inters por la
tecnologa e indirectamente afectar de manera positiva en el desarrollo de la
sociedad. La herramienta propuesta pretende complementar la labor de enseanza
de distintas ciencias por parte de los docentes escolares [3]. Consideramos que esta
enseanza se debe realizar con el apoyo de la tecnologa de los dispositivos mviles,
lo que probablemente ayude a motivar ms a los nios y nias en el uso de las
tecnologas de la informacin, auto-aprendizaje e investigacin.
Actualmente ya existe un proyecto en la Universidad Politcnica Salesiana para

apoyar el aprendizaje de los nios y nias, en lo que podemos apreciar como el
aprendizaje de las ciencias exactas con ayuda de las tics pueden influenciar
positivamente tanto en el desarrollo intelectual como creativo y emprendedor de los
nios y nias.
12
Las tecnologas de informacin se est renovando continuamente por lo que se ha
visto la posibilidad de desarrollar la aplicacin para los dispositivos mviles
utilizando tecnologas web como HTML5, CSS3 yJavaScript, y empaquetar dentro
de una aplicacin nativa para la visualizacin, obteniendo como resultado
aplicaciones hbridas potencializando las dos tecnologas, sin ms prembulo se
proceder al desarrollo del mismo.
1.2 Antecedentes
1.2.1 Justificacin
Actualmente la Universidad Politcnica Salesiana est desarrollando un proyecto

para apoyar el aprendizaje de nios y nias y despertar su inters por el estudio de la
ciencia y la tecnologa, todo esto desde una perspectiva basada en la
experimentacin y guas multimedia de enseanza. Este proyecto ya cuenta con un
portal web (www.pequeciencia.ups.edu.ec), sin embargo, se est renova ndo y dentro
de este proceso se ha visto la necesidad de incluir la plataforma de enseanza en
dispositivos mviles, ya que el continuo avance tecnolgico de stos ha permitido
que los usuarios puedan contar con herramientas de acceso virtual a diversos
procesos educativos.
En la actualidad las empresas estn analizando la posibilidad de trasladar sus

aplicaciones a los dispositivos mviles como una estrategia en el mercado muy
sofisticada, ya que el usuario se identifica con los aplicativos de la empresa,
consecuentemente las empresas estn buscando tener presencia en estos
dispositivos.
El beneficio que la Universidad Politcnica Salesiana obtendr, es mejorar sus

procesos de vinculacin con la colectividad y ayudar a que los nios y nias del
Azuay y el Ecuador puedan ser motivados por la tecnologa, despertando en ellos y
ellas ese amor por la ciencia.
El software desarrollado podr ser descargado en cualquier parte del mundo de

forma gratuita, llevando consigo el aval de la Universidad Politcnica Salesiana y
del Ecuador. Este programa permitir fomentar la investigacin a travs del uso de
aplicativos de dispositivos mviles y la riqueza tcnica generada puede servir de
base para en un futuro tener mejores procesos de estimulacin educativa en nios.
1.2.2 Descripcin del Problema
Como se mencion anteriormente, el proyecto Pequeas y Pequeos Cientficos ya

posee un portal web, en donde los nios y nias pueden profundizar su aprendizaje
sobre los mundos digital1 , elctrico 2 , magntico 3 y verde 4 , pero una gran desventaja
1
Mundo Digital: Representa la evolucin de la tecnologa impartiendo temas como el funcionamiento de los
aparatos digitales, trabajar con datos binarios y por ultimo una breve introduccin a la programacin de
software.
13
es que ellos deben tener un dispositivo con acceso a internet para poder utilizar
stos servicios. En virtud de ello, se busca contar con esta aplicacin en dispositivos
mviles, preferentemente en tablets. De esta forma, los nios y las nias se podrn
descargar completamente la aplicacin y tendrn la posibilidad de involucrarse en
este mundo tecnolgico.
Actualmente el continuo avance de la tecnologa pone a disposicin de los

usuarios una gran variedad de dispositivos mviles, los cua les ofrecen servicios que
agilitan los procesos diarios, ofreciendo una amplia gama de aplicaciones para todo
propsito. Un ejemplo de estos dispositivos son los tablets, los cuales se asemejan a
un mini laptop del tamao de un cuaderno pequeo que no necesita de perifricos
para su utilizacin, ya que incorpora la tecnologa touchscreen 5 [2] a un bajo costo.
Uno de los principales motivos por los que se ha desarrollado en la tecnologa

Android, es que el 68.1% de los dispositivos mviles a nivel mundial usan Android
como sistema operativo[5] y por otro lado es completamente gratuito, por lo que
existe un gran nmero de fabricantes de dispositivos que estn utilizando esta
tecnologa, de forma que el nmero de usuarios est creciendo exponencialmente.
1.3 Alcance
Se considera dentro del alcance de este proyecto:
Que la aplicacin Android del proyecto Pequeas y Pequeos Cientficos

funcione correctamente en dispositivos con esta tecnologa.
Que la aplicacin desarrollada se cargue a la tienda de GooglePlay para
su publicacin y posterior descarga gratuita.
Creaciones de animaciones y guas multimedia utilizando Android para
un mejor aprendizaje de los nios.
Redaccin de la memoria del proyecto
1.4 Objetivos
1.4.1 Objetivos General
Disear e implementar una aplicacin para dispositivos Android para en el marco

del proyecto Pequeas y Pequeos Cientficos de la Universidad Politcnica
Salesiana.
2
Mundo elctrico: Representa la utilizacin de la energa para todos los dispositivos digitales, dando a
conocer temas como la historia de la electricidad, tipos de electricidad y por ltimo el circuito elctrico.
3
Mundo Magntico: Representa la utilizacin de imanes impartiendo temas co mo el magnetismo, t ipos de
imanes, electro magnetismo y por ltimo el motor elctrico.
4
Mundo Verde: Representa la generacin de energ a y el medio ambiente impart iendo temas de v ital
importancia co mo la contaminacin, energ as renovables y por ltimo el cu idado del medio amb iente.
5
Permite que med iante el toque directo sobre la pantalla la entrada de los datos y rdenes al dispositivo, y a
su vez muestra los resultados en la pantalla, actuando como perifrico de entrada y salida de datos.
14
1.4.2 Objetivos Especficos
Desarrollar una aplicacin Android para el proyecto Pequeas y
Pequeos Cientficos que estar conformada por uno o ms mdulos de
aprendizaje de los mundos digital, verde, elctrico y magntico.
Generar una base de conocimiento debidamente documentada sobre el
desarrollo de proyectos Android
Realizar pruebas en diferentes tipos de dispositivos mviles
(preferentemente entablets).
Determinar cules son los requerimientos mnimos para que las
aplicaciones se ejecuten sin ningn problema en dispositivos basados en
Android.
Cargar la aplicacin terminada a la tienda de Google (Google Play).
Estudiar la tecnologa Android para el desarrollo de aplicaciones mviles
y de su metodologa para la documentacin
1.5 Experiencias del Proyecto Pequeas y Pequeos Cientficos de la Universidad

Politcnica Salesiana [3]
Desde el mes de diciembre del 2011 se han venido realizando diversas actividades
enfocadas a la implementacin del Aula de Ciencia de Pequeas y Pequeos
Cientficos. Se desarrollaron 8 talleres de ciencia, abarcando un total de 50 nios y
47 nias con un total de 97 estudiantes llegando a firmar convenios con las escuelas
Carlos Crespi y Francisca Dvila de la ciudad de Cuenca, en la siguiente tabla
se detalla cada uno de los talleres dictados.
TALLERES REALIZADOS
Fecha de Fecha de
Taller Escuela Cupo Horario
inicio finalizacin
CARLOS Lunes 9 de Viernes 20 de 15h00-

Taller 1 12 nios
CRESPI abril abril 16h00
FRANCISCA Lunes 9 de Viernes 20 de 16h00-
Taller 2 12 nias
DVILA abril abril 17h00
Taller 3 12 nios
CRESPI abril mayo 16h00
Taller 4 12 nias
DVILA abril mayo 17h00
Taller 5 12 nios
CRESPI mayo mayo 16h00
Taller 6 12 nias
DVILA mayo mayo 17h00
Taller 7 12 nios
CRESPI mayo junio 16h00
15
FRANCISCA Lunes 21 de Viernes 16h00-
Taller 8 12 nias
DVILA mayo 1 de junio 17h00
Tab la 1 Ta lle res re a lizados por N ia s y N ios e n e l Aula de Peq ue as y
Peque os C ie ntfico s.
Resultados del proyecto:
Resultados acadmicos.
Se ha observado un incremento del 48% en el promedio del nivel del conocimiento

de los nios y nias de los temas abarcados. Estos resultados se han obtenido de la
comparacin entre el pre-test y el post-test. La metodologa utilizada para alcanzar
este resultado no contempl la necesidad de enviar deberes, trabajos, ni estudiar en
horas fuera del taller.
70%
58%
60%
50%
40%
30%
20%
10%
10%
0%
PRE-TEST POST-TEST
I lustrac i n 1 P ro med io de l nive l de co noc imie nto de los nios y nias

respecto a los te mas abarcados e n los ta lleres, a ntes y d esp us de los
mis mos.
Se plante la pregunta: Qu deseas ser cuando seas grande?. En el pre-test

apenas el 31% de los nios y nias se inclinaban por carreras vinculadas con la
ciencia y la ingeniera. Despus de los talleres el 65% expres que su deseo era
convertirse en cientfico o ingeniero.
I lustrac i n 2 I nte rs de los nio s y I lustrac i n 3 I nte rs de los nio s

nias e n la s car reras p ro fes io na le s y nias e n la s car reras
previo a lo s ta lle res (p re- test).
16
El 98% de los estudiantes manifest su gran satisfaccin de haber asistido a los
talleres Pequeas y Pequeos Cientficos. La razn predominante de este gusto es
esencialmente la metodologa de enseanza que se aplic, basada en adquirir nuevos
conocimientos de una manera divertida, por medio de la experimentacin y el juego.
Te gust el taller "Pequeas y Pequeos

Cientficos"?
98%
100%
80%
60%
40%
20%
1% 0% 1%
0%
Mucho Mas o menos Poco No contesta
I lustrac i n 4 Resp uesta de los nios y nia s a la p re gunta Te gust e l

ta ller Peq ue as y Peq ue o s C ie ntf icos?
Impacto en los padres de familia.
Se aplic la encuesta a los padres de familia a partir de la cual se determin que al

96% de los mismos les gustara mucho que sus hijos e hijas participen en este tipo
de talleres.
I lustrac i n 5 I nte rs de los padre s de fa milia e n q ue s us nios y nias

partic ipe n e n ta lleres de este tipo.
El 97% de los padres de familia expresaron que sus hijos e hijas diariamente sentan
muchas ganas de asistir a los talleres de ciencia. Asimismo, el 95% dijo que sus
hijos e hijas realizaban comentarios positivos en casa acerca de los talleres.
La repercusin de los talleres de ciencia expresa que el 71% de los padres de familia
percibieron que sus hijos e hijas, despus de los talleres, se interesaban mucho por
noticias de ciencia y tecnologa, y asimismo, un 75% dijo que sus nios y nias se
sentan muy motivados en conocer el porqu de las cosas y cmo funcionan.
17
Impacto en los centros educativos.
El proyecto ha tenido una excelente acogida por parte los centros educativos con los
cuales se trabaj durante esta primera etapa, quienes han manifestado que esto ha
sido una experiencia enriquecedora en el desarrollo intelectual, creativo y
emprendedor de los nios y nias participantes.
A continuacin se muestra unas imgenes de cmo los nios y nias toman las
clases, se entregan los respectivos diplomas por haber cruzado con xito el taller y
como sus padres son informados de los avances que tiene sus hijos del proyecto
Pequeas y Pequeos Cientficos.
I lustrac i n 6 Ta lle res e n e l Aula de c ie nc ia co n la esc ue la Fra nc isca

D vila.
I lustrac i n 7 Ta lle res e n e l Aula de c ie nc ia co n la esc ue la Car los Cresp i.
18
I lustrac i n 8 I na ugurac i n y e ntre ga de d ip lo mas a 1 e r gr upo de Peq ue as
y Peq ue os C ie ntfico s. Vis ita de Secr etar io de l Se nesc yt, Re n Ra mre z.
I lustrac i n 9 Re uni n co n padre s de fa milia e n la esc ue la Car lo s C resp i.
19
CAPTULO 2
20
2 ESTUDIO DE LA TECNOLOGA A DESARROLLAR
2.1 Estudio de HTML 5 para dispositivos mviles
La aparicin de internet y del World Wide Web, ha cambiado para siempre nuestra
forma de acceder a la informacin. Con la progresiva conversin de la Web en la
conocida Web 2.0, los usuarios pasamos de ser consumidores de informacin a
generadores de contenido, por consiguiente manejar y entender el lenguaje HTML5,
CSS3 y JavaScript nos permitir controlar a la perfeccin los materia les que
deseemos publicar en internet, proporcionndoles la forma y la estructura
apropiada[36].
HTML5 es un estndar que empez a desarrollarse en el ao 2009, y que nos

ofrece nuevas caractersticas para lograr de forma ms eficiente funciones que antes
slo se lograban instalando complementos como Flash Player o que slo eran
posibles en aplicaciones de escritorio o apps 6 nativas para los distintos dispositivos
mviles y tablets, pero se sigue conservando etiquetas de sus antecesores HTML4 y
XHTML [7].
HTML5 ya que no es simplemente una nueva versin del lenguaje de marcacin

HTML, sino una agrupacin de diversas especificaciones concernientes al
desarrollo web, se pretende proporcionar una plataforma con la que se desarrolle
aplicaciones web ms parecidas a las aplicaciones de escritorio. Para ello se estn
desarrollando APIS 7 que permitan trabajar con cualquiera de los elementos de la
pgina y realizar acciones que hasta hoy era necesario realizar por medio de
tecnologas adicionales [6], adems, por su caractersticas de cdigo
libre, renderizable 8 desde el navegador, flexibilidad y ligereza, hace que HTML5
sea una gran opcin para los dispositivos mviles [8].
Las reglas bsicas que se plantearon a la hora de actualizar a HTML 5 fueron [11]:
Basarse en HTML, CSS, DOM y JavaScript.

Reducir la necesidad del uso de plugins 9 , como por ejemplo flash.
Mejorar el tratamiento de errores.
Crear etiquetas que reemplacen el uso de scripts.
Lenguaje que pueda utilizarse en cualquier tipo de dispositivo, como
mviles, tablets, etc.
6
Apps es una abreviatura de aplicacin que puede funcionar en internet, en el equipo o en un dispositivo
mvil.
7
Apis es una abreviacin de Interfaz de programacin de aplicaciones, es un conjunto de rutinas, protocolos y
herramientas para la construccin de aplicaciones de software.
8
La renderizacinse encarga de interpretar las marcas (HTM L, XM L, imgenes, etc.) o la informacin de
formato (CSS, XSL, etc.), para mostrar el contenido formateado, es decir, con las formas y estilos
apropiados[32].
9
Es un co mplemento de una aplicacin que se relaciona con otra, para aportarle una funcin nueva y
generalmente muy especifica.
21
Eliminacin de etiquetas y atributos obsoletos o no deseables.
I lustrac i n 10 Co mpos ic i n de Html5 [9 ]
Sin embargo, el principal problema es que an se est definiendo el lenguaje. Por

ello, al no encontrarse estandarizado, los navegadores an no soportan al 100% sus
nuevas funcionalidades [34]. A continuacin se puede apreciar el grado de
compatibilidad de los principales navegadores web.
I lustrac i n 11 Co mpatib ilidad de los na ve gado res web co n html5 [10 ]
HTML5 permiten una flexibilidad y potencia muy grandes para la creacin de

animaciones, adems de hacerlas independientes del dispositivo en el que se est
visualizando: ordenadores, mviles, iPads, tablets, etc. [18],ejecutadas dentro de
un componente WebKit del mvil.
2.2 Estudio del entorno de desarrollo Android 10
Android es una plataforma para dispositivos mviles que contiene una fuente de
software donde se incluye un sistema operativo, middleware 11 y aplicaciones
bsicas para el usuario, con las siguientes caractersticas:
Desarrollo rpido de aplicaciones, que sean reutilizables y

verdaderamente portables entre diferentes dispositivos.
10
Toda sta seccin est tomada textual e ntegramente de [14].
11
Middleware es un software de computadora que conecta co mponentes de software o aplicaciones para que
puedan intercambiar datos o comunicarse entre stas [19].
22
Cuenta con su propia mquina virtual, Dalvik, que interpreta y ejecuta
cdigo escrito en Java.
Permite la representacin de grficos 2D y 3D.
Posibilita el uso de bases de datos.
Soporta un elevado nmero de formatos multimedia.
Servicio de localizacin GSM.
Controla los diferentes elementos hardware: Bluetooth, Wi-Fi, cmara
fotogrfica o de vdeo, GPS, acelermetro, infrarrojos, etc.
Cuenta con un entorno de desarrollo muy cuidado mediante un SDK
disponible de forma gratuita.
Ofrece un plugin para uno de los entornos de desarrollo ms populares,
Eclipse, y un emulador integrado para ejecutar las aplicaciones
Un dispositivo Android cuenta con la siguiente arquitectura (ilustracin 12), la

misma que se proceder a detallar sus componentes ms importantes.
I lustrac i n 12 Arq uitec tura de Andro id
La capa ms inmediata es la que corresponde al ncleo de Android, utiliza el

ncleo de Linux 2.6 como una capa de abstraccin para el hardware disponible en
los dispositivos mviles, la cual contiene los drivers necesarios para cualquier
componente de hardware pueda ser utilizado.Cabe recalcar que el fabricante es el
encargado de crear las correspondientes libreras de control odrivers.
23
La siguiente capa corresponde con las libreras utilizadas por Android,estas han
sido escritas utilizando C/C++ y proporcionan a Android la mayor parte de sus
capacidades y caractersticas:
La librera libc incluye todas las cabeceras y funciones segn el estndar

del lenguaje C. Todas las dems libreras se definen en este lenguaje.
La libreraSurfaceManager es la encargada de componer los diferentes
elementos de navegacin de pantalla. Gestiona tambin las ventanas
pertenecientes a las distintas aplicaciones activas en cada momento.
OpenGL/SL y SGL representan las libreras grficas y por tanto
sustentan la capacidad grfica de Android.
La librera MediaPlayerproporciona todos los cdecs necesarios para el
contenido multimedia soportado en Android (vdeo, audio, imgenes
estticas y animadas, etc.)
A travs de la librera SQLite, Android ofrece la creacin y gestin de
bases de datos relacionales.
La librera WebKit proporciona un motor para las aplicaciones de tipo
navegador, y forma el ncleo del actual navegador incluido por defecto
en la plataforma Android.
En este nivel tambin se encuentran las libreras de Android, entre las cuales
encontramos las CoreLibraries, estas estn desarrolladas en lenguaje java, y la
maquina virtual Dalvik, que constituyen el framework de aplicaciones el cual
representa fundamentalmente el conjunto de herramientas de cualquier aplicacin.
Dentro de este framework de aplicaciones podemos mencionar algunas de las

libreras ms importantes:
Activity Manager: Importante conjunto de APIs que gestiona el ciclo de

vida de las aplicaciones en Android.
Window Manager: Gestiona las ventanas de las aplicaciones
TelephoneManager: Incluye todas las APIs vinculadas a las
funcionalidades propias del telfono (llamadas, mensajes, etc.)
Content Providers: Permite a cualquier aplicacin compartir sus datos
con las dems aplicaciones de Android. Por ejemplo, gracias a esta API
la informacin de contactos, agenda, mensajes, etc. ser accesible para
otras aplicaciones.
View System: Proporciona un gran nmero de elementos para poder
construir interfaces de usuario (GUI), como listas, mosaicos, botones,
check-boxes, tamao de ventanas, control de las interfaces mediante
tacto o teclado, etc. Incluye tambin algunas vistas estndar para las
funcionalidades ms frecuentes.
24
Location Manager: Posibilita a las aplicaciones la obtencin de
informacin de localizacin y posicionamiento.
Notification Manager: Permite que las aplicaciones usen un mismo
formato para comunicar al usuario eventos que ocurran durante su
ejecucin, por ejemplo, una llamada entrante, un mensaje recibido,
conexin Wi-Fi disponible, ubicacin en un punto determinado, etc.
La mquina virtual Dalvik ha sido optimizada y adaptada a las peculiaridades

propias de los dispositivos mviles (menor capacidad de proceso, baja memoria,
alimentacin por batera, etc.) y trabajar con ficheros de extensi n
.dex(DalvikExecutables). Dalvik no trabaja directamente con el bytecode de Java,
sino que lo transforma en un cdigo ms eficiente que el original, pensado para
procesadores pequeos.
Los ficheros .class de Java se compilan en ficheros .dex, de forma que cada fichero
.dex puede contener varias clases. Despus, este resultado se comprime en un nico
archivo de extensin .apk(AndroidPackage), el cual es el que se distribuir a los
dispositivos mviles.
Una vez vista la arquitectura de Android, debemos re visar cules son los
componentes bsicos de una aplicacin:
Activity: Un componente Activity refleja una determinada actividad

llevada a cabo por una aplicacin y se asociatpicamente a una ventana
o interfaz de usuario.
BroadcastIntent Receiver: Se utiliza para lanzar una ejecucin dentro de
la aplicacin actual cuando un determinado evento se produzca. El
sistema lanzar la aplicacin si es necesario cuando el evento
monitorizado tenga lugar.
Service: Representa una aplicacin ejecutada sin interfaz de usuario y
que generalmente tiene lugar en segundo plano mientras otras
aplicaciones son las que estn activas en la pantalla del dispositivo.
Content Provider: Una clase que implemente este componente contendr
una serie de mtodos que permite almacenar, recuperar, actualizar y
compartir los datos de una aplicacin ya sea en archivos o la base de
datos SQLite.
Cada uno de los componentes bsicos de Android tiene un ciclo de vida bien
definido; esto implica que el desarrollador puede controlar en cada momento en qu
estado se encuentra dicho componente, pudiendo as programar las acciones.
El componente Activity, probablemente el ms importante tiene el siguiente ciclo de

vida:
25
I lustrac i n 13 C ic lo de vida de un Activ ity [20]
En la ilustracin 13 podemos observar que entre los principales eventos que

tenemos son:
onCreate(), onDestroy(): Abarcan todo el ciclo de vida. Cada uno de

estos mtodos representan el principio y el fin de la actividad.
26
onStart(), onStop(): Representan la parte visible del ciclo de vida. Desde
onStart() hasta onStop(), la actividad ser visible para el usuario.
onResume(), onPause(): Delimitan la parte til del ciclo de vida. Desde
onResume() hasta onPause(), la actividad no es visible.
La mayora de las medidas de seguridad entre el sistema y las aplicaciones deriva

de los estndares de Linux 2.6. Por defecto, ninguna aplicacin tiene permiso para
realizar ninguna operacin o comportamiento que pueda impactar negativamente en
la ejecucin de otras aplicaciones o del sistema operativo. La nica forma de poder
saltar estas restricciones impuestas por Android, es mediante la declaracin explcita
de un permiso que autorice a llevar a cabo una determinada accin.
Android tiene varios avances en tecnologa y funcionalidad, cada uno de estos

avances conlleva a una actualizacin en las cuales se arreglan los problemas y se
agregan nuevas funciones.Actualmente Android se encuentra en la versin 4.1
(JellyBean), en la ilustracin 14 se puede apreciar las versiones de Androidms
utilizadas en los celulares y tablets, realizada en noviembre del 2012
I lustrac i n 14 Po rce nta jes de d is tr ib uc io nes de Andro id utilizadas

actua lme nte [21]
2.3 Comparacin de la plataforma de desarrollo Android con HTML 5 para

dispositivos mviles.
Se proceder a detallar las ventajas y desventajas de las dos plataformas de

desarrollo para dispositivos mviles.
27
2.3.1 AplicacionesHTML5 para dispositivos mviles.
Una de las principales ventajas del desarrollo en dispositivo mviles es que todos
los dispositivos tienen un navegador web, que ya incorpora la tecnologa HTML5,
por lo que podemos crear una aplicacin web y desplegar la aplicacin dentro de un
visor Web como si fuera nativa [15].
Ventajas [15]:
Es de fcil diseo ya que no siempre se debe desarrollar una aplicacin

para mviles. Se puede realizar un diseo adaptado a una pantalla y se
podr visualizar como una aplicacin nativa.
Fcil implementacin en las aplicaciones que se pueden desarrollar
utilizando tecnologas web como HTML5, CSS3 y JavaScript,
permitiendo as optimizar el tiempo de desarrollo.
Manejo de seguridad utilizando libreras de JavaScript.
Acceso al hardware del dispositivo lo que permite acceder a las
caractersticas del dispositivo mvil como por ejemplo el GPS,
acelermetro, cmara, contactos, base de datos, filesystem, etc., por
medio de un framework[13].
Es la solucin que ms plataformas mviles soporta, ya que corre dentro
de un navegador web. Adems de Iphone/Ipad y Android, funciona
tambin en Palm, Symbian, WebOS, Windows 7 y BlackBerry [13].
Hay buena documentacin y bastantes ejemplos en lnea permitiendo un
mejor desarrollo [13].
La licencia es gratuita [13].
Desventajas
Mayor consumo de recursos ya que se debe renderizar HTML e

interpretar JavaScript, lo cual es ms costoso que ejecutar una aplicacin
nativa en trminos de recursos de hardware del dispositivo[15].
2.3.2 Aplicaciones nativas.
Entre las principales ventajas y desventajas del desarrollo nativo en dispositivos

mviles basados en Android son los siguientes:
Ventajas [22]:
Se puede instalar en casi todo tipo de dispositivos, lo cual permite que

los diferentes fabricantes y operadoras tomen a este sistema operativo en
sus equipos [16].
28
Android tiene un sistema completamente libre para que un desarrollador
no solo pueda modificarlos sino tambin mejorarlo.
Entorno de desarrollo libre basado en Eclipse y compatible con varios
sistemas operativos, que cuenta con simulador de Android para probar
las aplicaciones.
Libreras y componentes reutilizables para todo tipo de aplicaciones.
Gran comunidad de desarrolladores, variasfuentes de informacin acerca
de la plataforma con ejemplos de cada una de las aplicaciones.
Ms de 100.000 aplicaciones disponibles para telfonos Android la
mayora gratis.
Es un sistema operativo multitarea quees capaz de gestionar varias
aplicaciones abiertas a la vez, dejando en suspensin aquellas que no se
utilicen y cerrarlas en caso de resultar ya intiles para evitar un consumo
de memoria[16].
Desventajas [22]:
Google tiene una poltica restrictiva hacia las versiones ms recientes, no

hacindolas pblicas hasta que ellos lo vean conveniente.
Como Android es un sistema operativo de cdigo abiertoproduce que este
expuesto a vulnerabilidades.
Despus de un anlisis podemos llegar a la conclusin de que la tecnologa web es

un complemento del desarrollo para dispositivos mviles en su lenguaje nativo, ya
que nos permite desarrollar bajo una tecnologa utilizando HTML5 con todas sus
potencialidades. Por otra parte, CSS3 nos ayuda a la realizacin de animaciones,
estilos y efectos en los componentes de HTML y la potencialidad de JavaScriptpara
el manejo de eventos, servicios web, accesos a las caractersticas del dispositivo
como la cmara, GPS, acelermetros, etc. A este tipo de aplicaciones se les conoce
como aplicaciones hbridas [15].
Las aplicaciones hbridas potencializan las dos tecnologas para el desarrollo de

aplicaciones mviles, ya que una de las principales desventajas de la tecnologa web
es que tiene un mayor consumo de recursos, producido por que se ejecuta dentro de
un WebView, lo queproduce que se renderize la aplicacin e interpretecomo nativa,
por lo que en algunos casos es necesario complementar con las tecnologas nativas
para aumentar el rendimiento de la aplicacin.
Personalmente, para un tamao pequeo o mediano de una aplicacin que slo tiene
que mostrar el contenido, que necesita utilizar componentes bsicos del dispositivo
y no se necesita un mayor rendimiento, se puede realizar mediante tecnologa Web,
sin embargo, si la aplicacin se necesitaun mayor consumo de recursos y el uso
nativo de componentes se debe desarrollar con Androidnativo[17].
29
2.4 Especificaciones de la tecnologa de desarrollo.
Para el desarrollo de la aplicacin en elmarco del proyecto Pequeas y Pequeos

Cientficos de la Universidad Politcnica Salesiana, se proceder a utilizar las
tecnologas Android, HTML5, CSS3 yJavaScript, para la creacin de componentes
visuales y multimedia.
A continuacin se detalla la instalacin y configuracin para la creacin de

aplicaciones hbridas en Windows 7 Ultimate.
2.4.1 Instalacin y configuracin de JDK 7
Para instalar el entorno de desarrollo JDK 7 en Windows, debemos seguir estos

pasos:
1. Descargar el JDK de la sitio web de Oracle

http://www.oracle.com/technetwork/java/javase/downloads/index.html, en esta
pgina encontramos las diversas versiones (durante la redaccin de estas lneas,
la ltima versin que existe es la versin 7).
I lustrac i n 15 S itio web d e Orac le pa ra la de scar ga de l J DK
30
2. Se procede a aceptar los trminos de licencia y escoger el instalador del sistema
operativo en el que se est desarrollando, en este caso se escoge Windows.
I lustrac i n 16 Desc ar ga de l JDK
3. Con esto se descargar un archivo ejecutable, en el cual procedemos a dar doble

clic para la instalacin y posteriormente damos clic en siguiente.
I lustrac i n 17 I nsta lac i n de J DK 7
31
4. Escogemos las caractersticas que deseamos instalar y damos clic en siguiente,
se proceder a instalar del JDK.
I lustrac i n 18Ca racte r s tica s de ins ta lac i n de l J DK
5. Por ltimo se nos presenta un mensaje que nos informa que la instalacin se
realiz con xito, damos clic en cerrar.
I lustrac i n 19 Es tado de la ins ta lac i n de l JDK
32
2.4.2 Instalacin y configuracin del SDK de Android
1. Primeramente se descargara la versin de SDK de Android del sitio web

http://developer.android.com/sdk/index.html.
I lustrac i n 20 S itio web p ara la descar ga de l S DK de Andro id
2. Se procede a la instalacin del SDK, dando doble clic en el archivo descargado,

se nos presenta la siguiente pantalla y damos clic en siguiente.
I lustrac i n 21 I nsta lac i n de l S DK de Andro id
33
3. Escogemos el directorio en donde queremos que se instale el SDK yprocedemos
a dar clic en siguiente.
I lustrac i n 22 Directo r io de ins ta lac i n de l S DK de Andro id
4. Se instalara todos los paquetes del SDK de Android, damos clic en instalar.
I lustrac i n 23 Paq uetes de ins ta lac i n de Andro id
34
5. Una vez completada la instalacin procedemos a dar clic en Finalizar.
6. Posteriormente se deben instalar paquetes adicionales del sistema operativo

Android, con esto podemos ejecutar nuestras aplicaciones dentro de un
dispositivo virtual, escogemos la ltima versin de Android,la cual al momento
de la redaccin de este documento es la 4.1 (API 16) y se escoger la versin
3.1 (API 11) como base, para realizar las pruebas en las diferentes versiones,
damos clic en instalar paquetes.
I lustrac i n 24 I nsta lac i n de la s p la ta for mas d ispo nib les de Andro id
7. Una vez terminada la instalacin de los paquetes se proceder a crear una

mquina virtual de Android, para esto nos dirigimos al Men Tools y
seleccionamos Manager ADVS, aqu podemos crear los dispositivos virtuales
para la ejecucin de las aplicaciones en un entorno virtual.
35
I lustrac i n 25 Ad minis tr ac i n de d ispos itivo s vir tua les de And ro id
8. Para crear un nuevo dispositivo virtual damos clic en Nuevo.
I lustrac i n 26 Cr eac i n de un nue vo d ispos itivo virtua l de And ro id
36
9. Ingresamos el nombre del dispositivo virtual, la plataforma en la que se va a
ejecutar, asignamos el tamao de memoria, el tipo de pantalla y el hardware con
el que cuenta el dispositivo. Una vez terminado damos clic en Create ADV.
I lustrac i n 27 Co nfigurac i n de un nue vo d ispos itivo vir tua l de Andro id
10. Una vez terminada la creacindel dispositivo virtual, podemos iniciarlo para
comprobar su correcto funcionamiento, para esto damos clic en comenzar.
37
I lustrac i n 28 Vis ua lizac i n d e los d ispos itivos virtua les And ro id.
11. En la siguiente pantalla se muestra la ejecucin del dispositivo virtual.
I lustrac i n 29 Ejec uc i n d e l d ispos itivo vir tua l Andro id
38
2.4.3 Instalacin y configuracin de Eclipse Indigo
Se proceder a detallar la instalacin y configuracin del entorno de desarrollo

eclipse
1. Se utilizar Eclipse Indigo 3.7 como entorno de desarrollo, el cual se descarga

del sitio web de Eclipse:
http://www.eclipse.org/downloads/download.php?file=/technology/epp/downloa
ds/release/juno/R/eclipse-jee-juno-win32.zip, dentro de este sitio escogemos el
servidor de descarga.
I lustrac i n 30 S itio web d e descar ga de l Ec lipse I nd igo 3.7
2. Una vez finalizada la descarga no se debe realizar ningn proceso de

instalacin, simplemente se debe descomprimir el fichero en un nuevo directorio
y damos clic en el ejecutable de eclipse, la primera vez que se ejecuta la
aplicacin nos solicita escoger nuestro espacio de trabajo (workspace),carpeta
donde se almacenarn todas las aplicaciones desarrolladas.
2.4.4 Instalar el plugin de Android para Eclipse
El siguiente paso es instalar el plugin especfico de Androidpara la plataforma de

desarrollo EclipseIndigo, para esto nos valemos de la herramienta ADT
(AndroidDeveloment Tools) que nos facilita enormemente el desarrollo de proyectos
basados en Android.
39
1. Seleccionamos en el Men Help>Install New Software
I lustrac i n 31 I nsta lac i n de lp lugin A DT e n Ec lip se.
2. Damos clic en agregar repositorio, le asignamos un nombre al repositorio que

vamos a agregar (por ejemplo, Android) y en la localizacin ingresamos el
siguiente repositorio web https://dl-ssl.google.com/android/eclipse/ como se
muestra en la ilustracin 32.
I lustrac i n 32 Agre gac i n e l repos ito r io de Andro id
40
3. Seleccionamos la pestaa Develoment Tools y procedemos a dar clic en
siguiente, produciendo que se instalenlos paquetes necesarios para el desarrollo
de software en Android.
I lustrac i n 33 Se lecc i n e ins ta lac i n de los paq ue tes de Andro id
4. Una vez terminada la instalacin se deber reiniciar Eclipse para que los
cambios tengan efecto.
2.4.5 Creacin de un nuevo proyecto Android
1. Seleccionar en el Men File > New > Project, y en el men resultante desplegar
la opcin Android y elegir Android Project y damos clic en siguiente.
41
I lustrac i n 34 Cr eac i n de nue vo pro yec to de And ro id
2. Se nos presenta la configuracin del nuevo proyecto, el cual tiene los siguientes
parmetros [14]:
Project name: Es el nombre del proyecto, en la prctica ser el nombre

que reciba la carpeta donde se guardar todo lo relativo al presente
proyecto dentro del workspace.
Packagename: El nombre del paquete bajo el cual ser desarrollado todo
el cdigo.
Activityname: Es el nombre de la clase Activity principal que ser creada,
esta clase simplemente es una clase ejecutable, capaz de realizar alguna
tarea y es imprescindible en la mayora de las aplicaciones para
Android.
Applicationname: El nombre de la aplicacin que se va a desarrollar,
constituye el nombre visible para el usuario del dispositivo mvil.
42
I lustrac i n 35 Co nfigurac i n de un nue vo p ro yecto Andro id.
3. Una vez terminada la creacin del nuevo proyecto, damos clic en finalizar.
4. Para ejecutar la aplicacin debemos dar clic derecho sobre el proyecto y

seleccionamos Run As >AndroidApplication, en la ilustracin 36 se observa el
resultado de ejecutar la aplicacin.
I lustrac i n 36 Ejec uc i n d e la ap licac i n Andro id.
43
CAPTULO 3
44
3 DISEO DEL SOFTWARE.
3.1 Levantamiento de Requerimientos de Software.
Como se mencion en el captulo anterior, el proyecto ya cuenta con un portal web

(www.pequeciencia.org) en donde se encuentran los cuatro mdulos
desarrollados.Dichosmdulos han sido desarrollados bajo la tecnologa de Adobe
Flash Builder. Un gran problema de la tecnologa flash es que en las nuevas
versiones de los sistemas operativos para dispositivos mviles como IOS y Android
4.1 se descartla compatibilidad de ejecucin de flash[33].
La tecnologa est en auge y los sistemas operativos mviles estn obteniendo una
mayor compatibilidad con HTML5, CSS3 yJavaScriptpara plasmar animaciones que
antes solo era posible en flash,consecuentemente,la principal fuente para el
levantamiento de requerimientos es el sitio web y donde los cdigos fuentes de la
aplicacin, repositorio de imgenes y sonidos fueron entregados por el equipo de
desarrollo del proyecto de Pequeas y Pequeos Cientficos (Ing. Elena Duran y
Ing. Diego Granja).
3.1.1 Definicin de Stakeholders12
En la siguiente matriz se puede apreciar cules son los stakeholders involucrados en

el proyecto de Pequeas y Pequeos Cientficos de la Universidad Politcnica
Salesiana.
Matriz de los Stakeholders
NOMBRE CARGO RELEVACIN

(1-5)
Ing. Elena Duran Desarrolladores del Proyecto 5
Pequeas y Pequeos
Cientficos.
Ing. Diego Granja Desarrolladores del proyecto 5

Pequeas y Pequeos
Cientficos.
Ing. Vladimir Robles Director de Tesis 5
Ing. Rodolfo Bojorque Equipo de Investigacin 4
Ing. Eduardo Calle Jefe del departamento de 3

Investigacin
Tab la 2 Matr iz de los Stak eholders.
12
Stakeholder es una persona u organizacin que tiene influencia directa, indirectamente o se ve influenciado
por un proceso de desarrollo del software [25].
45
3.1.2 Tcnicas de Elicitacin [26]
El propsito de la elicitacines recolectar informacin de los stakeholders y

capturar esa informacin en el formato de posibles requerimientos (tanto tcnicos
como no tcnicos), junto con la justificacin que da soporte a cada requerimiento,
empleando tcnicas como:
Entrevistas: La entrevista es una forma de iteracin simple entre el

analista y los stakeholders. El analista simplemente permite que los
stakeholders hablen sobre las tareas que debe cumplir el software, lo cual
nos permite tener una visin global del dominio del problema. Por ello,
se mantuvo entrevistas constantes obteniendo una visin comp leta del
problema.
Tormenta de Ideas: Se rene un conjunto de personas relacionadas al
producto y stas sugieren y exploran sus ideas libremente, generando una
amplia variedad de puntos de vistas, logrando construir una imagen ms
completa del problema. Se obtuvo numerosas alternativas para resolver
el dominio del problema y las tecnologas a emplear.
RAD (Rapid ApplicationDesign):Diseo Rpido de Aplicaciones, es un
proceso de desarrollo de software que permite la construccin de
sistemas tiles en menos de 90 das.Es una metodologa para comprimir
el anlisis, el diseo, la construccin y las fases de prueba en una serie de
ciclos de desarrollo cortos e iterativos, por lo que en cada iteracin se
entrega una parte funcional del sistema
Prototipacin: La prototipacin es el proceso de creacin de un sistema
que ilustra las caractersticas relevantes del mismo. Comienza por el
estudio preliminar de los requerimientos del usuario y concluye con una
serie de requerimientos formulados y un prototipo desechable. Es un
proceso iterativo que permite la definicin del comportamiento del
sistema y en particular la apariencia del mismo.
3.1.3 Suposiciones y Dependencias
Se brindar el apoyo del equipo de desarrolladores del proyecto
Pequeas y PequeosCientficos.
La Universidad Politcnica Salesiana proveer las licencias para el
desarrollo e implementacin del software.
Acceso al laboratorio del CIDII (Centro de Investigacin, Desarrollo e
Innovacin en Ingenieras de la UPS).
La Universidad Politcnica Salesiana proveer de 2 tablets con Android
de 10 y 7 pulgadas.
Conexin a internet.
46
3.1.4 Requerimientos Funcionales
Laaplicacin desarrollada consta del mundo elctrico y del mundo verde,

consecuentemente el Mundo Verde est compuesto de los siguientes personajes,
temas y actividades.
Personajes:
Cientfica: Doctora Atmica.
Cientfico: Doctor Voltio
Nio: Panchito
Nia: Robertina
rbol: Calipto
Temas:
Tema 1: Un gran problema
Subtema 1: La contaminacin ambiental
Tramo 1: Planeta enfermo
Tramo 2: La contaminacin
Subtema 2: Todo necesita energa
Tramo 1: Energa
Tramo 2: Polucin
Tramo 3: Mundo verde
Tema 2: Las energas renovables
Subtema 1: Generacin de energa elctrica
Tramo 1: Energas renovables
Tramo 2: Energa elica
Tramo 3:Aerogeneradores
Tramo 4:Energa hidrulica
Tramo 5:Energa solar
Tramo 6:Reto solar
Tema 3: Cuidando el medio ambiente
Subtema 1: Salvemos al planeta
Tramo 1: Ahorremos energa elctrica
Tramo 2: Recomendaciones
Tramo 3: Ms Recomendaciones
Actividad:
Experimento 1: Moviendo un motor con la energa del sol.
Materiales:
Un fuerte sol
1 panel solar fotovoltaico
2 cables con lagartos
Motorcito
Procedimiento:
1. Anda a un lugar en donde haya mucho sol.
2. Conecta los elementos como se indica a continuacin
47
El Mundo Elctrico consta con los siguientes personajes, temas y actividades. Lo
cual se detallara a continuacin.
Personajes
Cientfica: Doctora Atmica.
Cientfico: Doctor Voltio
Nio: Panchito
Nia: Robertina
Temas:
Tema 1: Un poquito de historia
Subtema 1: Un mundo lleno de energa
Tramo 1: Todo necesita energa
Subtema 2: Tales de Mileto
Tramo 1: Filsofo
Subtema 3: Benjamn Franklin y los rayos
Tramo 1: Los rayos
Tramo 2: Rayos = Electricidad
Tramo 3: El pararrayos
Subtema 4: Alessandro Volta y la pila elctrica
Tramo 1: Pila elctrica
Subtema 5: Thomas Alva Edison y el foco elctrico
Tramo 1: Se le prendi el foco
Tema 2: Qu es la electricidad?
Subtema 1: Energa elctrica
Tramo 1: Recurdalo bien!
Subtema 2: El tomo y sus partes
Tramo 1: El tomo
Tramo 2: Electrones, protones y neutrones
Subtema 3: Tipos de electricidad
Tramo 1: Electricidad esttica
Tramo 2: Corriente elctrica
Tema 3: El circuito elctrico
Subtema 1: La corriente elctrica
Tramo 1: El circuito elctrico
Tramo 2: El interruptor
Tramo 3: Los conductores
Tramo 4: Voltaje elctrico
Tramo 5: Batera elctrica
Tramo 6: Resistor elctrico
Tema 4: Importancia de la electricidad
Subtema 1: La importancia de la electricidad
Tramo 1: Imagina!
Tramo 2: Recurdalo bien!
48
Actividades:
Experimento 1: Papelitos pegajosos.
Materiales:
- 1 electro-globo Pedazos de papel de colores
- Bitcora
Procedimiento:
1. Infla el electro- globo.
2. Esparce los papelitos de colores sobre tu mesa de trabajo.
3. Acerca el electro-globo que acabaste de inflar, y observa
qusucede.Qu tal si hacemos lo que hizo Tales de Mileto?
4. Frota el electro-globo varias veces en tu ropa o en tu cabello.
5. Ahora s, acerca el electro-globo a los papelitos de colores.
Experimento 2: Globos electrizados.

Materiales:
- 2 electro-globos Bitcora
Procedimiento:
1. Infla los dos electro-globos.
2. Acerca los globos a tu cabello. Qu sucede?
3. Frota cada globo varias veces en tu cabello o en la chompa
que tienes puesta. Antalo en tu bitcora, y haz un dibujo de
lo que observas.
4. Acerca los electro- globos a tu cabello, y pregntale a tu
compaero qu es lo que sucede con tu cabello.
Experimento 3: Puedes prender un foco?

Materiales:
- 2 pilas y su portapilas
- 3 cables con lagartos
- 1 Foco con su boquilla
- 1 Interruptor
- Bitcora
Procedimiento:
Recuerda que la batera es necesaria para que exista la fuerza
(voltaje) que mueve a los electrones. El foco ser el resistor de
nuestro primer circuito.
1. Conectaremos uno de los terminales del porta pilas con el
interruptor usando un cable con lagartos.
2. Con otro cable con lagartos conecta el interruptor al foco.
3. Usando otro cable con lagartos conectaremos el otro terminal
del foco hacia el otro terminar del portapilas.
49
3.1.5 Requerimientos no Funcionales
Rendimiento
El sistema ofrecer respuesta al usuario en tiempo real.

El tiempo de respuesta promedio de la aplicacin no debe superar los
5 segundos.
Seguridad
Requisito de conexin.
El sistema no contendr ninguna conexin abierta de acceso a
internet.
Fiabilidad
Que el sistema sea 90% fiable, es decir, que la aplicacin de cada 10

ejecuciones las 9 no tengan ningn error de compilacin.
Disponibilidad
En funcionamiento normal del sistema estar disponible el 100% del

tiempo, esto se obtiene instalando la aplicacin dentro del dispositivo
mvil como una aplicacin nativa.
Mantenibilidad
El sistema estar en constante mantenimiento, consecuentemente se

estarn actualizando o agregando nuevas funcionalidades.
Portabilidad
Compatibilidad con plataformas: En el sistema desarrollado ofrece

compatibilidad con otras plataformas Android desde la versin 3.0.
Que se pueda descargar de cualquier parte del mundo gratuitamente
por medio de Google Play.
Operabilidad
Podr ser operado por un nio de ms de 8 aos.
Interoperabilidad
Interoperabilidad entre tecnologa web y tecnologa nativa Android.
50
3.1.6 Restricciones
El dispositivo mvil en donde se ejecutarla aplicacin deber tener los

siguientes requisitos mnimos:
Procesador: ARM de 500Mhz

Memoria RAM: 512 MB.
Disco Duro: 30 MBdisponibles.
Las versiones de sistema operativo de los dispositivos mviles deben ser:
AndroidHoneycomb 3.0 o superior

3.1.7 Evolucin previsible del sistema
Se continuarel desarrollo de los siguientes mdulos, los cuales estn

compuestos por los mundos elctrico, magntico y digital.
Se implementara nuevas funcionalidades a los mdulos o mundos.
3.1.8 Validacin de requerimientos
Los requerimientos sern validados por el equipo de desarrollo del proyecto de

Pequeas y Pequeos Cientficos de la Universidad Politcnica Salesiana, el cual
deber cumplir con los requerimientos funcionales y no funcionales antes
expuestos, elaborando un certificadode la validacin que ser firmado por la Ing.
Elena Duran y el Ing. Diego Granja. Se adjunta en Anexo 1 el certificado de
validacin del proyecto.
3.2 Diseo de la aplicacin.
3.2.1 Casos de Uso
Caso de uso: Aprendizaje Multimedia del Mundo Verde y Elctrico
MUNDO VERDE, ELECTRICO
Seleccion del tema de Aprendizaje

Nios o Nias
51
Descripcin del caso de uso:
Paquete: Mundo Verde y Iteracin: 1 Minuta/s: 1.0

Elctrico
Nombre Caso de Uso: Aprendizaje Nro. Orden: R1

multimedia mundo verde y elctrico.
Actor Principal: Nias/os
Prioridad:X Esencial til Deseable
Comple jidad: Simple Mediano Complejo X Muy Complejo
Tipo de Caso de Uso:XConcreto Abstracto
Objetivo: Ensear el cuidado del medio ambiente desde los tabletscon Android
Precondiciones: Ingresar al sistema multimedia del mundo verde
Pos xito: El usuario podr aprender interactivamente el

condiciones: cuidado del medio ambiente y el elctrico desde los tablets.
Fracaso: Salida inesperada del sistema multimedia.
Curso Normal: Alte rnativas
Terminar cada uno de los temas de

1. Visualizacin multimedia de los
temas de aprendizaje del mundo aprendizaje multimedia.
verde y elctrico.
Asociaciones de Extensin: No aplica
Asociaciones de Inclusin: No aplica
Caso de Uso donde se incluye: No aplica
Caso de Uso donde se extiende: No aplica
Case de Uso en donde se Generalizacin: No aplica
52
3.2.2 Diagrama de Clases del Mundo Elctrico y Verde
Diagrama de clases del Mundo Elctrico.
Principal
+onCreate(savedInstanceState: Bundle)
La razn por la que el mundo elctrico solo consta de una clase, es que dentro del
mtodoonCreate(),su nica tarea es cargar un documento principaldesarrollado
enHTML5, CSS3 y JavaScript, el cual se encarga de todo el manejo de la
aplicacin.
Diagrama de clases del Mundo Ve rde.
En el mundo verde se desarrollo una aplicacin hbrida del Mundo Verde.Dentro

del marco el desarrollo nativo est compuesto por las siguientes clases:
ArbolCientifico
+px: int
+py: int
+pxc: int
+pyc: int
+x: int
+y: int
+h: int
+w: int
+xt: int
+xtc: int
-bitmap: android.graphics.Bitmap
-bitmapcara: android.graphics.Bitmap
-bitmapCientifico: android.graphics.Bitmap
-bitmapcaraCientifico: android.graphics.Bitmap
+lienzo: ArbolCientifico
+vt: java.util.ArrayList
+vtc: java.util.ArrayList
+translacion: boolean
+animacion: Animacion
+t: Tiempo
+cientifico: boolean
+ArbolCientifico(context: android.content.Context, px: int, py: int, pxc: int, pyc: int, w: int, h: int, t: Tiempo)
+addTiempoCuerpo(tinicial: int, tfinal: int, figCambio: int)
+addTiempoCara(tinicial: int, tfinal: int, figOrigen: int, figCambio: int)
+exeAnimacion()
+draw(canvas: android.graphics.Canvas)
53
NinoCientifica
+px: int
+py: int
+pxc: int
+pyc: int
+x: int
+y: int
+h: int
+w: int
+xt: int
+xtc: int
-bitmapCientifica: android.graphics.Bitmap
-bitmapcaraCientifica: android.graphics.Bitmap
+lienzo: NinoCientifica
+t: Tiempo
+cientifica: boolean
+NinoCientifica(context: android.content.Context, px: int, py: int, pxc: int, pyc: int, w: int, h: int, t: Tiempo)
+exeAnimacion()
Nina
+px: int
+py: int
+pxc: int
+pyc: int
+x: int
+y: int
+h: int
+w: int
+xt: int
+xtc: int
+lienzo: Nina
+t: Tiempo
+Nina(context: android.content.Context, px: int, py: int, pxc: int, pyc: int, w: int, h: int, t: Tiempo)
+exeAnimacion()
54
Fondo
-bitmapPantalla: android.graphics.Bitmap
+fondo: Fondo
+xt: int
+xtp: int
+h: int
+w: int
+px: int
+py: int
+x: int
+y: int
+pxp: int
+pyp: int
+t: Tiempo
+bajar: boolean
+agrandar: boolean
+Fondo(context: android.content.Context, px: int, py: int, pxp: int, pyp: int, w: int, h: int, t: Tiempo)
+exeAnimacion()
Web
+p: Principal
+web: android.webkit.WebView
+prbload: android.widget.ProgressBar
+w: int
+h: int
+px: int
+py: int
+Web(p: Principal, px: int, py: int, w: int, h: int)
+getButton(btn: android.widget.ImageButton, px: int, py: int, id: int): android.widget.ImageButton
Tiempo
+tiempo: int
+Tiempo()
+setTiempo(tiempo: int)
+getTiempo(): int
Animacion
#doInBackground(params: String): boolean

#onProgressUpdate(x: String)
55
Media
+media: android.media.MediaPlayer
+Media(context: android.content.Context, audio: int)
Menu
-btnProblema: android.widget.ImageButton
-btnRenovable: android.widget.ImageButton
-btnCuidando: android.widget.ImageButton
-btnActividad: android.widget.ImageButton
+fondo: Fondo
+media: Media
+t: Tiempo
+p: Principal
+Menu(p: Principal, rl: android.widget.RelativeLayout, fondo: Fondo, web: Web, arbolCientifico: ArbolCientifico, ninoCientifica: NinoCientifica, nina: Nina, t: Tiempo, media: Media)
+setEventos()
+hilo()
Menu1
-btn1: android.widget.ImageButton
-btnMundo: android.widget.ImageButton
+fondo: Fondo
-web: Web
-arbolCientifico: ArbolCientifico
+media: Media
+t: Tiempo
+p: Principal
+Menu1(p: Principal, rl: android.widget.RelativeLayout, fondo: Fondo, web: Web, arbolCientifico: ArbolCientifico, ninoCientifica: NinoCientifica, nina: Nina, t: Tiempo, media: Media)
+setEventos()
+hilo()
+setTiempos()
Menu2
+fondo: Fondo
-web: Web
+media: Media
+t: Tiempo
+p: Principal
+setEventos()
+hilo()
Menu3
+fondo: Fondo
-web: Web
+media: Media
+t: Tiempo
+p: Principal
+setEventos()
+hilo()
Menu4
+fondo: Fondo
-web: Web
+media: Media
+t: Tiempo
+p: Principal
+setEventos()
+hilo()
56
Problema
-btnA: android.widget.ImageButton
-btnB: android.widget.ImageButton
-btnAtras: android.widget.ImageButton
+fondo: Fondo
-web: Web
-nina: Nina
-ninoCientifica: NinoCientifica
+media: Media
+t: Tiempo
+p: Principal
+Problema(p: Principal, rl: android.widget.RelativeLayout, fondo: Fondo, web: Web, arbolCientifico: ArbolCientifico, ninoCientifica: NinoCientifica, nina: Nina, t: Tiempo, media: Media)
+setEventos()
+hilo()
+setTiempos()
Necesita
-btnC: android.widget.ImageButton
+fondo: Fondo
-web: Web
-nina: Nina
+media: Media
+t: Tiempo
+p: Principal
+Necesita(p: Principal, rl: android.widget.RelativeLayout, fondo: Fondo, web: Web, arbolCientifico: ArbolCientifico, ninoCientifica: NinoCientifica, nina: Nina, t: Tiempo, media: Media)
+setEventos()
+hilo()
+setTiempos()
Renovables
-btnD: android.widget.ImageButton
-btnE: android.widget.ImageButton
-btnF: android.widget.ImageButton
+fondo: Fondo
-web: Web
-nina: Nina
+media: Media
+t: Tiempo
+p: Principal
+actividad: Actividad
+Renovables(p: Principal, rl: android.widget.RelativeLayout, fondo: Fondo, web: Web, arbolCientifico: ArbolCientifico, ninoCientifica: NinoCientifica, nina: Nina, t: Tiempo, media: Media)
+setEventos()
+hilo()
+setTiempos()
+actividad()
Cuidando
+fondo: Fondo
-web: Web
-nina: Nina
+media: Media
+t: Tiempo
+p: Principal
+Cuidando(p: Principal, rl: android.widget.RelativeLayout, fondo: Fondo, web: Web, arbolCientifico: ArbolCientifico, ninoCientifica: NinoCientifica, nina: Nina, t: Tiempo, media: Media)
+setEventos()
+hilo()
+setTiempos()
57
Actividad
+fondo: Fondo
-web: Web
+media: Media
+t: Tiempo
+p: Principal
+tt: int
+renovable: boolean
+Actividad(p: Principal, rl: android.widget.RelativeLayout, fondo: Fondo, web: Web, arbolCientifico: ArbolCientifico, ninoCientifica: NinoCientifica, nina: Nina, t: Tiempo, media: Media, renovable: boolean)
+setInvisible()
+setVisible()
+setEventos()
+hilo()
+setTiempos()
Principal
+fondo: Fondo
-web: Web
-nina: Nina
+t: Tiempo
+estado: boolean
+media: Media
+rl: android.widget.RelativeLayout
+btn: android.widget.ImageButton = null
+escena: int
+menu: Menu
+menu1: Menu1
+menu2: Menu2
+menu3: Menu3
+menu4: Menu4
+problema: Problema
+necesita: Necesita
+renovables: Renovables
+cuidando: Cuidando
+actividad: Actividad
+onCreate(savedInstanceState: Bundle)
+resetPersonajes()
+setEscena(escena: int)
#onResume()
#onPause()
58
Las clases estn empaquetadas dentro de los siguientes paquetes:
Componentes:
Componentes
+tiempo
Fondo Tiempo
1 1
+web 1
1
+animacion
+fondo 1
1
Web Animacion
Personajes
Personajes
+animacion
ArbolCientifico Animacion
1 1
+animacion
Nina Animacion
1 1
+animacion
NinoCientifica Animacion
1 1
59
Mens
Menus
Menu1
+menu1 1 +menu2
Menu2
+menu 1
+menu 1 1 +menu +menu3
Menu Menu3
1 1
+menu
+menu4
1 Menu4
1
Actividades
Actividades +context +cuidando

1 1
Problema Cuidando
+context 1 1
+problema Principal
+context +necesita
1 1 Necesita
Media 1 1
+media +context
1 +context
1 +context +actividad
1 1 Actividad
Animacion
1 1
+renovables
+animacion
Renovables
Finalmente se presenta el Diagrama UML del Mundo Verde.
60
Actividades
componentes Problema 1 +context +cuidando
1
+fondo +tiempo Cuidando
Fondo Tiempo +problema +context Principal 1 1
1 1 1 1 +context
+necesita
Media
1 +web 1 +media +context 1 Necesita
+context 1
1
1 +fondo +animacion 1 +context
1 +actividad
+context
1 1
Web Animacion 1 1 Actividad
+renovables
Animacion +animacion
Renovables
personajes Menus
Menu1 +menu2 Menu2
+animacion
ArbolCientifico Animacion
+menu1 1 1
1 1
+menu
+animacion
Nina Animacion +menu 1 1 +menu +menu3
1 Menu3
1
Menu
1 1
+animacion +menu
NinoCientifica Animacion
1 +menu4
1 1 Menu4
1
61
3.2.3 Diagramas de Secuencia del Mundo Elctrico y Ve rde
Mundo Ve rde
Nio o Nia context : Principal animacion : Animacion menu : Menu problema : Problema media : Media arbol : ArbolCientifico animacion : Animacion
1 : onCreate()
2 : doInBackground()
3 : onProgresUpdate()
4 : setEscena()
5 : Problema()
6 : media() 7 : setTiempos() 8 : doInBackground()
9 : onProgresUpdate()
10 : invalidate()
11 : stop()
12 : onCancel()
13 : onPause()
62
Mundo Elctrico
Nio o Nia principal : Principal index.html
1 : onCreate()
2 : loadUrl()
3 : runningAnimation()
4 : onPause()
3.3 Anlisis de las herramientas de desarrollo.
Como se mencionen captulos anteriores se desarrollaruna aplicacin hbrida

para el mundo verde,la cual constardel desarrollo en lenguaje nativo para la
reproduccin del sonido, animacin de los personajes y del fondo de la
aplicacin, por lo que se emplearn los siguientes paquetes de Android:
3.3.1 Grficos en Android
En el sistema Android se incluye la clase Canvas que implementa numerosos

mtodos para dibujar grficos en pantalla. La manera ms sencilla de dibujar
grficos en Android es dibujarlos sobre unCanvas asociado a un View[28].
Cada objeto View de una aplicacin tiene asociado un objeto Canvas. Este objeto
es pasado como argumento en las llamadas onDraw que realiza el sistema
cuando es necesario presentar el View. Por lo tanto, para dibujar en el Canvas
basta con sobrescribir (Override) el mtodo onDraw [28].
Porejemplo:
class Lienzo extends View {
publicLienzol(Contextcontext) {
super(context);
}
@Override
public void onDraw(Canvas canvas) {
//Cdigo para graficar dentro del Lienzo
}
}
63
Para utilizar un recurso multimedia, basta con aadir el archivo al directorio
/res/drawable/ del proyecto, al hacer esto, el pluginde eclipse se encargar de
generar automticamente los identificadores java en la clase R. Con esto se puede
hacer referencia desde el cdigo o desde el diseo XML, se obtiene mediante un
identificador de recursos (id) que es el nombre del archivo sin la extensin del
tipo de archivo. Android soporta los formatos PNG (aconsejables), JPG
(aceptables) y GIF (desaconsejados) [29].
Para dibujar un mapa de bits, tenemos que utilizar la clase BitmapFactor, lo cual
enviamos como parmetro el identificador de referencia de la imagen dentro del
mtodo decodeResource() y nos retorna un objeto de tipo Bitmap.
Porejemplo:
Bitmapbitmap = BitmapFactory.decodeResource (getResources(),

R.drawable.imagen);
Para graficar el mapa de bits (bitmap), nos dirigimos al mtodo onDraw() de la

clase Lienzo, dentro del mtodo onDraw() recibimos como parmetro un objeto
de tipo Canvas, la cual tiene el mtodo drawBitmap() que recibe los siguientes
parmetros [30]:
Bitmapbitmap:Es el mapa de bits.

Rectsrc:Puede ser nulo, es el rectngulo del mapa de bits que se
recortardel origen.
Rectdst:Es el rectngulo que el mapa de bits que se mostraren el
View.
Paint paint: Puedesernulo.Elestilo que se usa para dibujar el mapa de
bits.
3.3.2 AsyncTask[27]
Todos los componentes de una aplicacin Android, tanto las actividades como
los servicios, se ejecutan en el mismo hilo, llamado hilo principal (mainthread).
Existen ocasiones en las que necesitamos que se realicen tareas en segundo
plano, para solventar esto normalmente se hace uso de los hilos (Thread), el
problema con los hilos es que la interfaz grfica (UI) de Android no permite
llamadas desde otros hilos que no sea el suyo, para resolver esto debemos crear
un AsyncTask(Tarea Asncrona).
La clase AsyncTask dispone de tres tipos de parmetros distintos, que

deberemosespecificar cundo declaremos nuestra clase.
Params: Datos que pasaremos al comenzar la tarea

Progress: Parmetros que necesitaremos para actualizar la Interfaz
Grafica.
64
Result: Dato que devolveremos una vez terminada la tarea.
En el siguiente cdigo se presenta la estructura bsica de un AsyncTask.
public class MiTarea extends AsyncTask<Params, Progress, Result> {

}
Para poder actualizar la interfaz grafica del View, dentro de cada ciclo del
AsyncTask nos valemos de los siguientes mtodos:
doInBackground(): Este mtodo ser el encargado de realizar la tarea

en segundo plano, por lo que se ejecuta en otro hilo, en este mtodo
no podremos modificar la interfaz grafica de la aplicacin. Para
modificar la interfaz graficausaremos los tres mtodos siguientes.
protected Result doInBackground(Params... p) {
}
onPreExecute(): Este mtodo se ejecutar antes de doInBackground,
por lo que podremos modificar la interfaz para indicar el comienzo de
la tarea.
protected void onPreExecute() {
}
onProgressUpdate(): Este mtodo permitir actualizar la interfaz
mientras se est ejecuta la tarea asncrona. Para ello, desde el mtodo
doInBackground() deberemos llamar al mtodo publishProgress() y
pasarle los parmetros.
protected void onProgressUpdate (Progress... values){
}
onPostExecute(): Se ejecutar cuando finalice nuestra tarea asncrona
o tras la finalizacin del mtodo doInBackground().
protected void onPostExecute (Result result){
}
Finalmente para actualizar el View dentro del mtodo onProgressUpdate()

debemos valernos del mtodo invalidate().
3.3.3 Reproduccin de sonido [31]
Para la reproduccin de sonido, existe la librera MediaPlayer dentro del paquete

de android.media, el cual recibe como parmetro el contexto de ejecucin y el
identificador del recurso a reproducir, como se pude apreciar en el siguiente
ejemplo:
MediaPlayermp = MediaPlayer.create(context, identificador_recurso);

mp.start();
65
Para la reproduccin del sonido se invoca al mtodo start() y para detener la
reproduccin al mtodo stop().
3.3.4 Desarrollo Html5 [23]
El desarrollo integral del mundo elctrico y el marco central del mundo verde se
utilizoHTML5, CSS3 yJavaScript, para posteriormente desplegarladentro de un
WebView en Android. Para facilitar el desarrollo web se encontr una
herramienta llamada SenchaAnimator, que nos permite realizar animacin y
poder exportarlos aHTML5, CSS3 yJavaScript,obteniendo una aplicacin
hbrida, a continuacin se proceder a detallar la herramienta SenchaAnimator.
SenchaAnimator es un software para Mac, Windows yGNU/Linux, que permite

trabajar en una lnea de tiempo y realizar animaciones, sin tener que escribir
cdigo directamente, pero en caso de necesitarlo da la facilidad de incluirlo.
Con SenchaAnimator, se puede animar texto e imgenes con transiciones suaves

y profesionales, botones de diseo con degradados y un control completo de la
lnea de tiempo.El producto desarrollado es compatible con todos los estndares
web y siguiendo conceptos de desarrollo muy parecidos a los de Flash.
Caractersticas:
El desarrollo de la animacin es limpio y legible

Los usuarios tienen un control completo sobre la salida HTML5.
Produce proyectos que son compatibles con cualquier red mvil, as
como ORMMA13 que es un estndar de la publicidad en redes mviles.
Obtener en tiempo real informacin visual y exportar el producto final
sin escribir una sola lnea de cdigo.
Crea proyectos que funcionan en todos los navegadores modernos que
soporten CSS3.
Optimiza el cdigopara los dispositivos mviles como Android 2.3+,
Apple iOS 4+, BlackBerry, etc.
Es perfecto para juegos simples y animaciones respaldas por
JavaScript.
A continuacin se proceder a detallar la instalacin y la forma de utilizar esta

herramienta para la creacin de animaciones, sin ms prembulo se detallara la
instalacin de SenchaAnimator en Windows 7 Ultimate.
13
ORMMA: Contiene un conjunto comn de normas para la publicacin de anuncios enriquecidos[24].
66
1. Nos descargamos la herramienta del sitio web de
Senchahttp://www.sencha.com/products/animator/download/, es necesario
registrarse para poder utilizar la herramienta por 30 das, al momento de
redactar, la versin de SenchaAnimator ltima es 1.3 y el costo es de $99
dlares.
I lustrac i n 37 S itio web d e descar ga de Se nc haAnima tor
2. Una vez descargado procedemos a la instalacin, damos doble clic sobre el

archivo descargado, seleccionamos el idioma de instalacin y damos clic en
siguiente.
I lustrac i n 38 I nsta lac i n de Se nc ha Animator

67
3. Escogemos el directorio de instalacin y damos clic en siguiente.
I lustrac i n 39 Directo r io de ins ta lac i n de Se nc ha Animator
4. Empezara el proceso de instalacin,una vez terminada la instalacin damos

clic en terminar.
I lustrac i n 40 I nsta lac i n te r minada de Se nc ha Animator
68
5. Procedemos a iniciarSenchaAnimator, como se menciono anteriormente
parapoder utilizar los 30 das de prueba debemos crear un usuario en la
pgina principal de SenchaAnimator, para el cual ingresamos un nombre de
usuario, contrasea, correo electrnico, y aceptamos las condiciones de
licencia.
6. Ingresamos el usuario y contrasea creada en el paso anterior para la poder

utilizar la aplicacin, se nos visualizael entorno de trabajo de
SenchaAnimator.
I lustrac i n 41 Pa nta lla pr inc ipa l de Se nc ha Animato r

3.3.4.1 Creacin de una animacin en SenchaAnimator
A continuacin se dar una introduccin de cmo utilizar esta herramienta para

crear y exportar la animacina HTML5, CSS3 y JavaScript.
1. Primero debemos crear un nuevo proyecto, para esto nos dirigimos al

MenFile > New Project, se nos visualizara la ventana deconfiguracindel
nuevo proyecto.Para esto escogemos la dimensin del proyecto y agregamos
soporte para Android 2.x, damos clic en Create.
I lustrac i n 42 Co nfigurac i n de l nue vo Pro yec to de And ro id

69
2. Guardamos el nuevo proyecto creado para eso nos dirigimos al Men File
>SaveProject,
3. Escogemos el directorio en donde se almacenarel proyecto y los archivos

adjuntos, le asignamos un nombre al proyecto y damos clic en Save, es
recomendable guardar el proyecto frecuentemente.
4. Para agregar nuevos elementos al proyecto tenemos en la parte superior

izquierda un panel en donde podemos escoger un cuadrado, circunferencia,
video, imagen, texto, audio e incrustar cdigo HTML.
I lustrac i n 43 Pa ne l de ob jetos d e Se nc haAnima tor
5. En la parte superior derecha tenemos un panel en donde podemos modificar

la propiedades de cada uno de los objetos, entre las cuales tenemos
dimensiones, transformaciones, fondos, bordes, traslaciones, etc.
I lustrac i n 44 Pa ne l de pro p iedade s de Se nc ha Anima tor
70
6. En la parte superior tenemos un panel de tiempo, donde podemos agregar
nuevos frames, lo que nos permite realizar las transacciones, animaciones o
modificaciones de objetos utilizando los frames segn la lnea de tiempo.
I lustrac i n 45 Pa ne l lnea de tie mpo de Se nc ha Animator
7. En la parte central tenemos nuestro espacio de trabajo. Para agregar un nuevo

objeto solo debemos arrastrar del panel de objetos al espacio de trabajo,
podemos agregar varios objetos en el mismo espacio y realizar las
modificaciones creando o modificando los frames, teniendo una visualizacin
previa del proyecto.
I
I lustrac i n 46 Esp ac io de traba jo de Se nc ha Animator
8. En la parte inferior tenemos cada una de las escenas creadas en nuestro

proyecto.Una escena es un parte del proyecto, por consecuente un proyecto
est compuesto de varias escenas.
I lustrac i n 47 Pa ne l de es ce nas de Se nc ha Animato r
9. Por ltimo, tenemos el panel de control de la lnea de tiempo, en el cual

nosotros podemos controlar el tiempo yobtener una pre- visualizacin del
proyecto.
I lustrac i n 48 Pa ne l de co ntro l de tie mpo de Se nc ha Animato r
71
CAPTULO 4
72
4 IMPLEMENTACIN, DOCUMENTACIN Y PRUEBAS
4.1 Implementacin y seleccin de los mdulos de aprendizaje.
Se seleccionaronel mundo elctrico y el mundo verde para el desarrollo de la

aplicacin para dispositivos mviles, el mundo elctrico se desarrollpor
completo utilizando tecnologa web, es decir, solo se emplepara el desarrollo
HTML5, CSS3 y JavaScript, el resultado no fue el esperado por el equipo de
Pequeas y Pequeos Cientficos.El principal inconvenientees que el desarrollo
multimedia de movimientosno soporta cambios de imgenes de formafluida
como se esperaba que tuvieran los personajes de la aplicacin, aqu es donde
podemos apreciar las transiciones o cambios de imgenes cuando trabajamos en
tiempos de milisegundos. Esto se genera porque la animacin no se ejecuta
directamente en la mquina virtual de AndroidDalvik, produciendo un mayor
consumo de recursos al tener que primero renderizarHTML5 y CSS3 e
interpretar el cdigo JavaScript por cada ejecucin, por consiguiente es ms
costoso que ejecutar una aplicacin nativa que ya estpreviamente compilada
dentro de los archivos .dex. En las siguientes ilustracionescapturadas cada
200msse puede apreciar la transicin del personajeen el mundo elctrico durante
un lapso de 600ms, obteniendo como resultado la evidente falta de fluidez en sus
movimientos.
I lustrac i n 49 Entrada de la Do ctora At mic a e n e l M undo Elctr ico e n

200ms.

400ms.
73
600ms.
Sin embargo, los dispositivos mviles tanto en hardware como software se estn
renovando continuamente, es decir, los nuevos dispositivos mviles ya cuentan
con mayores recursos de hardware y nuevas caractersticas implementadas en
software. Entre estas nuevas caractersticas se puede resaltar que las nuevas
versiones de Android y IOS ya no integran soporte para flash [33], consecuente
estn optando por HTML5 para la creacin de animaciones y
multimedia,resultando que esta brecha de compatibilidad entreHTML5 y el
consumo de recursos se est dejando al margen. Consecuentemente,
HTML5sigue en proceso de desarrollo, implementndose nuevas funciones y
caractersticas. Por consiguiente,no se puede dejar de lado la utilizacin de
HTML5para la creacin de aplicaciones mviles.
Con lo antes expuesto,en el desarrollo del mundo verde se optpor la

implementacin de aplicaciones hbridas potenciando as las dos tecnologas. En
consecuencia, se diferenciarondos espacios de trabajo, en el primero que
corresponde alpanel central, se utilizcdigo HTML5, CSS3 y JavaScript para la
visualizacin del tema y el segundo espacio de trabajo que es la animacin de los
personajes, fondo, mens y reproduccin de sonido se emple tecnologa nativa
Android. El resultado fue satisfactoriamente aprobado por el equipo de Pequeas
y Pequeos Cientficos. A continuacin se pueden apreciar ilustraciones que se
tomaron cada 200ms por 600ms obteniendo como resultado:
I lustrac i n 52 Entrada de l rbo l Ca lipto e n e l M undo Verde e n 200 ms
74
Cabe recalcar que el desarrollo del mundo verde fue completamente

parametrizado, por lo que en un futuro desarrollo del mundo elctrico, magntico
y digital se pueden reutilizar las clases previamente desarrolladas para minimizar,
agilizar y optimizar el tiempo de desarrollo.
4.2 Desarrollo de pruebas con los dispositivos mviles en el laboratorio
Las pruebas realizadas en el laboratorio cumplieron con los requerimientos

funcionales y no funcionales antes expuestos, entre estas podemos mencionar que
se realizpruebas con los siguientestablets:
Tablet Coby
Memoria: 8Gb
Pantalla: LCD 10.1 pulgadas.
Procesador: 1Ghz (Corex A8)
Memoria RAM: 1GB.
Sistema Operativo: Android 4.0.2 (IceCreamSandwich)
75
I lustrac i n 55 Dispos itivo M vil d e Pr ueba Cob y.
Tablet SamsungGalaxyTab 2.
Memoria: 4 Gb.
Procesador: Dual-Core 1 Ghz
Memoria RAM: 1 GB.
Sistema Operativo: Android 4.0.2 (Ice CreamSandwich)
I lustrac i n 56 Dispos itivo M vil d e Pr ueba Sa ms ung Ga la xyTab 2.
Tablet - Asus
Memoria: 16 GB.
Procesador: Dual-Core 2.1 Ghz
Memoria RAM: 1GB.
Sistema Operativo: Android 3.2 (HoneyComb).
76
I lustrac i n 57 Dispos itivo M vil d e Pr ueba As us TF101
Cabe mencionar que los tablets en donde se realizaronlas pruebas de laboratorio

fueron proporcionadospor la Universidad Politcnica Salesiana.
4.3 Desarrollo de pruebas con nios y nias.
El desarrollo de pruebas con los nios y nias fueron realizadas con los
estudiantes de la Escuela Carlos Crespi y Francisca Dvila, obteniendo como
resultado una satisfactoria acogida por los nios y nias, en donde mostraron un
mayor inters en la presentacin del curso Pequeas y Pequeos Cientficos.Para
esto se realizuna encuesta a 18 nios y nias. Esta encuesta se ha adjuntado en
el Anexo 2.
A partir de la encuesta realizada se obtuvo las siguientes grficas estadsticas.
80
60
40
20
0
Excelente Bueno Regular Malo
I lustrac i n 58 Res ultado de la p re gunta C mo fue la e xper ie nc ia de

utilizac i n de los tablets pa ra e l ap re nd iza je multimed ia de l mundo
verd e?
77
Si
No
I lustrac i n 59 Resp uesta a la pre gunta. Aume nt e l grado de inter s

de apre nd iza je utiliza ndo lo s tablets?
100
80
60
40
20
0
Dificil Normal Facil
I lustrac i n 60 Resp uesta a la pre gunta. La utilizac i n de la

ap licac i n de l mundo verde e n los tablets fue?
Como se puede apreciar en las estadsticas, aument notablemente el inters de

aprendizaje del mundo verde utilizando los tablets, ya que el diseo empleado
en la aplicacin esta desarrollado para nios y nias de 8 aos en adelante.
Finalmente, presentamos algunas ilustraciones en la que los nios y nias estn

utilizando las tablets con el aplicativo mvil del mundo verde.
78
I lustrac i n 61 P r uebas co n N ia s de la Esc ue la "Fra nc isca D vila ".
I lustrac i n 62 P r uebas co n las N ias e I ns tr ucto res.
79
I lustrac i n 63 P r ueba co n un es tud ia nte de la Esc ue la "Car los Cresp i"
con latablet COBY.
I lustrac i n 64 P r uebas co n N io s de la Esc ue la "Ca r los Cre sp i".
80
I lustrac i n 65 P r ueba co n un es tud ia nte de la Esc ue la Ca r los Cre sp i
con la tablet Sa ms ung Ga la xyTab 2.
4.4 Documentacin.
Se proceder a detallar cules son los pasos necesarios para que un usuario
pueda descargarse la aplicacin desde la tienda de Google Play, instalarlo en el
dispositivo y por ltimo, se indicar el modo de utilizar la aplicacin del Mundo
Verde, sin ms prembulo se proceder a detallar el manual de Usuario.
4.4.1 Descarga e Instalacin de la aplicacin.

Primeramente debemos descargar la aplicacin desde la tienda de
Google Play, para ello nos dirigimos al men de aplicaciones e
ingresamos a nuestro gestor de descargas, en este caso utilizaremos el
Play Store.
I lustrac i n 66 Ges tor de de scar gas d e ap licac io ne sPlay Store [ 35] .
81
En el gestor de descargas introducimos el nombre de la
aplicacin,ingresamos el texto PequeCiencia. Se desplegarn todas
las aplicaciones que coincidan con la bsqueda, en este caso
escogeremos la primera coincidencia. Seleccionamos la aplicacin
mundo verde como se muestra en la ilustracin 67.
I lustrac i n 67 Bsq ueda de la ap lica c i n e n P la y Store
Posteriormente se nos presenta una descripcin de la aplicacin

Mundo Verde, como se muestra en la ilustracin 68, presionamos la
opcin Instalar.
I lustrac i n 68 Desc r ipc i n de la Ap licac i n de l M undo Ve rde
82
Procedemos a Aceptar y Descargar la aplicacin, cabe recalcar que no
se necesita ningn tipo de permisos adicionales.
I lustrac i n 69 Acep tar y Desca r gar la ap licac i n de l M undo Verde

Una vez completada la descarga de la aplicacin, se proceder a
instalar automticamente en el dispositivo, finalmente presionamos la
opcin Abrir.
I lustrac i n 70 I nsta lac i n co mp leta de la ap licac i n M undo Verde
83
4.4.2 Manual de Usuario
Una vez instalada, nos dirigimos al men de aplicaciones y
presionamos en el icono de la aplicacin delMundo Verde, el icono
se muestra en la ilustracin 71.
I lustrac i n 71 Ico no de la Ap licac i n de l M undo Ve rde.

Se nos presenta el men principal, el cual est compuesto por cuatro
temas como se muestra en la ilustracin 72, presionamos el tema de
aprendizaje a tratar:
I lustrac i n 72 Me n Pr inc ipa l de l M undo Verd e

Se nos presenta los subtemas, si deseamos regresar al men principal
presionamos la opcin mundo verde, caso contrario presionamos el
subtema a estudiar.
I lustrac i n 73 Me n de s ub te ma s de l M undo Verde.
84
Finalmente, se nos presentan los literales del subtema seleccionado en
el paso anterior, para regresar al men de subtemas presionamos en la
opcin atrs, caso contrario presionamos ordenadamente cada uno de
los literales.
I lustrac i n 74 Tra mos de l M undo Verde
4.5 Publicacin de la aplicacin en la tienda de Google.
Luego del desarrollo de la aplicacin del Mundo Verde, el siguiente paso es la

publicacin en la tienda de Google Play.Todo este proceso se realizaringresando
informacin de la Universidad Politcnica Salesiana, con el objetivo de que este
registro sirva para que futuros proyectos desarrollados dentro de la universidad se
publiquen. A continuacin se detallan los pasos para la creacin de una cuenta
desarrollador en Google:
1. Debemos tener creada una cuenta en Gmail, por lo que procederemos a

crearla, para eso nos dirigimos a la siguiente direccin web
https://accounts.google.com/SignUp?service=mail&continue=https%3A%2F
%2Fmail.google.com%2Fmail%2F&ltmpl=default y seguimos estos pasos:
2. Ingresamos los datos personales para la creacin de la cuenta, como se puede

apreciar en la ilustracin 75.
85
I lustrac i n 75 Cr eac i n de una c ue nta e n Gma il.
3. Aceptamos las condiciones de servicio y las polticas de privacidad de

Google y procedemos a dar clic en siguiente paso.
I lustrac i n 76 Co nd ic io ne s de Ser vic ios y Po lticas de Se gur idad de

Goo gle.
4. Se nos presenta una pantalla de bienvenida a Gmail, damos clic en Ir a

Gmail.
86
I lustrac i n 77 Pa nta lla de Bie nve nida a Gma il.
5. Finalmente se visualizarla bandeja de entrada de la cuenta creada.
Posteriormente creamos un perfil de desarrollador en Google Play, para eso nos

dirigimos a la siguiente direccin web
https://play.google.com/apps/publish/signup y seguimos los siguientes pasos:
1. Creamos un perfil de desarrollador, para ello ingresamos los datos bsicos

del desarrollador, como se muestra en la ilustracin 78, damos clic en Seguir.
I lustrac i n 78 Cr eac i n de l per fil d esar ro llador e n Google Pla y.
87
2. Leemos y aceptamos el acuerdo de distribucin para desarrolladores de
Google, damos clic en Acepto y Continuar.
I lustrac i n 79 Ac ue rdo de d is tr ib uc i n pa ra desa rro lladore s
3. Por ltimo, debemos pagar la cuota de registro, para ello especificamos

nuestro nombre, direccin de facturacin y la tarjeta de crdito para el pago
de 25 dlares, como se muestra en la ilustracin 80.
I lustrac i n 80 Pa go d e c uota de re gistro.
88
Luego de crear la cuenta desarrollador se proceder a publicar la aplicacin
enGoogle Play, esta aplicacinse podr descargar gratuitamente desde cualquier
parte del mundo, para esto nos dirigimos a la siguiente direccin web
https://play.google.com/apps/publish. Acontinuacinse detallan los pasos:
1. Se nos presentar el panel de administracin de aplicaciones, el cual nos

informa de todas las aplicaciones publicadas. Para subir una nueva
aplicacin damos clic en Aadir nueva aplicacin.
I lustrac i n 81 Pa ne l de ad min istrac i n de p ub lic ac io nes e n Andro id.
2. Se nos presenta una ventana, en donde seleccionamos el idioma de la

publicacin, nombre de la aplicacin y damos clic en subir APK.
I lustrac i n 82 Ve nta na para s ub ir e l pro yec to de Andro id.
3. Escogemos la aplicacin empaquetada que se subir al servidor, con

extensin .apk.
I lustrac i n 83 Se lecc i n de l .apk

89
4. La aplicacin se empezara subir al servidor de Google, el tiempo de espera
depende del tamao de la aplicacin.
I lustrac i n 84 C uad ro de pro gre so de s ub ir la ap licac i n a l ser vidor.
5. Posteriormente se nos presenta la ventana con la informacin de la aplicacin

subida, como la versin, dispositivos admitidos y dispositivos excluidos.
I lustrac i n 85 I nfor mac i n de la ap lica c i n s ub ida a l ser vidor.
6. A continuacin debemos especificar la informacin del proyecto, por lo que

debemos dar clic en Entrada en Play Store, en donde podemos especificar
con mayor detalle las caractersticas de la aplicacin, con los siguientes
campos:
INFORMACIN DEL PRODUCTO

a. Ttulo.
b. Descripcin.
c. Texto Promocional (opcional).
d. Cambios Recientes (opcional).
RECURSOS GRFICOS
a. Capturas de pantalla.
b. Icono de la aplicacin.
90
c. Grfico de las Caractersticas (opcional).
d. Grfico Promocional (opcional).
e. Video Promocional (opcional).
CATEGORIZACIN
a. Tipo de la aplicacin.
b. Categora.
c. Clasificacin de contenido.
DETALLES DEL CONTACTO.
a. Sitio web.
b. Correo Electrnico.
c. Telfono (opcional).
En las siguientes ilustraciones se puede apreciar la configuracin antes

mencionada para el proyecto del Mundo Verde de Pequeas y Pequeos
Cientficos.
I lustrac i n 86 Esp ec ificac io nes de la I nfo r mac i n de l M undo Ve rde.
91
I lustrac i n 87 Esp ec ificac io nes Gra ficas de l M undo Verde.
I lustrac i n 88 Ca te gor izac i n y de ta lle de co ntacto de l M undo Verde.
92
Para mayor detalle de como especificar el producto dirigirse al sitio web de
Soporte de Google (https://support.google.com/googleplay/android-
developer/support/bin/answer.py?hl=es&answer=1078870), posteriormente
damos clic en Guardar.
7. Finalmente procedemos a especificar el precio de la aplicacin y en qu

pases se distribuir. Esta aplicacin ser distribuida en todo el mundo de
forma gratuita por lo que no necesitamos ninguna configuracin adicional y
damos clic en Guardar.
I lustrac i n 89 Esp ec ificac i n de l p rec io y d istr ib uc i n de l M undo

Verde.
8. Al concluir visualizaremos la aplicacin configurada y publicada en la tienda

de GooglePlay.
93
I lustrac i n 90 P rese ntac i n de la ap licac i n e n Google Play de l
Mundo Verde.
Una caracterstica adicional que nos brinda Google Playes que podemos
visualizar cuadros estadsticos de descargas de la aplicacin.
94
5 CONCLUSIONES
Se ha obtenido un gran conocimiento sobre desarrollo en dispositivos mviles
basados en Android, as como su arquitectura, caractersticas, componentes y
funcionamiento. Cabe resaltar que el desarrollo en Android es muy parecido al
desarrollo en lenguaje Java, ya que incluye algunos APIs de este lenguaje, por
ello el aprendizaje y el desarrollo se realiz de forma ptima.
Dentro del desarrollo del presente proyecto se investigaron varios procesos de

conversin de archivos deformato en flash (SWF) a imgenes animadas (GIF), el
principal problema es que el archivo generado era 7 veces mayor que el original.
De igual forma, se prob realizar conversiones a videos y el resultado fue similar,
teniendo archivos 5 veces mayores que el original. Por ltimo, se realizaron
conversiones a formato HTML5, siendo la que mejor resultados dio, para ello se
utiliz herramientas de conversin como Swiffy de Google que aun esta en
versin de prueba y retorna buenos resultados en tamao de espacio en disco,
pero con informacin encriptada, por lo que no se puede modificar. En
consecuencia, ninguna de las tcnicas antes expuestas cumpla con los
requerimientos mnimos para la ejecucin de la aplicacin en los dispositivos
mviles, ya que los mismos tienen menor capacidad en hardware.
Una de las principales razones por la que se desarroll la aplicacin en Android,

es su alto nivel de utilizacin en plataformas celulares y tablets, en consecuencia
se permite que se pueda distribuir, modificar y estudiar sin limitaciones, ya que
es un sistema completamente libre [14] y a la vez el desarrollador puede decidir
sobre su aplicacin, si desea publicarla comercialmente o gratuitamente y los
lugares en donde se distribuir.
Se realiz una completa investigacin de desarrollo para dispositivos mviles,

encontrndose que se pueden implementaraplicaciones utilizando diferentes
tecnologas web como HTML5, CSS3 y JavaScript y con ayuda de frameworks
como JQuery Mobile, Sencha,PhoneGap, etc. Estas tecnologas se tomaron como
primer punto de partida, con el objetivo de facilitar el desarrollo de aplicaciones
y hacerlas multiplataforma, por ello se decidi desarrollar el mdulo del mundo
elctrico en esta tecnologa, pero durante su desarrollo se produjeron grandes
limitaciones, especficamente al momento de representar la accin de
movimiento de los personajes, lo cual no cumpli con las expectativas del equipo
de Pequeas y Pequeos Cientficos. En virtud de ello, esta tecnologa aun sigue
en un proceso de desarrollo, por lo que los dispositivos actuales no contienen las
caractersticas necesarias para una perfecta ejecucin de las mismas ni en
hardware ni en software, pero esta brecha se est reduciendo por motivos de
avance y actualizaciones tecnolgicas.
Por lo antes expuesto, se incursion en otra lnea de desarrollo, optando por un

desarrollo hbrido para el mdulo del Mundo Verde, que combinaba cdigo
Android con HTML5. Durante este proceso se pudo observar que la
95
libreraOpen-GL solo puede trabajar con imgenes con un tamao mximo de
2048 x 2048 pixeles, por lo que en algunos casos era necesario redimensionar las
mismas. Dentro de este proceso de desarrollo se implementaron clases
parametrizables, para que en un futuro se pueda agregar nuevas funcionalidades
o implementar los mundos elctrico, magntico y digital.
En el desarrollo se presentaron varios problemas entre los que podemos

mencionar el manejo de tiempos, por lo que se emplearon hilos asncronos
(AsyncTask), el problema al utilizar los AsyncTask es que se puede utilizar un
mximo de cinco AsyncTask ejecutadas en paralelo por aplicacin y con un
Sistema Operativo Android 3.0 o superior. Por ello, se modelaron hilos
asncronos para manejar varios procesos, como por ejemplo, se utiliz un solo
hilo asncrono para el manejo de los personajes del rbol Calipto y el cientfico
Dr. Voltio.
Con el Mundo Verde se realizaron pruebas en tablets de 10.6 ,10 y 7 pulgadas

con versiones de Android 4.0.2 y 3.0.2 respectivamente, los cuales fueron
facilitados por la Universidad Politcnica Salesiana, en donde se validaron los
diferentes requerimientos funcionales y no funcionales conjuntamente con el
equipo de Pequeas y Pequeos Cientficos de la Universidad Politcnica
Salesiana. En cuanto al proceso de pruebas, estas se realizaron con nios y nias
de las Escuelas Carlos Crespi y Francisca Dvila, en donde se observ el
gran entusiasmo y empeo en el aprendizaje de la ciencia y la tecnologa del
proyecto desarrollado.
Por ltimo se detallaron los pasos para crear una cuenta de desarrollador en
Google Play, con el objetivo de publicar la aplicacin del mundo verde y futuras
aplicaciones que sean desarrolladas dentro de la Universidad Politcnica
Salesiana y as promover el desarrollo de aplicaciones mviles.
96
6 RECOMENDACIONES
Seguir con el proceso de investigacin de desarrollo para dispositivos mviles
utilizando tecnologas web, ya que empresas como Google y Apple estn
apostando por HTML5, CSS3 y JavaScript para la realizacin multimedia o de
animaciones, entre estos procesos se puede destacar el uso de frameworks como
JQuery Mobile, Sencha, Titanium, Phonegap, etc., que facilitan notablemente el
desarrollo de aplicaciones mviles, agregando una ventaja ms que es la de
contar con aplicaciones multiplataforma.
Seguir desarrollando aplicaciones mviles dentro del CIIDI (Centro de

Investigacin, Desarrollo e Innovacin en Ingenieras de la UPS) para diferentes
campos aplicativos como la educacin, medicina, etc. y publicarlos dentro de la
cuenta de la Universidad Politcnica Salesiana, fomentando la innovacin y
desarrollo de aplicaciones mviles.
7 TRABAJOS FUTUROS
Seguir con el proceso de desarrollo con los mundos elctrico, magntico y
digital, reutilizando cdigo ya desarrollado dentro de la tesis, ya que como se
mencion anteriormente, se desarroll la aplicacin de forma parametrizada, para
que se pueda reutilizar el cdigo y as facilitar el desarrollo e implementacin en
plataformas como IOS y Windows 8.
97
8 BIBLIOGRAFA
[1] Jimmy Rosario, La Tecnologa de la Informacin y la Comunicacin

(TIC). Su uso como Herramienta para el Fortalecimiento y el Desarrollo de la
Educacin Virtual, fecha de recuperacin 20 de agosto de 2012,
http://www.cibersociedad.net/archivo/articulo.php?art=218
[2] TouchTerms.com, fecha de recuperacin 20 de agosto de 2012,
Touchscreen: http://www.techterms.com/definition/touchscreen
[3] Ing. Elena Durn, Ing. Diego Granja, Informe de Resultados de Proyecto
de Vinculacin con la Sociedad Pequeas y Pequeos Cientficos
presentado dentro de la Universidad Politcnica Salesiana, fecha de
recuperacin 06 de septiembre de 2012
[4] Jos Ramn Gmez, Las Tic en la Educacin, fecha de recuperacin 17 de
noviembre de 2012, http://boj.pntic.mec.es/jgomez46/ticedu.htm
[5] LucianArmasu, IDC AndroidJump 68.1% global market share, iOS slips to
16.9%, fecha de recuperacin 17 de noviembre de 2012,
http://www.androidauthority.com/idc-android-jumps-to-68-1-global- market-
share- ios-slips-16-9-106446/
[6] Miguel AngelAlvarez, HTML5 novedades ms significativas, fecha de
recuperacin 07 de agosto de 2012,
http://www.desarrolloweb.com/articulos/que-es-html5.html
[7]Rodrigo Meja Armijo y Diego Escares Venegas, Desarrollo HTML5 para
iPad y tabletas, fecha de recuperacin 07 de agosto del 2012,
http://habitatweb.mx/desarrollo- html5-para- ipad-y-tabletas
[8] Hctor Hiram Guedea Noriega, Introduccin a HTML5, fecha de
recuperacin 07 de agosto de 2012 http://hectorguedea.com/introduccion-a-
html5
[9] Gran Angular Blog, Conoce (y prueba) las caractersticas de HTML5,
fecha de recuperacin: 07 de agosto 2012, http://www.gran-
angular.net/conoce-prueba-caracteristicas- html5-presentacion-practica-
tecnicas-css3/2010/04/30/
[10] Sergio Lujn Mora, Talleres sobre HTML5, WCAG 2.0 y web mvil del
W3C, fecha de recuperacin 07 de agosto de 2012
http://accesibilidadenlaweb.blogspot.com/2012/05/talleres-sobre- html5-wcag-
20-y-web.html
[11] W3Schools, HTML5 Introduction, fecha de recuperacin 07 de agosto de
2012 http://www.w3schools.com/html5/html5_intro.asp
[12] jQueryFoundation, BuildingPhoneGapappswithjQuery Mobile, fecha
de recuperacin 07 de agosto de2012
http://jquerymobile.com/test/docs/pages/phonegap.html
[13] Adobe Systems Inc. PhoneGap, fecha de recuperacin 07 de agosto de
2012 http://phonegap.com/
98
[14] Jaime Aranaz Tudela, UNIVERSIDAD CARLOS III DE MADRID
ESCUELA POLITCNICA SUPERIOR, DESARROLLO DE
APLICACIONES PARA DISPOSITIVOS MVILES SOBRE LA
PLATAFORMA ANDROID DE GOOGLE, Enero de 2009, fecha de
recuperacin 23 de agosto de 2012, http://e-
archivo.uc3m.es:8080/bitstream/10016/6506/1/PFC_Jaime_Aranaz_Tudela_2
010116132629.pdf
[15] Alberto Biches, Desarrollo de aplicaciones mviles multiplataforma,
fecha de recuperacin 23 de agosto del 2012
http://albertovilches.com/aplicaciones- moviles-web- vs-nativas- vs-
multiplataforma
[16] Dosisgeek, Blog Geek, Razones para usar Android,
http://www.tudosisgeek.com/10-razones-para-usar-android-ventajas/
[17] HamzaWaqas, Phonegap vs. NativeComparisonbasedoverdepth, fecha
de recuperacin 23 de agosto del 2012,
http://informationastronaut.blogspot.com/2012/05/phonegap-vs- native-
comparison-based.html
[18] Guillermo Latorre, Los 4 mejores editores de animaciones en HTML5 y
CSS3, fecha de recuperacin 17 de noviembre de 2012,
http://hachemuda.com/2012/02/los-4-mejores-editores-de-animaciones-en-
html5- y-css3/
[19] ALEGSA, DICCIONARIO DE INFORMTICA, fecha de recuperacin
17 de noviembre de 2012, http://www.alegsa.com.ar/Dic/middleware.php
[20]Luis Rey Lara, fecha de recuperacin 17 de noviembre de 2012,
http://luisreylara.com/2011/11/05/activity-en-android/
[21] AndroidDevelopers, PlatformVersions, fecha de recuperacin 17 de
noviembre del 2012
http://developer.android.com/about/dashboards/index.html
[22] CeluActivo, Introduccin a la programacin en Android, fecha de
recuperacin 17 de noviembre de 2012,
http://www.celuactivo.com/2012/08/27/introduccion-a-la-programacion-en-
android/
[23]Sencha, SenchaAnimator, fecha de recuperacin 06 de septiembre de
2012, http://www.sencha.com/products/animator
[24] Orrma.org, Open Rich Media Mobile Advertising, fecha de recuperacin
06 de septiembre de 2012, http://code.google.com/p/ormma/
[25] Nekotek,Stakeholders, fecha de recuperacin 06 de septiembre de 2012,
http://www.nekotek.es/blog/2010/12/stakeholders/.
[26] Ing. Natalia Valeria Andriano, Comparacin del Proceso de Elicitacin
de Requerimientos en el desarrollo de Software a Medida y Empaquetado.
Propuesta de mtricas para la elicitacin Universidad Blas Pascal
Universidad Nacional de la Plata, fecha de recuperacin 06 de septiembre de
2012
http://postgrado.info.unlp.edu.ar/Carreras/Magisters/Ingenieria_de_Software/
Tesis/Andriano_Natalia.pdf,
99
[27]Miguel Angel, Androides y Pinginos, fecha de recuperacin 06 de
septiembre de 2012, http://miguelangellv.wordpress.com/2011/01/31/creando-
tareas-asincronas-en-android-con-asynctask/
[28] Blog OpenAlfa, Cmo dibujar grficos en Android, fecha de
recuperacin 06 de septiembre, http://blog.openalfa.com/como-dibujar-
graficos-en-android/
[29] Drawable Android. Programacin Aplicaciones para mviles.
Universidad Politcnica de Valencia,Drawable fecha de recuperacin 06 de
septiembre de 2012, http://www.androidcurso.com/index.php/recursos-
didacticos/tutoriales-android/35-unidad-4-graficos-en-android/136-drawable
[30] AndroidDevelopers, BitmapFactory, fecha de recuperacin 17 de
noviembre de 2012,
http://developer.android.com/reference/android/graphics/BitmapFactory.html
[31]AndroidDevelopers, Media Playback, fecha de recuperacin 17 de
noviembre de 2012,
http://developer.android.com/guide/topics/media/mediaplayer.html
[32] ALEGSA, DICCIONARIO DE INFORMTICA, fecha de recuperacin
17 de noviembre de 2012,
http://www.alegsa.com.ar/Dic/motor%20de%20renderizado%20web.php
[33]Alkar, XatakaAndroid, fecha de recuperacin17 de noviembre de 2012,
http://www.xatakandroid.com/aplicaciones-android/adios- flash-para-android-
gracias-por- intentarlo.
[34] Abaestudio, HTML5, el camino que sigue el desarrollo web, fecha de
recuperacin 17 de noviembre de 2012,http://www.abaestudio.com/html5-el-
camino-que-sigue-el-desarrollo-web
[35] ABOUT XDA DEVELOPERS, Google Play Store fecha de recuperacin
03 de noviembre de 2012,http://www.xda-developers.com/android/google-
play-store-pins-not-quite-secure/
[36] Gobierno de Espaa, Formacin en Red, fecha de recuperacin: 07 de
agosto de 2012,
http://formacionprofesorado.educacion.es/index.php/es/materiales/45- html5-
en- la-educacion?start=2
100
ANEXOS
101
9 ANEXOS
9.1 ANEXO 1: CERTIFICADO DE VALIDACIN DE
REQUERIMIENTOS.
102
103
9.2 ANEXO 2: ENCUESTA PRACTICADA A LOS NIOS Y NIAS
DISEO E IMPLEMENTACIN DE UNA APLICACIN PARA

DISPOSITIVOS ANDROID EN EL MARCO DEL PROYECTO
PEQUEAS Y PEQUEOS CIENTFICOS DE LA
UNIVERSIDAD POLITCNICA SALESIANA
ENCUESTA DE UTILIZACION DE TABLETS PARA EL

APRENDIZAJE DEL MUNDO VERDE
1. Cmo fue la experiencia de utilizacin de los tablets para el aprendizaje

multime dia del mundo verde?
a. Excelente
b. Bueno
c. Regular
d. Malo
2. Aume nt el grado de inte rs de aprendizaje utilizando los tablets?
a. Si
b. No
3. La utilizacin de la aplicacin del mundo verde en los tabletsfue?
a. Difcil
b. Normal
c. Fcil
104

Ups CT002537 PDF

Cargado por

Información del documento

Título original

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Ups CT002537 PDF

Cargado por

Copyright:

Formatos disponibles

UNIVERSIDAD POLITCNICA

Tesis previa a la obtencin del

Cuenca, Diciembre 2012

Haber dirigido y revisado prolijamente la tesis titulada Diseo e Implementacin

Cuenca, Dicie mbre de 2012

Ing. Vladimir Robles Bykbaev.

Yo Diego Fernando Quisi Peralta portador de la cedula de ciudadana 010461646-1,

Diego Fernando Quisi Peralta

A mi enamorada Liliana Chaglla que todo este tiempo de la Universidad siempre

A todos los profesores quienes siempre estuvieron all, brindndonos siempre su

Diego Fernando Quisi Peralta

Agradezco especialmente a mi enamorada y amiga la Ingeniera Liliana Chaglla,

Mi agradecimiento sincero al Ing. Vladimir Robles Bykbaev. Por su cooperacin,

Diego Fernando Quisi Peralta

ILUSTRACIN 1 PROM EDIO DEL NIVEL DE CONOCIMIENTO DE LOS NIOS Y NIAS

Las Tecnologas de la Informacin y la Comunicacin TICs estn sufriendo un

Actualmente las TICS ya estn cambiando ciertos procesos educativos mediante el

En este mundo globalizado, para poder lograr la inclusin de las TICS, es

Una posible solucin a esta problemtica es que se empiece a inculcar la auto-

Actualmente ya existe un proyecto en la Universidad Politcnica Salesiana para

Actualmente la Universidad Politcnica Salesiana est desarrollando un proyecto

En la actualidad las empresas estn analizando la posibilidad de trasladar sus

El beneficio que la Universidad Politcnica Salesiana obtendr, es mejorar sus

El software desarrollado podr ser descargado en cualquier parte del mundo de

1.2.2 Descripcin del Problema

Como se mencion anteriormente, el proyecto Pequeas y Pequeos Cientficos ya

Actualmente el continuo avance de la tecnologa pone a disposicin de los

Uno de los principales motivos por los que se ha desarrollado en la tecnologa

Se considera dentro del alcance de este proyecto:

Que la aplicacin Android del proyecto Pequeas y Pequeos Cientficos

1.4.1 Objetivos General

Disear e implementar una aplicacin para dispositivos Android para en el marco

1.5 Experiencias del Proyecto Pequeas y Pequeos Cientficos de la Universidad

CARLOS Lunes 9 de Viernes 20 de 15h00-

Resultados del proyecto:

Se ha observado un incremento del 48% en el promedio del nivel del conocimiento

I lustrac i n 1 P ro med io de l nive l de co noc imie nto de los nios y nias

Se plante la pregunta: Qu deseas ser cuando seas grande?. En el pre-test

I lustrac i n 2 I nte rs de los nio s y I lustrac i n 3 I nte rs de los nio s

Te gust el taller "Pequeas y Pequeos

I lustrac i n 4 Resp uesta de los nios y nia s a la p re gunta Te gust e l

Se aplic la encuesta a los padres de familia a partir de la cual se determin que al

I lustrac i n 5 I nte rs de los padre s de fa milia e n q ue s us nios y nias

I lustrac i n 6 Ta lle res e n e l Aula de c ie nc ia co n la esc ue la Fra nc isca

I lustrac i n 7 Ta lle res e n e l Aula de c ie nc ia co n la esc ue la Car los Cresp i.

I lustrac i n 9 Re uni n co n padre s de fa milia e n la esc ue la Car lo s C resp i.

2.1 Estudio de HTML 5 para dispositivos mviles

HTML5 es un estndar que empez a desarrollarse en el ao 2009, y que nos

HTML5 ya que no es simplemente una nueva versin del lenguaje de marcacin

Basarse en HTML, CSS, DOM y JavaScript.

I lustrac i n 10 Co mpos ic i n de Html5 [9 ]

Sin embargo, el principal problema es que an se est definiendo el lenguaje. Por

I lustrac i n 11 Co mpatib ilidad de los na ve gado res web co n html5 [10 ]

HTML5 permiten una flexibilidad y potencia muy grandes para la creacin de

2.2 Estudio del entorno de desarrollo Android 10

Desarrollo rpido de aplicaciones, que sean reutilizables y

Un dispositivo Android cuenta con la siguiente arquitectura (ilustracin 12), la

I lustrac i n 12 Arq uitec tura de Andro id

La capa ms inmediata es la que corresponde al ncleo de Android, utiliza el

La librera libc incluye todas las cabeceras y funciones segn el estndar

Dentro de este framework de aplicaciones podemos mencionar algunas de las

Activity Manager: Importante conjunto de APIs que gestiona el ciclo de

La mquina virtual Dalvik ha sido optimizada y adaptada a las peculiaridades