Diseño de un Sitio Web de apoyo a las asignaturas de Lenguajes y Técnicas de Programación I y II (página 2)

El
problema

Al introducirse esta carrera se me dio la tarea por el
Departamento de Informática del Instituto de impartir las
Asignaturas de Lenguaje y
Técnicas de Programación I y II al curso por encuentros
(CPT).

Al comenzar nos dimos cuenta que era muy difícil
impartir la asignatura por parte del profesor, pero
resultaba más difícil para el estudiante estudiarla
debido a que:

1. La bibliografía brindada no estaba
   adecuada en las posibilidades de obtenerla por la gran
   mayoría de los estudiantes como ocurre en muchas de
   las asignaturas.
2. El contenido de esta materia de
   acuerdo a los programas y
   el espacio de tiempo
   brindado por el programa es
   relativamente breve.
3. Sabiendo del diagnóstico que los estudiantes
   presentaban una base no adecuada para el nivel de partida en
   lógica
   matemática y en el desarrollo
   de algoritmos
   cuyos contenidos son necesarios para la entender esta
   materia.

Solución del
problema

Una vez conocidas estas dificultades decidimos prepara
un material referente a estas asignaturas y presentarlo en un
sitio Web el cual permitió facilitarle la
bibliografía adecuada a los estudiantes sirviendo como un
medio de enseñanza, así como ahorrar tiempo
durante mis clases y dedicarlos a trabajar las debilidades
detectadas en el diagnostico, así como ahorrar tiempo
durante las clases y dedicarlo a profundizar el tema de lógica
matemática
y a su vez realizar ejemplos prácticos que profundicen
el
conocimiento de estas temáticas .

Requerimientos del
sistema

Para utilizar el sistema se
necesitan los siguientes requerimientos:

Hardware:

Computadora: Pentium 2 y o
equivalente o superior con conexión a una red y un quemador de
CD en los
Servidores
donde esté el sitio para poder
facilitar la información a aquellas personas que no
tengan conexión.

Software:

1- Internet
Explorer versión 5 o superior o cualquier otro
explorador de Internet equivalente (no
Mozlla Firefox ya que este no abre las aplicaciones de Visual Basic)
para acceder a todo el Sitio Web.

2- Microsoft
Office 2000
con Access 2000
para poder abrir el ejemplo que se da en forma demostrativa como
vemos en la figura:

3-Microsoft Visual Basic 6.0
o superior con los componentes de la base dato activados
para poder ver el ejemplo dado como se muestra en la
figura:

Diseño de la
aplicación informática

"El éxito
de los proyectos de
desarrollo de aplicaciones o sistemas se debe
a que sirve como enlace entre quien tiene la idea y el
desarrollador. El UML ( Lenguaje
Unificado de Modelado) es una herramienta que cumple con esta
función, ya que le ayuda a capturar la idea
de un sistema para comunicarla posteriormente a quien esté
involucrado en su proceso de
desarrollo; esto se lleva a cabo mediante un conjunto de símbolos y diagramas. Cada
diagrama tiene
fines distintos dentro del proceso de desarrollo"
(4).

Para el diseño
del sitio web nos basamos en la teoría
de diseño de software de los libros
"Aprendiendo UML en 24" horas de Joseph Schmuller en la
edición
en español,
el libro "UML
y Patrones. Introducción al Análisis y Diseño Orientado a
Objeto" de Craig Larman en la edición en
español y el Libro "UML with Rational Rose 2002" de
Wendy Boggs y Michael Boggs .Según estos autores y las
demás bibliografías referente al tema existe una
serie de metodologías para representar un diseño de
software como son el Modelo
tradicional o de Cascada y el Modelo en Espiral de los cuales no
nos vamos a referir en este trabajo,
solamente iremos a una de las metodologías mas usadas en
elaborar sistemas educacionales a distancia (e-Learning)
usando las nuevas
Tecnologías de la Información y las Comunicaciones
es el Modelo de proceso de negocio usando diagramas de actividad
o IDEF.

Modelo de proceso de negocio usando diagramas de
actividad o IDEF.

