Blog del curso electivo Seminario de Investigación Multimedia de Ingeniería de Sistemas de la Institución Universitaria Antonio José Camacho, orientado por el profesor Ing. Diego López, Mg.

Aquí están publicados los resúmenes y reflexiones de algunos de los trabajos realizados por los estudiantes del curso.

8 de junio de 2014

PLAYCLASS Software Interactivo sobre Clases y Objetos en POO

por Gustavo Adolfo Cruz Sánchez, Paola Andrea Mendoza Anturi y Adrián Ortega Ramírez



Resumen

El presente artículo describe el diseño y construcción del software multimedia interactivo cuyo objetivo principal es explicar y dar a conocer qué es y cómo funcionan los conceptos CLASE y OBJETO en el paradigma de programación orientada a objetos – POO. El sistema diseñado busca dar a entender la relación que existe entre clase, objeto y atributo a través de una actividad que se ha denominado “Describe lo que ves”, en donde los usuarios pueden captar y aprender las diferencias entre los conceptos anteriormente mencionados y la estrecha relación que también los une.

Palabras Clave: multimedia, POO, clase, objeto, variable, atributo.


Abstract

This paper describes the design and construction of interactive multimedia software PLAYCLASS whose main objective is to explain and publicize what it is and how CLASS and OBJECT work on the paradigm of object-oriented programming - OOP. The designed system seeks to understand the relationship between class, object and attribute through an activity called "Describe what you see", where users can capture and learn the differences between the concepts above and the close relationship that also connects them.

Keywords: multimedia, OOP, class, object, variable, attribute.



CAPÍTULO I. INTRODUCCIÓN

Hoy en día la tecnología nos ha proporcionado muchas herramientas útiles para el desarrollo de sistemas modernos, llamativos y funcionales, lo que ha permitido ir evolucionando a gran manera que ya hoy en día es muy fácil tener acceso a aplicaciones multimedia que ofrecen un sinnúmero de posibilidades. Processing es una herramienta de código abierto que fue desarrollada para personas que quieren crear imágenes, animaciones e interacciones y sistemas que integran programación, diseño y multimedia. Inicialmente desarrollado como software para crear bocetos de trabajo y enseñar los principios de la programación en un contexto visual, Processing ha evolucionado hacia una herramienta de producción profesional. Hoy hay millones de estudiantes, artistas, diseñadores, investigadores y aficionados que usan Processing para aprender, hacer prototipos y producir proyectos a diario.

Este proyecto tuvo como motivación enfocarnos en los estudiantes que cursan entre el segundo o tercer semestre de tecnología e ingeniería de sistemas, ya que tomamos nuestras experiencias pasadas para poder enfocarnos en los dos conceptos que manejamos que son las clases y los objetos. Estos conceptos para algunas personas pueden parecer fáciles de entender y diferenciar, pero según nuestra historia vivida dentro de la Institución Universitaria Antonio José Camacho nos costó mucho al principio de nuestra etapa de principiantes diferenciar estos dos patrones fundamentales al momento de inducirnos al lenguaje de programación.


CAPÍTULO 2. DISEÑO Y CONSTRUCCIÓN

La temática sobre la cual el sistema se basa, es la relación y diferenciación de los conceptos clase, objeto y atributo dentro del contexto de programación orientada a objetos. Sobre los 3 ejes anteriores es que se fundamenta este paradigma de programación y es de suma importancia que se aprenda a identificar la relación entre ellos y los factores que los diferencian.

En la programación orientada a objetos – POO, una clase es Definiciones de las propiedades y comportamiento de un tipo de objeto concreto. La instanciación es la lectura de estas definiciones y la creación de un objeto a partir de ellas; un objeto, es una instancia de una clase, es decir, un elemento provisto de un conjunto de propiedades o atributos (datos) y de comportamiento o funcionalidad (métodos), los mismos que consecuentemente reaccionan a eventos. Se corresponden con los objetos reales del mundo que nos rodea, o con objetos internos del sistema (del programa). Es una instancia a una clase. Finalmente, un atributo es Contenedor de un tipo de datos asociados a un objeto (o a una clase de objetos), que hace los datos visibles desde fuera del objeto y esto se define como sus características predeterminadas, y cuyo valor puede ser alterado por la ejecución de algún método.

A continuación se muestra un mapa mental sobre los conceptos de clase, objeto y atributo dentro del contexto de programación orientada a objetos – POO:

Figura 1. Mapa mental Clases y Objetos en POO 

La idea del sistema se concibió y construyó como una ayuda interactiva que buscara explicar a través de una actividad interactiva, cómo identificar las clases, los objetos y las propiedades de un dentro del contexto de Programación Orientada a Objetos POO. La actividad que maneja el sistema se ha denominado “Describe lo que ves” la cual consiste en identificar elementos con sus características y las categorías en las que esos elementos pueden agruparse o clasificarse. El sistema trabajará con 3 categorías: Figuras geométricas, animales y frutas. Cada categoría tiene elementos que la componen y estos elementos unas características; de esta forma, utilizamos la metáfora de categoría, elemento y característica respectivamente para referirnos a Clase, objeto y atributo.

Al entenderse las diferencias y relaciones los tres conceptos mencionados anteriormente, el estudiante podrá  identificar fácilmente cada concepto y la forma en que estos se utilizan en la programación orientada a objetos. Al usarse la metáfora descrita anteriormente como estrategia de explicación del significado y manejo de los conceptos Clase, Objeto y atributo, se espera que el estudiante tenga claro cómo identificar cada elemento en un contexto real de programación.

Funcionamiento del aplicativo

El sistema trabaja con una actividad que se ha denominado "Describe lo que ves". El usuario tiene la posibilidad de elegir elementos de entre tres categorías diferentes: Figuras geométricas, animales y frutas. A continuación se describen las funcionalidades del sistema:

Ø  Seleccionar categoría: Existen tres categorías diferentes las cuales el usuario podrá elegir. Cada categoría tiene elementos asociados a ella. En este sentido, la categoría FIGURAS GEOMÉTRICAS tiene elementos como el círculo, el cuadrado, el triángulo, el trapecio, etc., los cuales tendrán características comunes como el color o un distintivo, las diferencias están en las formas de las figuras. 

Ø  Pizarra de elementos: Es la imagen de pizarra en donde se irán ubicando los elementos que el usuario vaya sacando de una categoría.

Ø  Asignar nombre a los elementos: Permite al usuario darle nombres a los elementos que se ven en la pizarra.

Ø  Describe lo que ves: Esta funcionalidad trabaja con 4 preguntas de selección múltiple. Cada pregunta está orientada a que el usuario elija opciones que describan los elementos que se muestran sobre la pizarra. Cuando el usuario elige la respuesta correcta se reproduce un sonido, cuando el usuario elije una respuesta errónea, es decir, que no describe los elementos, el sistema reproduce un sonido de error. Las 4 opciones correctas que describen los elementos de la pizarra se mostrarán en una cinta en la parte inferior de la pizarra; tal cinta se ha denominado cinta de características.

Ø  Ver explicación de la relación Clase-Objeto-Propiedad de acuerdo a la categoría, elementos y características elegidas por el usuario: Una vez se ha finalizado el juego, el usuario podrá visualizar la explicación de la relación entre la categoría, el elemento y la característica del elemento y podrá armar la jerarquía de los conceptos. Esta jerarquía se define como: Una categoría tiene varios elementos que tienen características. Los elementos se diferencian entre sí pero poseen características comunes lo que los hace pertenecer a una misma categoría. Lo anterior es la relación entre clase-objeto y atributo.

El sistema se desarrolló basado en el Paradigma de Programación Orientado A Objetos - POO, específicamente en lenguaje Java. La herramienta que se utilizará para el desarrollo del sistema es Processing el cual es un entorno que permite integrar elementos visuales y gráficos a los desarrollos, agregando un valor de diseño al producto final.


Diseño


La atmósfera del juego recrea un ambiente tipo fábrica, con colores plata y naranjas y un personaje que guía el juego llamado Robotín, el cual es un robot. Dicho robot tiene el papel de guía durante la dinámica, es quien saca los elementos de las cajas de categorías y quien organiza los objetos en la pizarra de objetos. Los sonidos que se reproducen durante el juego representan sonidos robóticos y mecánicos, además de sonidos que refieren a lo lúdico, a lo divertido.

Lo divertido del juego está en que el usuario puede interactuar con tres categorías diferentes y que las preguntas sobre las características de cada elemento son diferentes, dejando así un espacio a lo nuevo, a la sorpresa de saber si se respondió bien o no y de saber cómo queda armada al final la relación objeto, clase y atributo.


Reglas y dinámica

El juego consiste en brindar una explicación muy simplificada de la diferenciación de los conceptos de clase y objeto, en los cuales se tienen diversas dificultades los estudiantes de ingeniería de sistemas al momento de obtener la explicación de los conceptos.

Este juego se basa principalmente en la didáctica de la diferenciación de dichos conceptos  con interfaces dinámicas las cuales hacen ver interesante el desarrollo del juego y la explicación sencilla de los conceptos de clase y objeto.
Las interfaces están compuestas por elementos didácticos como animales, objetos geométricos y frutas, los cuales serán elegidos según su categoría y su elección.
Para iniciar partida en el juego empezamos dándole clic al botón inicio en el cual se explicara cual es la dinámica del juego, esta inducción se hará por el robot (ROBOTIN), el cual será nuestro actor dentro del juego, después nos inducirá a la interfaz donde nos desplegara unas cajas en donde cada una tendrá una categoría diferente para la elección del usuario que esta interactuando con el juego.


Mapa Navegacional

En esta sección, se describe como es el despliegue de la aplicación, indicando la navegabilidad que se les ofrecerá a los usuarios en el sistema. La aplicación se compone de estas cuatro zonas bien diferenciadas:

Ø  Pantalla de Bienvenida: Ventana inicial de la aplicación que mostrará el nombre del aplicativo y el logo, además de tener un botón de Inicio.

Ø  Cabecera: Se mostrarán aspectos básicos de la aplicación como nombre del sistema y créditos de equipo desarrollador.

Ø  Bloque principal: Representa la zona donde el usuario interactuará y donde está ubicada la pizarra de elementos.

Ø  Botonera Bloque Principal: Botones que permiten al usuario interactuar con la aplicación y que no son de navegabilidad entre pantallas.

Ø  Sección Inferior de Botones: Contendrá los botones básicos para la navegación a través de las pantallas.


Personaje Guía


 

Figura 2. Robotín

Robotín (Figura 2). Personaje principal de PlayClass. Es el robot guía durante el juego, encargado de dar las instrucciones y de sacar los elementos escogidos dentro de las cajas de categorías.

        
Resultados finales

El resultado final obtenido, fue una aplicación interactiva que hace uso de elementos visuales y sonoros para explicar a través de un juego de que tratan los principios básicos que son los conceptos de CLASE, OBJETO y ATRIBUTOS dentro de la programación orientada a objetos. A continuación, se muestran imágenes del resultado final obtenido:

Pantallas de inicio: Pantallas que muestran el logo de la Universidad, el logo, el logo del grupo y una pantalla de splash del juego.

Figura 3. Pantalla Inicio 1

Figura 4. Pantalla Inicio 2

Figura 5. Pantalla Inicio 3

Pantalla de selección de categoría: En esta pantalla, el usuario tiene la opción de seleccionar la categoría con la cual quiere jugar; en este caso, la categoría es la metáfora utilizada para hacer referencia a la clase.

Figura 6. Pantalla selección categoría

