GUÍA DIDÁCTICA PARA LA GESTIÓN DE PROYECTOS Cod. ADSI-P01-AP0601

Transcripción

1 4.3 ACTIVIDAD DE APRENDIZAJE 3: la AA 6.3: Nombre de la Actividad de Aprendizaje 6.3: Resultado de aprendizaje relacionado al desarrollo de la actividad: CONSTRUIR LAS INTERFACES DE USUARIO DEL SISTEMA DE INFORMACIÓN Construir la interfaz de usuario, apoyado en la evaluación del prototipo, determinando las entradas y salidas requeridas en el diseño y definiendo los lineamientos para la navegación, de acuerdo con las necesidades del usuario. Estrategia de Aprendizaje: Comunicarse en tareas sencillas y habituales que requieren un intercambio simple y directo de información cotidiana y técnica. Buscar de manera sistemática información específica y detallada en escritos en inglés, mas estructurados y con mayor contenido técnico. El diseño de aplicaciones web consiste en presentar servicios a través de internet con la incorporación de diversos tipos de tecnologías, para ser visualizadas a través de navegadores. Algunas de las posibles tecnologías a considerar incluyen la utilización de lenguajes de programación del lado del servidor tales como JSP (Java Server Pages), PHP (Hipertext Preprocesor) o ASP (Active Server Pages); herramientas para creación de páginas automáticas o a partir de la implementación de textos en HTML y JavaScript entre otros. La información relacionada con el uso de HTML5, Javacript y CSS3 se presenta en los materiales de estudio, los cuales se le invita a explorar y a revisar con detenimiento los ejemplos presentados. Para llevar a la práctica los conceptos presentados se desarrollará el laboratorio 14, el cual le ayudará en la comprensión de la estructura básica y las zonas de una interfaz con HTML5, así como a incluir CSS en páginas web de acuerdo con los ejercicios planteados. Posteriormente se desarrollarán algunas de las interfaces gráficas requeridas para el Sistema de Información, las cuales deberán aplicar los conceptos vistos. El concepto usabilidad demanda al desarrollador, esfuerzos orientados para que toda persona independiente de algunas limitaciones, pueda acceder y beneficiarse cómodamente de los contenidos del programa objeto. Esto es asunto de responsabilidad social. La usabilidad de los objetos construidos desde la 23

2 perspectiva ética se presenta como material de estudio y se le invita a explorarlo y reflexionar acerca de los elementos que presenta. Complementa su lectura una actividad orientada a identificar errores comunes fácilmente detectables en algunos programas o sitios web para así evitarlos en los diseños propios. Se suministra además el objeto Oral Communication in English como complemento a la parte técnica, el cual debe ser explorado y se le recomienda prestar especial atención a todos los aspectos presentados sobre una correcta pronunciación, además, se le solicitará completar un test personal en inglés, escrito y oral, basado en un texto asignado, teniendo en cuenta que en este momento de su proceso formativo usted debe estar en capacidad de comunicarse en tareas sencillas y habituales que le permitan evidenciar su progreso en las competencias del manejo del idioma; también deberá sustentarlo en un encuentro sincrónico acordado con su tutor el resultado del test. Relacionado con el manejo del vocabulario técnico deberá desarrollar un cuestionario en inglés, relacionado con HTML5, puesto que este programa requiere de conocimientos específicos de vocabulario técnico, que es utilizado durante toda la etapa formativa y es de mucha importancia para su futuro desempeño como tecnólogo en Análisis y Desarrollo de Sistemas de Información. En resumen, en esta actividad de aprendizaje usted deberá: Fundamentarse y ampliar sus conocimientos acerca de: * Uso de HTML5, javascript y CSS para la construcción de la interfaz gráfica * Comunicación Oral en Inglés * Usabilidad Desarrollar las actividades planteadas en el laboratorio de HTML5, de acuerdo con las especificaciones planteadas para cada ejercicio. Construir las interfaces de Usuario necesarias para el sistema de información utilizando las tecnologías presentadas en los materiales de estudio. Participar en un encuentro sincrónico, donde sustentará los resultados del test en inglés. Realizar un diagnóstico de usabilidad de diferentes sitios web. Construir las evidencias requeridas y hacer un proceso de autoevaluación verificando que cumplan con los requerimientos solicitados, utilizando para ello el instrumento de evaluación proporcionado. 24