La traducción literal de las siglas IDEF es
Integration Definition for Function Modeling (Definición
de la integración para la modelación de
las Funciones). IDEF
consiste en una serie de normas que
definen la metodología para la representación
de funciones modeladas.

 La metodología IDEF proporciona un marco de
trabajo para poder representar y entender los procesos,
determinando el impacto de los diferentes sucesos y definiendo
como los procesos interactúan unos con otros
permitiéndonos identificar actividades poco eficientes o
redundantes. En esta metodología se usa la tecnología de
Workflow la cual tiene como objetivo
describir los procesos de una organización y consiste de actores del
negocio y casos de uso del negocio y el resultado es un modelo de
caso de usos del negocio. Para representar modelos de
casos de uso del negocio, nosotros usamos como
software el Rational Rose.

La metodología wordflow para representar un
software propone lo siguiente:

• Modelo del Negocio (Modelo UML usando notación
  IDEF)
• Casos de Uso del Negocio
• Modelo conceptual de los Casos de Uso del
  Negocio
• Diagrama de transición de estados
• Diagrama de Secuencia
• Diagrama de componentes.

Modelo
del Negocio del Sitio Web de Lenguaje y Técnicas de
Programación I y II (Modelo UML usando notación
IDEF)

Los principales actores implicados en este proceso se
reflejan a continuación:

1. Prof del Dpto de Informática
2. Administrador de red de transmisión de
   datos:
3. Usuarios (Estudiante, Profesional de la
   Informática o Población en general
   interesada):

Para darle solución a nuestro problema de acuerdo
a los actores implicados, se utilizará la notación
IDEF.

"La misma se conforma de actividades, entradas, salidas,
mecanismos de control y
sujetos.

Cada actividad se representa con un
rectángulo cerrado. Las actividades deben tener de manera
obligatoria Entradas y Salidas y de manera opcional Mecanismos de
Control y Sujetos que realizan la actividad.

Una entrada se representa como una
conexión que entra a la actividad por la
izquierda.

Una salida se representa como una conexión
que sale de la actividad por la derecha.

Un mecanismo de control es una conexión
que entra a la actividad por la parte superior.

Un sujeto se representa por una conexión
que entra a la actividad por la parte inferior"
(4).

Seria lo siguiente:

Siguiendo lo explicado anteriormente para nuestro sitio
nuestro modelo del negocio es que se muestra en la figura 1
:

Casos de Uso del Negocio para el Sitio web Lenguaje y
Técnicas de Programación I y II

Los actores y casos de usos se representan como se
muestra en la figura 2.En nuestro problema los actores del
negocio son los sujetos que realizan las actividades en el sitio
Lenguaje y Técnicas de Programación I y II . Los
casos del negocio son cada una de las tareas o actividades
previstas en el Sitio. Es necesario posteriormente reunir
aquellas actividades que son realizadas por el mismo
sujeto(actor), a fin de encapsular, de manera abstracta el caso
de un actor. De esta forma definimos que un caso de uso de
negocio es la lista de actividades realizadas por un mismo actor
de negocio. Por lo que nuestro trabajo sería como se
representa en la Figura 3 .

Figura 1 : Modelo de procesos de
negocios de
Sitio web de Lenguajes y Técnicas de Programación I
y II

Figura 2 : Simbología para la
representación de Casos de Uso del Negocio.

Figura 3 : Casos de Uso del Negocio de
Sitio web de Lenguajes y Técnicas de Programación I
y II.

Modelo conceptual de caso de uso del negocio
para el Sitio web de Lenguaje y Técnicas de
Programación I y II :

Los casos de uso se emplean para valorar el comportamiento
deseado del sistema que está en desarrollo, sin tener que
especificar cómo se implementa dicho
comportamiento.

Un caso de uso en el modelo conceptual se describe un
proceso de principio a fin, es decir una secuencia de eventos, las
acciones y las
transacciones que se requieren para realizarlo, en este caso
describo, las principales acciones de los actores del Lenguajes y
Técnicas de Programación I y II.