Pantalla de Pizarra de trabajo – Sacar elementos de categoría: Esta pantalla permite al usuario sacar un conjunto de elementos que pertenecen a la categoría; en esta sección, los elementos son la metáfora utilizada para referirnos a los objetos que pertenecen a una clase. También en esta pantalla el usuario puede asignarle un nombre a cada elemento que saque de la caja de categoría, lo que refiere al nombre e instanciación de un objeto que pertenece a una clase.

Figura 7. Pantalla de pizarra de elementos

Pantalla de Pizarra de trabajo – Describe lo que ves: en esta pantalla el usuario tiene la opción de determinar las características o atributos de los elementos que salieron de la caja de categoría, asemejando a la definición de atributos de una clase, los cuales definen o caracterizan el objeto del tipo de la clase. Lo anterior, se hace a través de una serie de preguntas de selección múltiple con única respuesta.

Figura 8. Pantalla "Describe lo que ves"

Pantallas de Explicación – Arma la relación: en estas pantallas el usuario tiene la opción de armar la relación clase, objeto, atributo, de acuerdo a lo entendido durante el juego. El armado de la relación se hace a través de unas fichas que se pueden ubicar en una especie de rompecabezas jerárquico.


Figura 9. Pantalla "Arma la relación" 1 

Figura 10. Pantalla "Arma la relación" 2

  
III. CONCLUSIÓN

Hoy en día los estudiantes que se aventuran hacia el amplio campo de la programación,  presentan diferentes inconvenientes al momento de diferenciar algunos conceptos ya que son  amplios y  similares al momento de implementarlos en el desarrollo de alguna aplicación. Es por esto que se ha desarrollado esta aplicación para así brindar una herramienta para dichos estudiantes ya que sus inconvenientes no son de conocimiento sino de diferenciación de conceptos al momento de aplicarlos.

El desarrollo de este video juego además de ser una herramienta como ya se mencionó antes, es un juego muy didáctico en el cual se permiten de forma muy sencilla entender los conceptos por los cuales se desarrollado dicho video juego, clases objetos y atributos. Con este proyecto se busca que las personas que estén interesados en iniciar la etapa de aprendizaje que se encuentra entre el semestre tercer y cuarto según nuestra experiencia vivida, comprendan dicha diferenciación sobre los conceptos expuestos en nuestro proyecto de curso y no se abstenga de aprender a diferencias los conceptos de clase y objeto.

Además del enfoque que se le dio al proyecto, no enfocamos el proyecto a ganar o perder una  partida de  juego ya que nos centramos en que el estudiante o usuario que interactuara con la aplicación lograra entender la esencia básica de los conceptos clase, objeto y atributo. Por lo anterior, nuestra principal  motivación para desarrollar el aplicativo interactivo PLAYCLAS, es explicar y generar interés en el estudiante sobre 3 conceptos básicos en el paradigma de programación orientada a objetos.


BIBLIOGRAFÍA
[Floru05] FLÓREZ RUEDA, Roberto. Algoritmos, estructura de datos y programación orientada a objetos. Capítulo 15. Programación Orientada a Objetos (POO). Bogotá. 2005
[Laal02] LACRUZ ALCOCER, Miguel. Nuevas tecnologías para futuros docentes. Ediciones de la Universidad de Castilla – La Mancha. Las Líneas Actuales de los Sistemas Multimedia. Multimedia Hoy. 2002


AGRADECIMIENTOS

Queremos extender nuestros más sinceros agradecimientos a la universidad y en especial al profesor Ing. Darío Diego López por su dirección y orientación durante el proceso de diseño y desarrollo de este proyecto, ya que gracias a sus enseñanzas, directrices y su interés en la elaboración de un producto de calidad se pudo lograr un magnífico resultado en la elaboración del proyecto realizado con la herramienta processing para darlo a conocer al estudiantado en el evento SOFTHARD. Con ello dimos a conocer nuestro proyecto dando así una demostración que no solamente se puede desarrollar y diseñar en java o .net, sino también usar una herramienta como lo es processing la cual nos permite familiarizarnos con el entorno gráfico de una forma muy interesante y creativa.








CICLOMEDIA

Por Christian Valencia Gutiérrez y Rafael Antonio Arango Victoria


Resumen

El fundamento de la aplicación CICLOMEDIA, es enseñar de forma didáctica el funcionamiento y correcto uso de los ciclos a través del juego, el cual, por pantalla se formula una pregunta con opción de cuatro respuestas, de las cuales tres son incorrectas y una es la correcta. Al seleccionar la respuesta correcta el automóvil empezara a moverse sobre la pista de carreras, si es incorrecta, el automóvil se estrellará.

Palabras claves: Ciclo, juego, programación, código.


Abstract

The base of the application CICLOMEDIA is to teach didactically correct operation and use of cycles through the game, through the game, for a question screen is formulated with choice of four answers, but only one is correct. If the answer selection is correct, th car begin move from the racetractk, but the answer is wrong the trunck crashes

Keywords: Cycle, game, programming, code.



1. Introducción

Enseñar de forma didáctica el funcionamiento y correcto uso de los ciclos, esto se realizará a través de un juego, el cual mediante una metáfora hará referencia a estos. Para esta metáfora se escogieron las pistas de carreras, ya que para completar una carrera se debe realizar un ciclo, el cual solo culminará cuando se haya cumplido el propósito.


Ciclo (Bucle)

Un bucle o ciclo, en programación, es una sentencia que se realiza repetidas veces a un trozo aislado de código, hasta que la condición asignada ha dicho bucle deje de cumplirse. Generalmente, un bucle es utilizado para hacer una acción repetida sin tener que escribir varias veces el mismo código, lo que ahorra tiempo, deja el código más claro y facilita su modificación en el futuro.