3 Finalmente, publicar las evidencias en la plataforma virtual de aprendizaje con el fin de que sea evaluada por el instructor o equipo de instructores que apoyan la ejecución del proceso. Como resultado de esta evaluación recibirá la información que le permita retroalimentar en el proceso y hacer una reflexión sobre los logros alcanzados. Ambiente(s) requerido para el desarrollo de la actividad de aprendizaje: Plataforma Virtual de Aprendizaje del Servicio Nacional de Aprendizaje SENA, disponible en: Material y Bibliografía: Objeto de Aprendizaje: Introducción al diseño web usando Lenguaje de Marcación de Hipervínculos -HTML5 Objeto de Aprendizaje : Oral communication in English Objeto de Aprendizaje : Usabilidad del bien, visión ética Nota: Las ubicaciones de los materiales y bibliografía mencionada están descritas en el punto 3 (material de consulta) de esta guía. Bibliografía complementaria: W3Schools.com. Tutoriales de HTML5 disponibles en: com/html/default.asp Vargas Ferenk (2012), HTML5Tutoriales.com. Tutoriales de HTML5 y CSS3 disponible en: Bloomingdale. Código de conducta de los profesionales y la usabilidad. (10 de 2005). Disponible en CoC_Spanish.pdfColl, J. C. (02 de 11 de 2008). Contribuciones a las ciencias sociales. Recuperado el 12 de 10 de 2013, de Desarrolloweb.com. (s.f.). Recuperado el 14 de 10 de 2013, de desarrolloweb.com/articulos/1133.phpnsu. (s.f.). Gauchat, Juan Diego. (2012). El gran libro de HTML5, CSS3 y Javascript (1ª. Ed). Barcelona, España: Ediciones técnicas Marcombo. 25

4 Instructor(es) responsable(s) de la actividad: Para revisar el equipo ejecutor de este programa de formación debe consultar el documento denominado Equipo ejecutor de la Ficha.pdf ubicado en vinculo de Información del curso EVIDENCIAS asociadas a la AA 6.3: EVIDENCIA 1: Tipo de Evidencia Producto entregable: Forma de entrega: Desarrollo de interfaces gráficas usando HTML5 Desempeño Conocimiento Producto X Desarrollar los ejercicios propuestos en el laboratorio 14, donde se presentan diseños de formularios Web con unos conceptos particulares para dos sitios, el primero relacionado con un Centro Veterinario y el segundo con una Entidad Financiera, los cuales se proponen para su elaboración aplicando los conceptos presentados en los materiales de estudio. Dentro de las características a implementar, están la construcción del logo, la inclusión de artículos relacionados con el negocio y la aplicación de los elementos básicos en un diseño web como lo son la barra de navegación, hipervínculos, formularios y pie de página. Los archivos generados por cada una de los sitios web construidos deberán comprimirse con subcarpetas que incluyan los archivos.html,.css y las imágenes necesarias para su correcta ejecución. Carpeta comprimida con subcarpetas (una subcarpeta por cada ejercicio) con los respectivos archivos.html,.css, e imágenes para su ejecución. El Archivo solicitado, deberá enviarse a través de la plataforma tecnológica del ambiente Virtual de Aprendizaje en el vínculo correspondiente a la Evidencia 1: Desarrollo de interfaces gráficas usando HTML5, de la actividad de aprendizaje 6.3: Construir las interfaces de usuario del sistema de información. Este vínculo está disponible en la opción del menú del curso Actividades, en la ruta: 26

5 Carpeta del Proyecto: Diseño y construcción de software a la medida para el sector empresarial. Forma de entrega: Criterios de Instrumento de EVIDENCIA 2: Tipo de Evidencia * Subcarpeta Fase del proyecto: Diseño. * Subcarpeta de la Actividad de Proyecto 6 * Subcarpeta Actividad de Aprendizaje 3 Construye interfaces gráficas para sitios web, aplicando HTML5 y CSS3 de acuerdo con los requerimientos presentados. Lista de Chequeo Construcción de la Interfaz Web para el proyecto de formación Desempeño Conocimiento Producto X De acuerdo con el contexto del Sistema de Información a desarrollar, los módulos definidos para el sistema y los mockups planteados para la interfaz gráfica de usuario presentados en la fase de Diseño y que fueron validados por el tutor, construir la interfaz gráfica Web para su proyecto de información aplicando HTML5 y CSS3. La interfaz debe incluir los siguientes aspectos: Determinación de áreas de trabajo Logo de la aplicación Determinación de tipografía y paleta de colores Barra de navegación Mapa del sitio Acceso a la aplicación Formularios implementados 27