Prof del Dpto de Informática:
Confeccionan, diseñan y aprueban el sitio de Lenguaje y
Técnicas de programación I y II , planifica todas
las actividades asociadas al sitio. Intercambia mensajes con los
demás actores Elabora materiales
didácticos (impreso o digital) de apoyo al sitio .Busca y
selecciona la información y los datos del sitio referente
al tema. Evalúa la Información realizando
diagnostico para después valorar los resultados. Mantiene
la Información del sitio actualizada

Administrador de red de transmisión de
datos: Organiza y gestiona los recursos de la
infraestructura computacional. Instrumenta la política de seguridad del
sistema y de cada actor del sistema asignándole a cada uno
de estos los permisos correspondientes y acceso a las diferentes
facilidades del sitio de Lenguaje y Técnicas de
programación I y II y de Internet. Intercambia mensajes
con los demás actores del proceso. Publicar el Sitio en la
PC (servidor) y en el
Portal Web del mismo y mantiene la conectividad al
sitio.

Usuarios (Estudiante, Profesional de la
Informática o Población en general interesada):
S le realiza un diagnostico referente a la materia. Se registra
en el sitio de Lenguaje y Técnicas de Programación
I y II si se conecta por la red a distancia o copia en un CD si
esta presencial. Accede a los materiales didácticos
(lecciones, bibliografía necesaria y de consultas,
mapa
conceptual) a través de la conexión en
línea o se lleva estos materiales copiados cuando esta
presencial, divulga los materiales y la información del
sitio necesaria para obtener los conocimientos de la asignatura.
Intercambia mensajes electrónicos con los Prof del Dpto de
Informática , y el administrador de
la red. Colabora con el desarrollo del sito al plantear sus dudas
y enviar sus recomendaciones.

A partir modelo conceptual o diagrama de la estructura
estática de la aplicación, se puede
obtener el Diagramas de Clases que es el resultado gráfico
de dicho modelo conceptual. El Diagramas de Clases se obtiene a
partir de las entidades informativas relacionadas en las
entradas, salidas y mecanismos de control del workflow por lo
para nuestro casos es el que se muestra en la figura
4.

Figura 4 : Diagramas de Clases de
Sitio web de Lenguaje y Técnicas de Programación I
y II.

Diagrama de
transición de estados para el actor profesor en el Sitio
web de Leguajes y Técnicas de Programación I y II
.

"El Diagrama de Estados de un sistema ilustra la manera
en que el actor de sistema interactúa con los eventos en
su caso de uso, y cómo obtiene respuestas del sistema ante
dichos eventos. También enfoca el aspecto de
presentación del sistema, mostrando todos los estados
perceptibles al actor desde un estado dado"
(5) .

"Los estados por los que pasa el actor dentro del caso
de uso concebido para el mismo se pueden identificar partiendo de
la definición: Un caso de uso no es más que
una serie de eventos desde la perspectiva de usuario "
(5).

El analista debe tratar de recrear el proceso que dio
origen al caso de uso, a fin de cumplir con el principio de la
facilidad de uso para el actor.

De esta forma, cualquier evento del actor se
deberá enmarcar dentro de las actividades del proceso que
dicho caso de uso apoya informativamente. En nuestro problema un
ejemplo de diagrama de transición de estados es el que se
muestra en la figura 5

Figura 5 : Diagrama de
Transición de Estados para el actor profesor en el Sitio
web de de Leguajes y Técnicas de Programación I y
II .

Diagrama de Secuencia del actor profesor de
informática

"Representa las interacciones de un actor con sus casos
de usos , ordenadas en una serie temporal que muestra el ciclo de vida
de cada actor" (6).Para el actor profesor de
informatica es como se muestra en la figura 6.

Figura 6 : Diagrama de secuencia para
el actor profesor de informática en el Sitio web de de
Leguajes y Técnicas de Programación I y II
.

Diagrama
de componentes.

El diagrama de componentes muestra la
organización y las dependencias entre un conjunto de
componentes. Cubren la vista de la implementación
estática y se relacionan con los diagramas de clases ya
que en un componente puede existir una o más clases,
interfaces o colaboraciones Un componente es una parte física y reemplazable
de un sistema que conforma un conjunto de interfaces y
proporciona la implementación de dicho
conjunto.