El bucle y los condicionales representan la base de la programación estructurada. Es una evolución del código ensamblador, donde la única posibilidad de iterar un código era establecer una sentencia jump (que en los lenguajes de programación fue sustituida por el "ir a" o GOTO). Los tres bucles más utilizados en programación son el bucle “while”, el bucle “for” y el bucle repetir.


2. Desarrollo

2.1 Mapa conceptual

Figura 1. Mapa conceptual sobre ciclos
Fuente: Elaboración de los autores

2.2 Diagrama de caso de uso

Figura 2. Diagrama de casos de uso
Fuente: Elaboración de los autores

La primera pantalla Figura 3, muestra el menú del juego es iniciarlo o salir de él.


Figura 3. Pantalla de inicio
Fuente: Elaboración de los autores

La segunda pantalla Figura 4, muestra el tipo de pista en el cual se quiere jugar, cada pista tiene preguntas diferentes.

Figura 4. Seleccionar pista
Fuente: Elaboración de los autores

Las pantallas Figura 5, Figura 6 y Figura 7, muestran las preguntas que se formularían si se escoge cualquiera de las pistas.

Las preguntas se deberán resolver mientras el automóvil va recorriendo la pista, si responde mal el problema, el automóvil se estrellara como sinónimo de que ha perdido.



Figura 5. Seleccionar pista
Fuente: Elaboración de los autores

Figura 6. Seleccionar pista
Fuente: Elaboración de los autores

Figura 7. Seleccionar pista
Fuente: Elaboración de los autores

3. Conclusiones

Esta aplicación nos ha dejado un mejor entendimiento sobre la herramienta de programación PROCESSING, tanto como el alcance de la misma, y unos conocimientos en el desarrollo de habilidades en el diseño gráfico.

Por otra parte, el usuario al jugar CICLOMEDIA entenderá más fácil los conceptos de bucle “while”, el bucle “for” y el bucle “do while”.


Referencias
Innovacioneducativa.com. (2001, Octubre 23) Bienvenidos al sitio Web de la Biblioteca. [On line]. Disponible: http://innovacioneducativa.files.wordpress.com/2012/10/buccles.pdf
wikispaces.com (2001, octubre 23) Bienvenidos al sitio Web de la Biblioteca. [On line]. Disponible: http://laeducacioninformatizada.wikispaces.com/T.+5+Funciones+que+pueden+realizar+los+programas+educativos
www.ecured.cu. (2001, Octubre 23) Bienvenidos al sitio Web de la Biblioteca. [On line]. Disponible: http://www.ecured.cu/index.php/Ciclo_(Programaci%C3%B3n).
Wikipedia. (2001, Octubre 23) Bienvenidos al sitio Web de la Biblioteca. [On line]. Disponible: http://es.wikipedia.org/wiki/Processing

6 de junio de 2014

Software Multimedia “Data Type Soft”

Por Marcela Roldán Narváez


Resumen

Este artículo presenta una breve descripción sobre el desarrollo del software multimedia “Data Type Soft” que tiene como objetivo dar a conocer qué son los tipos de datos y cómo se deben emplear a la hora de programar en cualquier lenguaje.

Palabras Clave: Tipos de datos, usuario, interacción, multimedia.


Abstract

This article presents a short description about the development of the multimedia software “Data Type Soft” that has like objective give to know What are the data types? And How it should use in any language of programming?


Key Words: Data Types, user, interaction, multimedia




1. Introducción

A raíz de los grandes avances tecnológicos que se presentan hoy en día, se hace más fácil acceder a la educación multimedia y al aprendizaje continuo a través de juegos que están presentes no solo en una computadora a través de internet, sino también en los dispositivos móviles como lo son las tabletas y los smartphones.

Debido a estos dispositivos, se pueden observar que gran cantidad de niños, jóvenes y adultos interactúan con estas herramientas a diario, permitiéndoles acceder a gran cantidad de información y sitios web, como lo son: noticias, redes sociales, juegos, entre otros.

Los juegos multimedia han tenido una gran acogida en este ámbito, por lo cual se han venido desarrollando gran cantidad de videojuegos que tienen como objetivo la enseñanza y divulgación de temas específicos referente a la educación.

Hoy por hoy aprender a programar hace parte también de un juego, ya que durante el desarrollo del curso de seminario de investigación multimedia, se ideó una herramienta la cual permitiera a un estudiante que tenga bases sobre programación, qué son los tipos de datos y cómo se deben emplear cuando se esté desarrollando una nueva aplicación multimedia.

El software “Data Type Soft” tiene como objetivo principal dar a conocer el tema de los tipos de datos mediante la metáfora de una casa, la cual por cada espacio se irán agrupando los elementos que correspondan a este. Como por ejemplo: El jarrón ubicado en una sala, en donde la sala es un tipo de dato y el jarrón sería interpretado como un dato, lo que quiere decir que almacenará su propio valor y únicamente podrá estar ubicado dentro de ese tipo de dato, que en este caso es la sala.


2. Desarrollo


2.1. Caso de Uso General

Para dar a entender de una forma más precisa la interacción que tendrá el usuario con el sistema, a continuación se dará a conocer el diagrama de caso de uso general en el que se observa de una forma detallada y explícita el comportamiento del usuario con el sistema:
Fuente: Elaboración propia del autor


2.2. Mapa de Navegación

Fuente: Elaboración propia del autor

Fuente: Elaboración propia del autor.

Como se observa en el mapa, el software cuenta con 3 módulos, en el primer módulo se cuenta con un enlace de videos en los cuales el usuario podrá encontrar explicación de qué son los tipos de datos, cómo se utilizan al programar; el segundo módulo cuenta con definiciones más puntuales escritas acerca del tema tipos de datos; por último se encuentra el juego en el cual como se mencionó anteriormente el usuario deberá asociar el tipo de dato acorde al escenario dado, como lo muestra la siguiente imagen:


La temática del juego radica en que cuando el dato a asociar (figura del lado izquierdo) NO corresponde al tipo que es (Escenario del lado derecho), éste automáticamente devuelve la figura donde originalmente se empezó a arrastrar, es decir al lado izquierdo de la pantalla del juego y sonará un audio de equivocación, lo que indicará al usuario que no corresponde dicha asociación.

La importancia del software radica en que se le enseñará al usuario de una manera dinámica la diferencia que puede haber entre los tipos de datos que son similares, como lo son los tipos de datos enteros: short, int, long y los reales: float y double.

Teniendo en cuenta que las diferencias de estos tipos de datos radican en su capacidad de almacenamiento, muchos estudiantes tienden a confundirlos, este software tiene como objetivo enseñarle al usuario con qué capacidad cuenta ese tipo de dato para ser almacenado.

A continuación se muestra algunos de los tipos de datos como escenarios y datos como objetos de los escenarios implementados en el software:


3. Conclusiones         

Después de haber implementado el software y observado detenidamente las acciones y el aprendizaje que el usuario podrá tener con él, se puede concluir que:

Data Type Soft en su primera versión cumple con el objetivo previamente planteado, dar a conocer al usuario qué son los tipos de datos y su correcto uso a la hora de programar, mediante una herramienta multimedia como lo es el videojuego, el cual no solo permite un aprendizaje sino que también es un medio de entretenimiento y diversión.

Data Type Soft contempla la posibilidad de escalar, es decir se podría implementar más niveles del juego, para así generar en más profundidad un conocimiento un poco más amplio en el tema de los tipos de datos.



Bibliografía
[1]. Definición Dato [En línea]. Disponible en: http://lema.rae.es/drae/?val=dato  [01 de Abril de 2014].
[2]. Definición interactivo [En línea]. Disponible en: http://lema.rae.es/drae/?val=interactivo[01 de Abril de 2014].
[3]. Definición interacción [En línea]. Disponible en: http://lema.rae.es/drae/?val=interaccion  [01 de Abril de 2014].
[4]. Ejemplos de software educativo. [En línea]. Disponible en: http://ejemplosde.org/informatica/software-educativo [12 de Marzo de 2014].
[5]. Ejemplos de software educativo. [En línea]. Disponible en: http://ejemplosde.org/informatica/software-educativo [12 de Marzo de 2014].
[6]. Ejemplos de software educativo. [En línea]. Disponible en: http://ejemplosde.org/informatica/software-educativo [12 de Marzo de 2014].
[7]. Definición multimedia [En línea]. Disponible en:   http://lema.rae.es/drae/?val=multimedia  [01 de Abril de 2014].
[8]. Tipos de Datos. [En línea]. Disponible en: http://teleformacion.edu.aytolacoruna.es/PASCAL/document/tipos.htm [01 de Abril de 2014]
[9] Definición multimedia [En línea]. Disponible en: http://lema.rae.es/drae/?val=memoria [01 de Abril de 2014].



Sencillez, Astucia y Diversión – La esencia de Smart Decision Guardian

por Bairon Fernando Freire Otalvaro y Brayham Camilo Peña

RESUMEN


Philip es un joven que debe utilizar su inteligencia y la información que ha obtenido de sus rivales para desarrollar estrategias de batalla efectivas y proteger su villa de la destrucción absoluta.  

Este es el fundamento de Smart Decision Guardian, un juego que pretende ejemplificar el uso de las estructuras condicionales y de selección en una forma divertida y fácil.  Cada uno de los 5 enemigos a los que debe derrotar nuestro protagonista representa una estructura condicional diferente, cuya dificultad va aumentando en cada nivel hasta el punto de que en el último combate un solo error puede desembocar en la derrota. 


ABSTRACT


Philip is a young man who must use his intelligence and information gathered from his opponent to develop effective battle strategies and protect his village from utter destruction. 

That is the argument of Smart Decision Guardian, a video game that aims to exemplify the use of conditional and selection structures in a fun and easy way. Each of the 5 enemies our hero must defeat represents a different conditional structure, whose difficulty increases with each level to the point that in the last combat one mistake can lead to defeat.



INTRODUCCIÓN


Smart Decision Guardian no trata solamente de  involucrar las estructuras condicionales dentro de un aplicativo multimedia, se prentende que alguna porción de los jugadores se sientan familiarizados con la jugabilidad, la forma de ejecutar los comandos y en general el sistema de batalla.  

Es por esta razón que Philip, el protagonista, se ve envuelto en una modalidad de batalla por turnos muy común en los juegos de rol desde hace varias décadas, y  aunque Smart Decision Guardian carece de prácticamente todos los elementos de un juego de rol convencional y aunque ha sido clasificado por sus creadores dentro de la categoría Beat-em up (Derrótalos a todos), el juego trae a la memoria del jugador combates como los de la saga Final Fantasy y otros tantos títulos.



Figura 1. Pantalla de Combate
Nótese el menú de comandos, muy similar al utilizado en los combates de los juegos de rol

SENCILLEZ


Tras abordar el objetivo del juego y comprender el origen de la idea, se puede hablar de uno de los aspectos  fundamentales del proyecto, como lo es la sencillez.  Con gráficos bidimensionales y minimalistas (a excepción del logo) Smart Decisión Guardian presenta una interfaz gráfica que a pesar de no estar al nivel de videojuegos comerciales, cumple a cabalidad con las expectativas del usuario. 

El diseño del fondo, elaborado a mano y con gran esfuerzo por el equipo de diseño se constituye en el escenario ideal para que Philip libre su épica batalla.  El mismo Philip por su parte es el resultado de un laborioso diseño utilizando las autoformas de Microsoft Power Point ®, que con la combinación correcta de ángulos tamaños y colores dieron vida a un héroe que puede utilizar todo tipo de armas, lanzar hechizos y hasta celebrar su victoria.