6 Producto entregable: Forma de entrega: Criterios de Instrumento de Se debe generar un documento donde se presenten en forma gráfica todos los ítems solicitados identificando para los formularios, los requerimientos o casos de uso asociados. Los archivos generados y requeridos para la ejecución de la aplicación, así como las imágenes y demás archivos, deben comprimirse y enviarse al tutor para su correspondiente evaluación. Archivo con el documento en formato.pdf que presenta las imágenes de la implementación de la interfaz gráfica. Carpeta comprimida con las subcarpetas que contienen los respectivos archivos.html,.css, e imágenes requeridas para su ejecución. Los archivos solicitados, deberán enviarse a través de la plataforma tecnológica del ambiente Virtual de Aprendizaje en el vínculo correspondiente a la Evidencia 2: Construcción de la Interfaz Web para el proyecto de formación, de la actividad de aprendizaje 6.3: Construir las interfaces de usuario del sistema de información. Este vínculo está disponible en la opción del menú del curso Actividades, en la ruta: Carpeta del Proyecto: Diseño y construcción de software a la medida para el sector empresarial. * Subcarpeta Fase del proyecto: Diseño. * Subcarpeta de la Actividad de Proyecto 6 * Subcarpeta Actividad de Aprendizaje 3 Desarrolla la interfaz gráfica del sistema de información aplicando las herramientas tecnológicas sugeridas y de acuerdo con el diseño definido. Lista de chequeo EVIDENCIA 3: Tipo de Evidencia Encuentro What is your Weekday s Routine? Desempeño X Conocimiento Producto 28

7 Después de responder por escrito el test relacionado con las actividades que desarrolla normalmente durante los días de semana; es decir de lunes a viernes, incluyendo las familiares, educativas y sociales, con respuestas completas, requiere profundizar los conceptos sobre pronunciación, fonética y fónica que se encuentran en el Objeto de Aprendizaje: Oral Communication in English The Achievable challenge-, con el fin de participar en el encuentro sincrónico. Answer according to your own experience: 0. What time do you wake up? I usually wake up at 5:00 o clock. 1. What time do you get up on weekdays? 2. What do you do then? 2. What do you after breakfast? 3. Do you work? If so, where? 4. What do you do after lunch? 5. What kind of sports do you practice? 6. Are you An Architecture Student? If your answer is negative, what do you study? 7. Do you work on weekends? 8. What time do you usually go to bed? 9. How often do you go to the movies? 10. What kind of movies do you like? Producto entregable: Remember to give complete answers. Siga las indicaciones del tutor para sustentar sus respuestas de manera oral en el encuentro: What is your Weekday s Routine?, de acuerdo con la programación que se defina para esto, recuerde que deberá haber realizado el test con anterioridad. Sustentación oral del desarrollo del cuestionario What is your Weekday s routine? 29

8 Participar en el encuentro sincrónico, de acuerdo a las indicaciones dadas en la descripción de la evidencia. Podrá ingresar a la sesión a través del enlace disponible en la opción del menú del curso Actividades, en la ruta: Forma de entrega: Carpeta del Proyecto: Diseño y construcción de software a la medida para el sector empresarial. * Subcarpeta Fase del proyecto: Diseño. * Subcarpeta de la Actividad de Proyecto 6 Criterios de Instrumento de * Subcarpeta Actividad de Aprendizaje 3 Expresa oralmente ideas y conceptos, de manera clara y sencilla utilizando el vocabulario y la pronunciación correcta. Lista de chequeo EVIDENCIA 4: Tipo de Evidencia Desarrollo cuestionario HTML5 Desempeño Conocimiento Producto X Para el desarrollo de este cuestionario se suministra el documento HTML5 document for activity.docx, el cual debe leer como complemento al objeto de aprendizaje sobre HTML5, recuerde hacer una lectura inicial, identificar los términos desconocidos y analizar la información presentada. Posteriormente deberá resolver un cuestionario sobre el texto leído. Se debe generar un documento donde se presente el cuestionario junto con sus respectivas respuestas. Producto entregable: Archivo con el documento en formato.pdf con la solución al cuestionario. 30