El componente representa típicamente el
empaquetamiento físico de diferentes elementos
lógicos como clases e interfaces. Los diagramas de
componentes cubren la vista de implementación
estática y se relacionan con los diagramas de clases ya
que un componente suele tener una o más clases e
interfaces.

Los diagramas de componentes sirven para ilustrar la
organización del sistema desarrollado, en cuanto a
ejecutables y las DLL que los componen. Para nuestro sitio
proponemos el siguiente diagrama de colaboración como se
muestra en la figura 7.

Figura 7 : Diagrama de
colaboración del Sitio Sitio web de Lenguaje y
Técnicas de Programación I y II.

¿Cómo se explica el mismo ?

Los actores del sistema Usuarios (Estudiante,
Profesional de la Informática o Población en
general interesada) interactúan con las paginas del
sitio o sea sus casos de usos (Procesamiento) y a través
del mismo pueden comunicarse con diseñadores del mismo y
el administrador de la red Administrador de red de
transmisión de datos y Prof del Dpto de
Informática con el fin de ir actualizando y mejorando
el sitio. Veamos esto con el diseño algunas de las
ventanas del sitio pero antes veamos como nos quedaría
el diagrama de despliegue mostrado en la figura 8 de nuestro
diseño implementado en el Rational Rose

Diagrama de Despliegue

El diagrama de despliegue, representa la
configuración de los nodos de procesamiento en tiempo de
ejecución y los componentes que residen en ellos. Muestran
la vista de despliegue estática de una arquitectura y se
relacionan con los componentes ya que, por lo común, los
nodos contienen uno o más componentes.

Figura 8: Diagrama de despliegue del
diseño del Sitio web de Lenguaje y Técnicas de
Programación I y II implementado en el Rational Rose
.

Diseño de ventanas.

Se muestran a continuación el diseño de
dos ventanas, en la figura 9 Ventana de autenticación para
entrar al sitio web del Lenguaje y Técnicas de
Programación I y II en línea, que es donde el
usuario autentifica

Figura 9: Ventana de
autenticación para entrar al sitio web del Lenguaje y
Técnicas de Programación I y II en
línea

¿Que es lo que hace cualquier actor del sistema
en la ventana de autenticación para entrar al sitio web
del Lenguaje y Técnicas de Programación I y II
?

Para responder esto veamos la siguiente tabla1 "Interacción entre los actores Usuarios
(Estudiante, Profesional de la Informática o
Población en general interesada) y el sistema en la
ventana de autenticación para entrar al sitio web del
Lenguaje y Técnicas de Programación I y II" .
También los actores pueden comunicarse con
diseñadores del mismo y el administrador de la red al
hacer clic en el icono de contacto.

Tabla1 "Interacción entre los actores Usuarios
(Estudiante, Profesional de la Informática
o

Población en general interesada) y el
sistema en la ventana de autenticación para entrar al
sitio web del Lenguaje y Técnicas de Programación I
y II" .

Para caer en esta segunda ventana Figura10 los actores
del sistema Usuarios (Estudiante, Profesional de la
Informática o Población en general interesada)
tiene que hacer clic en una opción de menú y
seleccionarla. De manera que la Tabla 2 "Interacción entre
los actores Usuarios (Estudiante, Profesional de la
Informática o Población en general interesada)
y el sistema sitio web de Lenguaje y Técnicas de
Programación I y II".

Figura 10: Ventana del Portal del
sitio web de Lenguaje y Técnicas de Programación I
y II.

Tabla 2 "Interacción entre los
actores Usuarios (Estudiante, Profesional de la
Informática o Población en general interesada) y
el sistema sitio web de Lenguaje y Técnicas de
Programación I y II" .

Descripción de la
aplicación

Este sitio web consta con un menú de opciones
como se ve en ventana de acceso al contenido del sitio web de
Lenguaje y Técnicas de Programación I y II que se
muestra en el diseño en el mismo. Este sitio lo hemos
estudiado desde una posición pedagógica siguiendo
el programa de las asignaturas donde la primera parte del
menú (izquierda) es la parte metodológica o sea el
programa, el contenido está en el centro y la
bibliografía a la derecha .En este menú de opciones
se seleccionan las siguientes opciones

Programa