Figura 2. Las autoformas de Microsoft PowerPoint ® que dieron vida a Philip

Este esquema permitió al equipo de diseño elaborar las aproximadamente 60  imágenes necesarias para animar todas las acciones del héroe.  Si bien es un volumen considerable de imágenes, la facilidad de diseño y la versatilidad de las autoformas hicieron que esta labor perdiera gran parte de su complejidad y permitiera el acoplamiento de los miembros del equipo.

Teniendo en cuenta la característica de la sencillez, se realizó el diseño de los enemigos.  Gracias a la orientación del asesor del proyecto se logró un set de enemigos compatible con el universo del juego y al mismo tiempo agradables a la vista.  

Se buscó una interacción fácil entre el aplicativo y el jugador, razón por la cual se omitió por completo el uso del mouse y se utilizó comandos enviados desde el teclado.  De esta forma, con solo leer la ventana de ayuda que se encuentra en la parte superior de la ventana, el jugador puede saber como ejecutar los comandos y el efecto que puede tener dentro del juego.


ASTUCIA


Cualquiera que haya jugado Smart Decision Guardian se habrá dado cuenta de que es prácticamente imposible superar todos los niveles sin tener en cuenta los condicionales.  De hecho, si el jugador no consulta la ayuda y no tiene en cuenta las debilidades del enemigo el monstruo del primer nivel podría (en teoría) lograr una victoria perfecta sobre nuestro jugador.

Esto también hace parte del corazón de Smart Decision Guardian. La finalidad del juego es ejemplificar el uso de los condicionales y las estructuras de selección, por lo anterior el aplicativo está diseñado para que un jugador solo pueda triunfar si aplica criterios y maneja las estructuras condicionales y de selección para su beneficio.

Smart Decision Guardian no se trata de fuerza bruta, se trata de inteligencia, de astucia y de poner en práctica uno de los pilares fundamentales de los algoritmos y del desarrollo de software como lo son las estructuras de decisión.


DIVERSIÓN


Smart Decision Guardian ofrece un reto al jugador en el enfrentamiento contra una serie de rivales con características diferentes.  Se esperaría que esto lograse llamar la atención del jugador.  Sin embargo, siendo este un juego tan corto se decide incluir algunos otros elementos que resulten interesantes o al menos divertidos para el compañero o el jugador que decida probar este aplicativo.

Cada miembro del grupo diseño al menos uno de los enemigos y algunos elementos gráficos del entorno,  por lo tanto cada miembro del grupo puso su toque personal dentro del juego.  Las descripciones de cada monstruo, sus ataques y características son el resultado de la imaginación de algunos de todos los miembros del equipo de desarrollo, y durante la exposición realizada se pudo observar el interés de varios de los jugadores por alguno de los enemigos presentados en el juego.

El mismo Philip, con sus diversos ataques como la Basuka, la dinamita o la bomba atómica han motivado los comentarios de los jugadores y permiten soñar con un futuro desarrollo en donde se incluyan más comandos y ataques con fuerza desmedida cuya efectividad dependa solo del conocimiento y la astucia del jugador.

Para resumir, el grupo de trabajo puede manifestar que se siente muy satisfecho por el resultado de este trabajo que si bien no tiene la envergadura suficiente para llegar a ser comercial, si facilitó la compresión de conceptos del diseño absolutamente desconocidos para nosotros, como lo eran el manejo de la paleta de colores, el licenciamiento de los recursos de sonido, la uniformidad y compatabilidad de los recursos gráficos entre muchos otros.

4 de junio de 2014

VertorSoft

Por Yeiner Álvarez y Juan Felipe Rodríguez

Resumen—En este  artículo se describe una breve introducción de un software para el aprendizaje y el manejo de los vectores en el área de la programación de sistemas informáticos. El diseño de VECTORSOFT aplicado a la tecnología en la programación informática, significa proporcionar una herramienta de aprendizaje fundamental en  la rama del desarrollo del software. 

Índice de Términos: Tecnología, dispositivos,  computación, juegos,  multimedia, tren, aprendizaje, vector, matriz.

Abstract—This article describes a brief introduction of software for learning and vector management in the area of systems programming. VECTORSOFT design applied to technology in computer programming, means providing essential learning tool in the field of software development.

Keywords:  Technology, devices, computers, games, multimedia, train, training, vector, matrix.



I. INTRODUCCIÓN

El sistema que se explica a continuación comprende una importante herramienta de apoyo para los estudiantes de tecnología e ingeniería de sistemas, o personas interesadas en adquirir conocimientos fundamentales de la programación de sistemas. Mediante el aprendizaje, entendimiento y usos de las matrices unidimensionales conocidas como vectores. Este software ayuda al usuario a comprender de manera gráfica el comportamiento de los vectores.
Con base en lo mencionado anteriormente, vale la pena destacar que el aprendizaje a través del computador no implica únicamente programar una secuencia de operaciones en el computador, sino también un conjunto de actividades de instrucción que educativamente sean valiosas y conduzcan al logro de los objetivos planteados. Además, al implementar el sistema, es aconsejable medir la aceptación del programa por parte de los estudiantes.

La implantación de software educativo para la educación  se considera un estudio novedoso, pues en la actualidad se vienen adelantando actualizando sistemas de aprendizaje computarizado que benefician la calidad de la educación.




II. DESARROLLO

A. Teorías del aprendizaje

Cuando se habla de aprendizaje, hay que hacer una análisis del ser como individuo racional, capaz de aprender y producir conocimiento. Podemos citar tres grandes teorías que nos pueden definir patrones de aprendizaje que son: el conductismo, cognitivismo y constructivismo.

El conductismo iguala al aprendizaje con los cambios en la conducta observable, bien sea respecto con la forma o la frecuencia de esas conductas. El aprendizaje se logra cuando se exhibe una respuesta apropiada después de la presentación de un estímulo ambiental específico; en este caso los elementos claves son el estímulo, la respuesta y la asociación entre ambos. [1]