9 Los archivos solicitados, deberán enviarse a través de la plataforma tecnológica del ambiente Virtual de Aprendizaje en el vínculo correspondiente a la Evidencia 4: Desarrollo cuestionario HTML5, de la actividad de aprendizaje 6.3: Construir las interfaces de usuario del sistema de información. Forma de entrega: Este vínculo está disponible en la opción del menú del curso Actividades, en la ruta: Carpeta del Proyecto: Diseño y construcción de software a la medida para el sector empresarial. * Subcarpeta Fase del proyecto: Diseño. * Subcarpeta de la Actividad de Proyecto 6 Criterios de Instrumento de * Subcarpeta Actividad de Aprendizaje 3 Identifica, comprende y utiliza vocabulario técnico en inglés en diferentes textos y contextos. Cuestionario con claves de respuesta. EVIDENCIA 5: Tipo de Evidencia Usabilidad del proyecto de formación Desempeño Conocimiento Producto X La actividad está orientada a identificar comunes errores fácilmente detectables en algunos programas o sitios web y confrontarlos posteriormente sobre el diseño gráfico definido para el proyecto de formación. Seleccione 3 sitios WEB para su exploración donde a partir de un cuestionario se identificaran los elementos de diseño y programación que contribuyen con la facilitación de la accesibilidad y usabilidad de los usuarios del sitio. Los ítems a validar son los siguientes: 31

10 Inclusión diagnóstica de aspectos ergonómicos en usuarios potenciales. Calidad de los componentes de usabilidad respecto a contenidos textuales: distribución, facilidad para su lectura y comprensión, calidad de contenidos. Facilitación de procesos intuitivos para los usuarios. Previsión de necesidades de usuarios. Percepción de control del sistema por el usuario. Uso de colores con baja afectación de fatiga. Facilidad de interacción. Agilidad de descarga de información. Consistencia temática. Previsión de contenidos por el usuario. Relación distancia y tamaño para los movimientos de interacción. Facilidad de recursos para la personalización Visibilidad de enlaces e intuición de rutas. Visibilidad de interfaces. Cobertura de pantalla. Registro de historial de navegación del usuario. Aplique para cada uno de los sitios los cuestionamientos anteriores, verifique y tome nota de las observaciones realizadas. Posteriormente aplique los mismos cuestionamientos con la interfaz construida para su proyecto de formación. Elabore un informe que contenga los resultados obtenidos de la aplicación del test, los aspectos por mejorar y los procedimientos que deberá aplicar para superar lo previsto. En foro previamente programado y con el acompañamiento de su tutor comparta las dificultades que experimenta para realizar las mejoras. Interactúe sobre las dificultades manifiestas por los compañeros y comparta sugerencias para su mejoramiento. 32

11 Para participar en el foro usabilidad del sistema de información, cada aprendiz deberá enviar el informe a su tutor, posteriormente debe ingresar al foro y seguir el siguiente procedimiento: Publicar las conclusiones de su análisis Socializarlas con sus compañeros Indicar las mejoras a incorporar para mejorar la usabilidad del sistema Comentar acerca de las dificultades encontradas por él y al menos otros de los compañeros. Sacar conclusiones finales Producto entregable: Forma de entrega: Cada participante debe hacer sus aportes de manera respetuosa, amable y consciente. Secuencias de participación en el foro temático publicadas de acuerdo a las instrucciones dadas. Informe con el análisis de usabilidad de tres sitios web y de la interfaz gráfica del proyecto de formación. El archivos solicitado, deberá enviarse a través de la plataforma tecnológica del ambiente Virtual de Aprendizaje en el vínculo correspondiente a la Evidencia 5: Participación en el foro usabilidad del sistema de información, de la actividad de aprendizaje 6. 3: Construir las interfaces de usuario del sistema de información. Este vínculo está disponible en la opción del menú del curso Actividades, en la ruta: Carpeta del Proyecto: Diseño y construcción de software a la medida para el sector empresarial. * Subcarpeta Fase del proyecto: Diseño. * Subcarpeta de la Actividad de Proyecto 6 * Subcarpeta Actividad de Aprendizaje 3 33

12 Criterios de Instrumento de Presenta las conclusiones del informe de evaluación del sistema de información teniendo en cuenta las características de usabilidad requeridos. Lista de Chequeo 34