Se despliega el menú y el usuario puede
seleccionar uno de los dos programas que al hacer clic encima de
uno muestra en la ventana de la izquierda una series de opciones
que al elegir una de ellas le van explicando las
característica de la asignatura de acuerdo a su programa.
Este funcionamiento es el mismo para todas las opciones del
menú.

Tolbook

Muestra el contenido de una clase de
tolbook

HTML_WEB

Muestra el contenido de las clases de HTML_Web y algunos
ejercicios propuestos y resueltos.

Access

Muestra el contenido de las clases de Access y el
enunciado de un ejemplo con su solución.

Visual_Basic

Muestra el contenido de la clase de Visual Basic y el
enunciado de un ejemplo con su solución.

Prueba y puesta en marcha del sistema

Este sistema fue utilizado durante la impartición
de la asignatura Lenguaje y Técnicas de
Programación I y II en el Instituto Superior de Ciencias
Medicas DR: Serafín Ruíz de Zarate Ruíz por
parte de los estudiantes de 3er año de la carrera Gestión
de la Información de Salud en el curso 2005-2006,
con el cual logramos resultados aceptables. El mismo fue usado
como un medio de enseñanza

Factibilidad: técnica, económica y
operativa

Como hemos dicho anteriormente la Educación a
Distancia se impone con la universalización de
nuestras universidades. Dado lo poco accesible que esta
bibliografía por parte de los estudiantes se pensó
en este trabajo de manera que el mismo ayudara a la
compresión de esta materia .Este trabajo fue dirigido a
todos los estudiantes y trabajadores que estudien o imparta la
asignatura o cualquier persona que este
interesado en esta materia, por lo que sirve de material
bibliográfico muy útil para impartir o estudiar
esta materia de las asignaturas de Lenguaje y Técnicas de
Programación I y II que se imparte en la carrera de
Gestión de la Información de la Salud de nuestras
universidades medicas. Puede ser divulgado o utilizado a
través de la red si se tiene conexión o
través de un CD si no se tiene conexión a la red.
En nuestro instituto se trabaja para que el sitio se actualice y
brinde más información y más ejemplos de
manera que el mismo se valla perfeccionando al mantener una
comunicación con los usuarios.

CONCLUSIONES

1. Una vez más se puede reafirmar que en la nueva
   era de la Información y el Conocimiento, las TIC
   constituyen la principal herramienta para la difusión,
   promoción, intercambio y aprendizaje de
   cualquier materia y en cualquier esfera de la sociedad.
2. La elaboración de este Sitio Web de Lenguaje y
   Técnicas de Programación I y II" nos dará
   solución en gran medida al problema propuesto, pero
   además, puede llegar a convertirse en una herramienta
   pedagógica de intercambio científico a nivel
   global.
3. Los profesores universitarios de las Ciencias
   Médicas contarán con una herramienta efectiva
   como material de apoyo en la enseñanza y aprendizaje de
   las asignaturas de Lenguaje y Técnicas de
   Programación I y II" en la carrera de Gestión de
   Información de Salud .
4. Los profesionales y técnicos de la salud en la
   carrera de Gestión de Información de Salud
   podrán contar con un material de apoyo que les facilite
   consultas y estudios dentro de su perfil de trabajo,
   relacionados con este tipo de especialidad.
5. Tanto los estudiantes de pregrado y postgrado
   podrán acceder y contar con un material de apoyo eficaz
   en consultas y estudios individuales, donde puedan encontrar
   materiales científicos y pedagógicos actualizados
   que les ayuden a profundizar en los conocimientos adquiridos
   sobre esta materia.

Recomendaciones

2. Utilizar las Tecnologías de Información
   y el Conocimiento durante el proceso de
   Enseñanza-Aprendizaje por todo el personal
   docente, así como los estudiantes y profesionales de la
   salud, particularmente los del ISCM Villa Clara.
3. Utilizar este Sitio Web de Lenguaje y Técnicas
   de Programación I y II" por todo el personal de la salud
   durante la impartición, difusión o
   promoción del conocimiento dentro de la carrera de
   Gestión de Información de Salud.

Referencias
Bibliográficas