El cognitivismo es una teoría en la cual se establece que: La memoria posee un lugar preponderante en el proceso de aprendizaje que se produce cuando la información es almacenada de una manera organizada y significativa; en este sentido al planificar la enseñanza se deben usar técnicas como analogías, relaciones jerárquicas para ayudar a los estudiantes a relacionar la nueva información con el conocimiento previo y debido al énfasis en las estructuras mentales, se considera a las teorías cognitivas más apropiadas para explicar las formas complejas de aprendizaje; entre ellas, razonamiento, solución de problemas, procesamiento de información.” [1]

El constructivismo es una teoría que equipara el aprendizaje con la creación de significados a partir de experiencias; la cual no niega la existencia del mundo real, pero sostiene que lo conocido de él nace de la propia interpretación de nuestras experiencias, por eso los humanos crean significados...sostiene que los estudiantes no transfieren el conocimiento del mundo externo hacia su memoria, sino que construyen interpretaciones personales del mundo basados en las experiencias e interacciones individuales, en consecuencia las representaciones internas están abiertas al cambio, el conocimiento emerge en contextos que le son significativos, por lo tanto, para comprender el aprendizaje que ocurre en una persona se debe examinar la experiencia en su totalidad.  [1]


B.  Metodología

En este desarrollo de software fue de tipo documental y exploratoria. Documental debido a la investigación en textos y artículos, y exploratoria ya que no basamos nuestra investigación en proyectos anteriores en el tema de aprendizaje de vectores con aprendizaje multimedia. Aunque no se utilizó una metodología específica para la producción del software  se utilizó unos ítems dentro de las metodologías como las de RUP que son análisis, diseño y construcción.



Fase I: Análisis

En esta fase se realizó un estudio que contempló todos los elementos que influyeron en el software educativo, los cuales están referidos al análisis del público, del ambiente, del contenido y del sistema.

a. Análisis del público

La población que se tomó en cuenta para la elaboración del software VECTORSOFT fue estudiantes de tecnología e ingeniería de sistemas.

b. Análisis del ambiente

Actualmente, Institución educativo Antonio José Camacho carece de herramientas de software educativos que facilitan la labor del docente y el aprendizaje del alumno. El software educativo se desarrolló en un ambiente multimedia, Processing en el cual se utilizaron imágenes, audio, y texto, para crear una interfaz gráfica atractiva y amigable para los usuarios.

c. Análisis del contenido

Considerando el contenido programático y en función de los conocimientos que se desea que los estudiantes de las tecnologías de información obtengan o fijen de acuerdo con sus necesidades, se organizó de manera estructurada y sintetizada toda la información requerida. Para ello, una vez analizado el contenido, se realizó una selección de un tema específico de las estructuras de datos que son las matrices unidimensionales conocidas también como vectores.

Figura 1. Mapa conceptual.
Fuente: Elaboración de los autores

d. Análisis del Sistema

Una vez analizado el público, el ambiente y el contenido, se planificó el desarrollo de un software educativo VECTOR SOFT como apoyo a la optimización del proceso de aprendizaje. Para lograr este fin, se realizó una selección de los temas planteados en la asignatura de Investigación Multimedia,  donde se analizaron los requerimientos básicos para el desarrollo del software y se logró establecer que es operacionalmente factible.


Fase II: Diseño

Se realizó un diseño educativo y un diseño interactivo. El primero consistió en organizar toda la estructura del contenido educativo, la cual está formada por las metas educativas, los objetivos de aprendizaje, las decisiones de contenido (expuesta en la fase de análisis) y el prototipo en papel. El segundo permitió determinar los requerimientos para el diseño e interfaz, el mapa de navegación para el recorrido del software y las pantallas de esquema.

Diseño educativo. El software educativo desarrollado fue denominado VECTOR SOFT, el cual se basa en el computador bajo una tecnología de multimedia, diseñada para complementar los conocimientos desarrollados en el en el uso de los vectores para la programación de sistemas informáticos, y para facilitar el proceso de aprendizaje de la de la estructura de datos en las matrices unidimensionales.

a. Objetivo del software

Aprender el uso y las funcionalidades de los vectores en la programación de la programación de computadores.

b. Diseño de contenido
VECTOR SOFT conformado por la sistematización de la información referente a los vectores o las matrices unidimensionales que forman parte del contenido programático de la dentro de las estructuras de datos y del desarrollo de del contenido de la asignatura de investigación multimedia.

Diseño interactivo. Se realizó a través de la construcción de las pantallas de VECTOR SOFT, fundamentándose en la determinación de los requerimientos funcionales, el diseño de interfaces amigables, la presentación de las rutas de navegación de las unidades del contenido programático de la asignatura seminario de investigación multimedia, así como también se plasmó la distribución de texto, imágenes y animaciones de las pantallas.

Los requerimientos funcionales permitieron ofrecer independencia entre las unidades para que el usuario pueda elegir su camino de navegación, es decir, que éste pueda acceder libremente a la información contenida en el software educativo, dependiendo del interés área en estudio de los vectores; igualmente, mostrar un tutorial amigable y atractivo, de manera tal que interactúe con el mismo las veces que así lo considere necesario para captar la información presentada.
   
a. Diseño de interfaz

VECTOR SOFT tiene como finalidad mejorar el proceso de aprendizaje a través del computador como recurso de instrucciones, razón por la cual se muestra una interfaz en la que se da la combinación de sonidos, colores, imágenes, así como cualquier otro elemento que ayude al diseño de las pantallas. Estos elementos ofrecen a los estudiantes un ambiente favorable para la construcción de aprendizajes significativos, además de permitir diferentes grados de interactividad: estudiante-computador, estudiante-profesor, estudiante-contenido, estudiante-estudiante, estudiante-institución. 
b. Mapa de Navegación

