BLOG DE DIEGO ARTURO HERNANDEZ FUENTES
Conceptos básicos de HTML
Un curso que me han recomendado para hacer un blog esta en www.udacity.com.
El curso esta ubicado en esta dirección http://www.udacity.com/overview/Course/cs253/CourseRev/apr2012. Por experiencia debe tener un conocimiento de python. Durante este tiempo lo estoy haciendo, les recomiendo un sistema Windows de buena memoria RAM y excelentes gráficos.
Para practicar con los comandos HTML el profe nos dio una página de referencia para realizar la práctica HTML playground
Antes de saber el contenido del HTML, debemos saber cuales son los comandos de texto plano en HTML. El primer la etiqueta < b > Contenido que pone el "Contenido mas negro como ejemplo: Este texto esta en negrita.
Otra de las etiquetas más usadas en HTML es < em >Contenido< /em> que pone a Contenido en itálica, un ejemplo es: Este texto esta en itálica.
Una mezcla de ambas sería. HTML es sencillo de usar. Con HTML con el enunciado en itálica y usar en negrita.
HTML es sencillo de usar.
Un atributo en HTML tiene un nombre que a su vez tiene un valor. En HTML se escribe de la siguiente manera:
< etiqueta atributo = " ">Contenido< /etiqueta >
Un ejemplo de estos es utlizando la etiqueta a, su función es hacer vínculos a páginas. Un ejemplo es ligar a Google con el atributo href haciendo una referencia al sitio de Google: Sitio de Google.
Otro ejemplo es hacer un vínculo a una imágen que esta en nuestra computadora o en un sitio web, para esto utilizaremos la etiqueta img de utilizando el atributo src haciendo una referencia al directorio o ubicación web de la imagen. un ejemplo es:
Para hacer un simple salto de línea es utlizar la etiqueta < br >. No necesita que se cierre con /. Un ejemplo es:
Este texto esta dando
un salto de linea
Otra forma de dar salto de linea es que se desea escribir un párrafo, terminando de escribir se desea escribir otro, para esto se utiliza la etiqueta <p>...</p> para escribir un párrafo. Como lo has notado este es un párrafo.
El lenguaje HTML
Ahora se mostrará el contenido de un docuemnto HTML:
<!DOCTYPE HTML> //Es la cabacera de HTML
<html> //Aqui se incia la estructura de HTML
- <head> //La cabecera de tu documento
- <title> //El titulo de tu documento
- </title>
- </head>
- <body>
- //Aqui se proyectara en el navegador lo que has escrito, las etiquetas, imágenes, videos, texto, documentos
- </body>
</html>
Concepto de tarea
Es el tratamiento de una unidad de ejecución espacio-tiempoLas tareas se identifican con unos criterios de identificación. Los criterios de identificación son los siguientes:
- Cambio de unidad espacial, entre las siguientes opciones:
- inter organización.
- Manual.
- Automática.
- Mecánica.
- Cambio de recurso. Como una persona, hardware o información.
- Cambio de unidad temporal. Como la existencia de una interrupción o de un punto de espera.
- N°: Es el número de la tarea en la aplicación.
- Nombre de la tarea: Nombre de la tarea, verbo u objeto afectado por la acción.
- Pred: Número predecesor de la tarea.
- Definición: Descripción detallada de la tarea.
- Justificación: Lista de criterios de la identificación de la tarea.
- Naturaleza: Puede ser: manual, interactiva, automática o abstracta.
Cuando un cliente llega a la agencia inmobiliaria, ingresa su solicitud a la secretaria de solicitudes. Indica el tipo de bien que desea renta o comprar, sus restricciones de presupuesto así como las principales características de los bienes que le podrían interesar.
El empleado registra su solicitud, es decir, asocia el perfil del cliente con las variable estándar de comprar de bienes, en caso de ser nuevo cliente se da de alta su perfil en el sistema.
La conclusión del registro de una solicitud lanza de manera automática, para cada variante del perfil del cliente, la impresión de bienes que pudieran ser de su interés y que aún estén disponibles (esta lista describe la ubicación del bien, el precio solicitado y la información de la superficie).
El cliente examina las listas y elimina lo que no le interesa. Si quedan cosas de su interés entonces se le dirige al servicio de visitas.
Para cada bien que le interesa al cliente, se le proporcionan más amplios detalles, mientras otro empleado busca fotografías del bien. Gracias a los detalles extras y las fotos, el cliente puede tener una opinión más amplia del bien. El empleado registra si el cliente esta o no de acuerdo y procede a la visita física del inmueble
Análisis de tareas. Herramientas de identificación de tareas.
Para que una aplicación sea eficiente debe de relizar múltiples tareas. Como por ejemplo:- Ingreso de la solicitud.
- Alta de perfil o cliente.
- La conclusión de registro.
- Examinación de las listas.
- Servicio de visitas.
- Registro si el cliente esta o no de acuerdo.
Modelo de tareas
Describen las actividades del usaurio para alcanzar las metas.
Conocer las tareas necesarias para la consecución de objetivos es fundamental para el proceso de diseño.
El propósito es indicar como las actividades se deben realizar para obtener un nuevo sistema, usable que es apoyado por una nueva tecnología.
Los modelos de tareas pueden ser representados en diferentes niveles de abstraccion:
- Alto nivel: las actividades de las principales tareas.
- Bajo nivel: Actividades que se representan con una granularidad pequeña, todos los detalles.
ConcurTaskTree(CTT)
Es una estructura jerárquica de las tareas. La sintaxis es gráfica, por lo que facilita su uso y compresión. Se está centrado en las actividades del usuario en la aplicación.
Se centra en tres niveles:
- Descomposición de las tareas.
- Definición de las relaciones espacio-temporales de las tareas.
- Asociación de objetos para la ejecución de las tareas.
- La interfaz de usuario.
- Datos de dominio de la aplicación.
- identificador.
- Nombre.
- Categoría.
- Tipo.
- Frecuencia de uso.
- Plataforma donde será usada.
- Anotaciones informales.
- Precondiciones.
Los operadores temporales usados son:
t1>>t2 habilita.
t1 habilita a t2 (cajero).
t1[]>>t2 habilitar mas paso de información.
t1|>t2 suspender/resumir.
poner en pausa la ejecución de una tarea.
t1[]t2 selección determina una opción (toma de decisión).
t1[> deshabilitar.
Util para interrumpir (iteraciones) cancelación.
t1|=|t2 independencia
Secuencial haciendo una tarea se desbloqueo a la otra tarea.
t1* Iteración.
t1{n} iteración finita.
t1|||t2 Paralelismo trabajar varias cosas a la vez(registros o formularios).
T1 |[x]| T2 Concurrencia más paso información.
[T] Opcional.
T Recursión.
Interfaz de usuario CTT
Con este tema se tiene un ejercicio, realizar un modelo de tareas de un cajero autmático:
ATM
Meta: obtener dinero, pagar tarjeta de crédito, consulta de saldo.
Pre-requisitos:
- Tener tarjeta.
- Conocer la cantidad a retirar.
- Conocer número pin.
- Conocer el número de cuenta de tarjeta de crédito.
- Retiro de dinero.
- Tarjeta en mano.
- Comprobante de pago a tarjeta.
- Saldo de la tarjeta.
Reporte de la Feria de Proyectos de la Facultad de Ciencias de la Computación.
Durante la primera semana de septiembre, se realizó en la explanada de la facultad la feria de proyectos, con el fin de ver nuevos proyectos. Ahora se expone tres proyectos interesantes acerca de las aplicaciones web muy interesantes.
El primer proyecto es COCO: Control de Conciertos aplicación web hecha en ASP.net que hace la reservación de boletos de conciertos y de autobuses a conciertos, con un nombre de usuario y contraseña se accede al sistema para que el usuario pueda realizar las reservaciones de boletos a los próximos conciertos y de autobuses.
El segundo proyecto es Musi-k, una aplicación montada a localhost, hecha en HTML, es un sistema que ayuda a la enseñanza del idioma ingles por medio de la música, el usuario accede al sistema y selecciona un categoría entre tres tipos de música. Al seleccionar una opción, el sistema escoge aleatoriamente una canción y la reproduce, en la pantalla aparece tres áreas de texto con la letra de la canción, pero una de ellas esta escrita correctamente, al termino de la canción escoge que letra es la correcta, luego pide el nombre del artista o banda que la canta y el nombre de la canción, al final imprime en pantalla el resultado que obtuvo el usuario.
El tercer proyecto es Webeek, una red social de divulgación académica, la aplicación ya se subió al servidor de la facultad. Este proyecto se trata de una aplicación su interfaz fue hecha con PHP, los servicios y consultas en C#, además implemento Java en el proyecto. El usuario puede hacer publicaciones, copiar vínculos, pero científicos o de divulgación, además compartir documentos. Cuando el usuario escribe una publicación, el servidor busca en esa publicación palabras claves de carácter científico. Hasta puede encontrar las publicaciones acerca del tema o palabra clave que desea buscar. Es un excelente red social para que la comunidad tanto estudiantil y de investigación participen en las ideas y opiniones de cada usuario.
“Frameworks de desarrollo para aplicaciones móviles”
En esta conferencia se habló del uso de los dispositivos móviles y de la importancia en el desarrollo de aplicaciones para estos aparatos que es una de las innovaciones tecnológicas que estamos viviendo en nuestros días y de la demanda que urge en el mercado de desarrollo de aplicaciones.
Puntos destacados.
Se habló de los diferentes frameworks para el desarrollo de aplicaciones móviles, en los que se destaca el software mobl, que es un nuevo y libre lenguaje especialmente designado para construir aplicaciones móviles. Usando el moderno HTML5, mobl ofrece:- Lenguaje conciso para construir lenguaje nativo de aplicaciones web en un instante.
- Gran soporte IDE (Entorno de Desarrollo Integrado) en Eclipse para Wndows, Linux, Mac.
- Guardado y prueba rápido. No necesita compilación, el IDE de mobl compila los módulos siempre y cuando guardas tu aplicación.
Características del lenguaje mobl
El lenguaje integra todos los aspectos de una aplicación web móvil dentro de un simple lenguaje, modelado de datos, interfaz de usuario, aplicación lógica y servicios de estilo y web.La sintaxis de la secuencia de comandos es similar al utilizado en JavaScript.
Tiene un fácil acceso a las librerías nativas de JavaScript y a los widgets.
La compilación genera un JavaScript estático y un archivo HTML, listo para se desplegado en cualquier alojamiento web.
Plataforma.
Genera código HTML5 basado en aplicaciones web.La compilación genera aplicaciones web móviles en HTML5, JavaScript y CSS.
Opera sin conexión de Internet.
La aplicación corre en navegadores web como Google Chrome, Safari.
Interfaces de Usuario.
Concisa y lenguaje textual para la definición de interfaces de usuario.Es una programación recreativa, las interfaces de usuario automáticamente se descargan mediante cambios de estados de la aplicación.
Crea bibliotecas de control personalizado reutilizados.
Características del IDE.
- Basado en Eclipse.
- Una sintaxis destacada.
- Reportación de errores.
- Código completo.
- Compilación y guardado rápido.
Elementos importantes en mi carrera.
- El desarrollo de las aplicaciones móviles, por medio dela ayuda de un framework ayuda a hacer aplicaciones web para móviles y con esto puede que obtenga un trabajo, y es por eso es uno de los campos con más demanda en mercado de desarrolladores.
- El desarrollo de aplicaciones con HTML5 es de mayor demanda por tener las etiquetas para anexar elementos en 2D y en 3D.
- El mundo de la tecnología es lo que hace mover al mundo, y es por eso que estoy ahora interesado de aprender hacer aplicaciones móviles.
Coherencia.
El expositor dio su tema de manera específica, las definiciones de manera sencilla, mostrando las características del software y del desarrollo de aplicaciones sencillas corriendo en el local host de un navegador.La exposición fue presentada bien.
La exposición resulto en verdad de interés para aprender a desarrollar aplicaciones móviles que es lo que demanda en el mercado.
Modelado de procesos
Si has realizado el ejercicio anterior, has notado que tu árbol puede ser extenso.
Ahora dividirás tus tareas en procesos, un proceso es el conjunto de actividades o eventos que se realizan bajo ciertas circunstancias con un fin determinado.
La definición de un proceso indica el ordenamiento de tareas en tiempo, espacio y recursos.
De seguro salio tu duda de: ¿Por qué modelar procesos?
Porque dan soporte a los procesos de negocios cuando son automatizados usando Workflow. Workflow se refiere a los procesos de negocio que pueden ser automatizados. El modelado de procesos usando Workflows permite la definición de tareas de alto nivel.
Workflow define las actividades relacionadas con la ejecución coordinada de múltiples tareas realizadas por los diferentes recursos para lograr un objetivo para lograr un objetivo comercial común.
Los beneficios del modelado de procesos son:
- Adherencia a los procesos modelos
- Representación clara del control de flujo del trabajo. Los cambios realizados no requiere el esfuerzo de codificación.
- Representación clara del envolvimiento de los recursos.
Workflows
Un proceso consta de una serie de tareas que requieren ser ejecutadas, lo que es igual a un procedimiento. Como se ha visto anteriormente, una tarea es la unidad lógica de trabajo que es ejecutada individualmente por un recurso. La ejecución es distinto a la responsabilidad. Concluimos que el orden de las tareas es igual al diagrama de procesos.
Retomando lo que se ha publicado con respecto a las tareas, una tarea en un proceso que representa taras de alto nivel las cuales pueden ser detalladas usando modelo de tareas.
La ejecución de una tarea por un recurso es llamado una actividad.
La definición de un proceso especifica que pasos son requeridos y en que orden deben ser ejecutados. La definición de procesos consiste en:
- Tareas (actividad).
- Una tarea es de alto nivel y se descompone en sub tareas.
- Condiciones (estado, fase o requerimientos).
- una condición es usada para determinar las tareas que están disponibles.
El estado de un caso está determinado por:
- Variables del caso
- Atributos lógicos de caso. Son usados para detectar el caso.
- Condiciones.
- Requerimientos del sistema.
Modelado de los procesos con diagramas de Petri
La notación está basada en los diagramas de Petri, definidos en la década de los 70's. Es un grafo bipartito formado por los lugares, notados por un círculo y las transiciones por rectángulos y una línea significa un arco que une a los lugares con las transiciones.
Las transiciones se cambian de estado al ser ejecutadas. Sólo las transiciones habilitadas pueden ser ejecutadas. Informalmente, una transición está habilitada si todos los estados requeridos para la ejecución contienen al menos un token.
He aquí un ejercicio que resolver:
Modelar una red de Petri para controlar dos semáforos de un cruce, es decir, que el semáforo 1 está en rojo mientras que el semáforo 2 está en verde.
Patrones del modelado de procesos.
- Secuencial. El proceso sigue su rumbo.
- And-split. Ejecuta varias actividades en paralelo, es decir, se ejecutan tareas al mismo tiempo
- And-join. Sincroniza dos hilos paralelos de ejecución.
- XOR-Split. Selecciona una opción de múltiples tareas.
- XOR-Join. Une dos alternativas de ejecución.
- Or-Split. Selecciona muchos caminos de ejecución de muchas opciones.
- Or-Join. Unión de dos o más líneas de ejecución.
YAWL
Para realizar tu modelado de procesos necesitas descargar una herramienta para realizar el modelado de proceso llamado YAWL, este es su vínculo de página inicial http://www.yawlfoundation.org/ y aquí está su link para descargar el sorftware YAWL. Si necesitas ayuda acerca de como usarlo te recomiendo este tutorial YAWL Manual.
La interfaz de usuario de YAWL se muestra a continuacion:
La notación YAWL es identico a los patrones utilizados para el modelado de tareas más los estados del diagrama de Petri. En cierto modo, hace un diagrama de Petri. Los símbolos utilizados son:
Ahora una actividad para ustedes.
Una agencia de viajes ejecuta varias tareas. Primero el cliente es registrado. Después, el empleado busca oportunidades que son comunicadas al cliente. Después el cliente es contactado para determinar si sigue interesado o no en el viaje ysi quiere otras opciones. Hay 3 posibilidades: 1) el cliente no esta interesado, 2) quiere ver mas alternativas, 3) el cliente selecciona una oportunidad.
Si el cliente selecciona un viaje, el viaje es reservado. En paralelo, uno o dos tipos de seguros (seguro de cancelación, perdida de equipaje) se preparan si es del deseo del cliente, puede ser que ninguno. Dos semanas antes del inicio del viaje los documentos son enviados al cliente. Un viaje puede ser cancelado en cualquier momento después de hacer la reservación y antes de que inicie el viaje. Notar que los que no tengan seguro no serán reembolsados.
Asignación de trabajos.
Si estas trabajando, de seguro sabe que tu jefe da dos maneras de órdenes: las directas y las indirectas.
- Directas. Cuando el producto realizado es directamente dirigido al cliente.
- Indirectas. Cuando el trabajo involucra mantenimiento o mejora de los procesos producción, procesos secundarios y terciarios.
Para la asignación de trabajos, se llama director a la persona que asigna la tarea y se le llama Contratista a la persona a la que se le asigna una tarea.
Prototipos
Es un mecanismo de cómo se debe hacer un sistema. Se debe hacer a mano y a papel, debe seguir el análisis del problema y a la identificación de las tareas.
El tipo de prototipo de bajo nivel corresponde a una representación visual de su contenido que planean para la aplicación, como por ejemplo:
- Layout
- Encabezados y pies de pagina.
- Contenido.
- Navegación.
Para el desarrollo de una aplicación se debe tener una cercanía con el cliente para avanzar hacia la dirección adecuada. Dar la oportunidad de visualizar lo que se desea desarrollar
Hoy en día hay software que permiten modelar prototipos, como Visio, Microsoft Power Point (PPT), etc.
Con un software de prototipado web como gliffy poseen una serie de objetos que facilitan el trabajo de desarrollo. He aqui su vínculo para mas información http://www.gliffy.com.
También hay programas que realizan prototipado para dispositivos móviles con objetos interactivos como baqlsamiq http://www.balsamiq.com/ este es su vínculo si están interesados en esto.
También con software de edición de gráficos como Photoshop.
El diseño sirve de base para una aplicación web.
En el mundo de los prototipos hay algunas recomendaciones que deben seguir.
-
- Simplicidad.
Suficientemente simple o detallado para guiar al programador. - El trabajo en escala a grises.
Centrarse en el layout y la funcionalidad sin ser distraído por el diseño. Todo elemento a color deberá ser convertido a grises. - El prototipo o framework en inglés es una representación visual de un mapa de sitio bien hecha.
- Centrarse en los resultados deseados.
Tener una compresión clara de la forma en que los usuarios usarán la aplicación.









0 comentarios:
Publicar un comentario