1. Valdés Pardo, Víctor Giraldo. CONFERENCIA:
   "Consideraciones sobre las características deseables en
   los sistemas educacionales soportados en tecnologías de
   la información y la
   comunicación". Simposio
   Internacional de Tele-Educación y formación
   contínua. UCLV. Año 2002.
2. Llanusa Ruiz, Susana Beatriz y Col. Articulo: Las
   tecnologías de información y comunicación
   y la gestión
   del conocimiento en el sector salud.
3. Schmuller, Joseph. "Aprendiendo UML en 24 horas.
   PEARSON Educación, México, 2000
4. García Pérez, Ana María. Curso
   de Postgrado "Modelado de Procesos de Negocio y su
   relación con la concepción de sistemas
   informáticos, Octubre 2004
5. Jacobson, Ivar "Object Oriented Software Engineering:
   A use case driven approach". Wesley, Addison. 1992.
   Similar encontrado en:
   http://www.informit.com/bookstore/product.asp?isbn=0201544350&rl=1

6. García Pérez, Ana María.
   CONFERENCIA: "Diagrama de interacción de objetos.
   Diagramas de Secuencia. Diagramas de
   Colaboración"
7. .Asignatura : "Análisis y Diseño de
   Sistemas Informáticos".Maestría Nuevas
   Tecnologías de la
   Educación a Distancia UCLV.

Bibliografía Consultada

1. Schmuller, Joseph .Aprendiendo UML en 24
   Horas. PEARSON Educación, México,
   2000
2. Larman ,Craig .UML y Patrones. Introducción al
   Análisis y Diseño Orientado a objetos .PEARSON
   & PRENTICE may
3. Booch, Rumbaugh, Jacobson "El lenguaje
   Unificado de Modelado" Ed. Addison Wesley –Madrid
   2001
4. Booch, Rumbaugh, Jacobson "El lenguaje Unificado de
   Modelado – Manual de
   Referencia "Ed. Addison Wesley – Madrid 2001
5. Booch, Rumbaugh, Jacobson "El Proceso Unificado de
   Desarrollo de Software" Ed. Addison Wesley – Madrid
   2001
6. Boggs, Wendy& Michael. Mastering UML with
   Rational Rose 2002.Copyright 2002 SYBEX Inc, 1151 Marina
   Village Parkway, Alameda, CA 94501.
7. Martínez, A. Canós, J. H.,
   García J. D. (2001) Estado del Arte en
   Modelado y Ejecución de Procesos
   Interorganizacionales. Universidad Castilla la Mancha,
   España. En:
   http://www.info-ab.uclm.es/descargas/thecnicalreports/DIAB-01-06-21/diab-01-06-21.pdf
8. Notación IDEF para el modelado de
   procesos: www.vico.org/TRADcontenidoCD.pdf
9. Booch, G., Rumbaugh, J., Jacobson, I. Guía de
   la Notación del UML. Versión 1.0.
   13-Ene-97
10. Capability Maturity Model for Software (CMM):
    www.sei.cmu.edu/cmm/
11. Norma ISO
    9000:2000, Norma ISO 9001:2000,
    Norma ISO
    9004:2000:
    www.sct.gob.mx/direccion_gral/uac/gescalidad/iso/textoiso.htm

Autor

Roberto Estevez Solano

Categoría Científica: Ingeniero en
Control Automático

Categoría Docente: Profesor Instructor de
Informática

Natural de la ciudad de Placetas provincia Villa Clara
en Cuba. Nacido
el 12 de Mayo de 1968. Hijo de Ricardo Gabriel Estevez
Domínguez y Caridad Solano Hernández.

Educación Primaria:

En el CAI Benito Juárez:Escuela
primaria Benito Juárez de 1ro
-3ro.

En Placetas : Escuela primaria Enrique Hard
Dávalos 3ro-6to

Educación Secundaria:

En Placetas : ESBU "13 de Marzo"

Educación Pre-universitaria
(bachiller):

En Placetas : Facultad Obrera Campesina (FOC
)10mo y 12mo. Rodolfo León
Perlacia.

En Santa Clara:Facultad Obrera Campesina (FOC
)11no. Genaro López Soto