El mapa de navegación de las unidades que conforman VECTOR SOFT consistió en representar las rutas o caminos a seguir el usuario en el software, a través de la navegación de una pantalla a otra que facilita el acceso a la información según el con el contenido que el usuario desee interactuar. Dicho mapa está basado en una estructura jerárquica.


Figura 2. Diseño navegacional del sistema.
Fuente: Elaboración de los autores

La primera pantalla figura 3, muestra el emblema de metáfora del juego, que es juguemos con los vagones del tren. Siendo el tren un emblema apropiado para simular la interacción de un vector.

Figura 3. Pantalla Inicio
Fuente: Elaboración de los autores
La segunda pantalla figura 4, muestra el logotipo del grupo de desarrolladores y el de la institución educativa donde se tiene acción los integrantes del grupo. Además en esta institución Educativa Antonio José Camacho es donde se realizará la muestra de software.


Figura 4. Pantalla inicio y publicidad.
Fuente: Elaboración de los autores
La tercera pantalla figura 5, muestra una introducción de bienvenida que se le hace a los estudiantes interesados en el aprendizaje de los vectores.

Figura 5. Pagina Bienvenida.
Fuente: Elaboración de los autores
La cuarta pantalla figura 6, muestra el tipo de vector con el cual vamos a interactuar sea numérico, de palabras o de caracteres.

Figura 6. Pantalla Menú tipo de vector
Fuente: Elaboración de los autores
La quinta pantalla figura 7, muestra la selección de los vagones que representan el tamaño del vector y da como resultado la cantidad de vagones.


Figura 7. Pantalla Menú cantidad vagones.
Fuente: Elaboración de los autores
La sexta pantalla figura 8, muestra el resultado final de las pantallas seleccionadas anteriormente, es decir, si se escogió números se puede hacer sumas con las posiciones del vector, si escoge palabras estas se pueden ordenar alfabéticamente, y si se escogió caracteres se puede unir y ordenar alfabéticamente.

Figura 8. Pantalla Resultado.
Fuente: Elaboración de los autores

Fase III: Desarrollo

Considerando la estructura de las pantallas que conforman el software educativo VECTOR SOFT, se procedió a una serie de formas para mostrar el funcionamiento general del mismo, conforme a las especificaciones de la fase de Diseño. Teniendo en cuenta los requerimientos planteados en la asignatura de investigación multimedia, para el cumplimiento con el objetivo propuesto. 


Fase IV: Producción

La fase de producción contempló la elaboración de los archivos de texto, sonido,  imágenes y animaciones que conforman VECTOR SOFT, los cuales fueron diseñados previamente para luego integrarlos al software utilizando Processing, cumpliendo así con los requerimientos funcionales del software.

Con las herramientas que ofrecen photoshop. También se anima la pantalla con la codificación en java; y para el sonido se utiliza un archivo de sonido MP3. Las producciones fueron creadas con el propósito, y es  el de ofrecer una herramienta interactiva agradable a la vista del usuario.



III. CONCLUSIÓN

Con el desarrollo de un software educativo se contribuye a elevar la calidad de la enseñanza, pues se proporciona una herramienta de aprendizaje que puede ser aplicada por el docente en el marco de las teorías conductista, cognitivista y constructivista. Esto se reafirma con lo expresado por Medina (1995), quien plantea que con el uso de software educativos se podría mejorar el aprendizaje de los estudiantes, ya que éstos despiertan la atención al ver los colores, fotografías, dibujos, así como al escuchar los sonidos, ayudando a la comprensión de la información percibida por medio de la vista y el oído, además de que educa, ayuda al docente en la adquisición de habilidades para dictar las materias; y con lo referido por Araujo (2004), quien afirma que los software educativos elevan la calidad y productividad de los proyectos de estudios de los alumnos, pues permiten la utilización de estrategias motivantes para que el educando desarrolle sus habilidades cognitivas. [2]

La jerarquización del contenido del software educativo permite que el alumno adquiera conocimientos con mayor facilidad a través del uso de multimedia, pues el usuario puede navegar a través de una estructura de pantallas que se forma según la lógica del contenido, pero las rutas de navegación de una pantalla a otra permiten el acceso a la información según el nivel en el cual desee interactuar el usuario. Esto se confirma por las conclusiones arrojadas por González y Vanegas (1998), quienes establecen que todo software educativo ofrece la posibilidad de desarrollar contenidos didácticos motivando al usuario a navegar por el mismo a través de la incorporación de multimedia, los cuales hacen atractiva la relación usuario-máquina.  [2]

Se logró el cumplimiento del objetivo del desarrollo de un software multimedia para el aprendizaje de los vectores, que son un tema fundamental en la programación de los sistemas. Estos nos facilitan un almacenamiento temporal para poder interactuar con una estructura parame trizada y  de vital utilidad en el desarrollo de software.

VECTOR SOFT es una herramienta para el aprendizaje de las matrices unidimensionales (vectores), pues el usuario, al finalizar la navegación habrá adquirido conocimientos por medio de las imágenes, gráficos, sonidos y textos; además, este software permitirá al alumno realizar búsquedas de información que pueden ser beneficiosas al momento de realizar algún tipo de investigación, lo cual contribuiría notablemente en su formación educativa.




BIBLIOGRAFÍA
[1]. Fuentes, L. Mendoza, I. Software educativo para la enseñanza de la biología. Revista ciencias humanas (2.005). Recuperado de http://www.scielo.org.ve/scielo.php?script=sci_arttext&pid=S1012-15872005000200005&lng=en&nrm=iso&ignore=.html.
[2]. Medina, T. Justicia US law. Recuperado de http://law.justia.com/cases/california/cal4th/11/694.html
[3]. Tutorial Processing 2 pvector Recuperado de http://processing.org/tutorials/pvector/