UNIDAD 5: DISEO PARA APLICACIONES WEB 5.

1TEMAS DE DISEO PARA INGENIERA WEB Cuando se aplica el diseo dentro del contexto de la ingeniera Web, se deben considerar cuestiones tanto genricas como especficas. El diseo debe ser muy especfico Diseo de calidad de una WebApp En la prctica, la calidad de los sitios web se ha evaluado de una manera ad hoc, basada en el sentido comn y en la experiencia de los desarrolladores. El estudio de la calidad de productos y procesos de desarrollo para la Web es muy reciente y todava no se dispone de mtodos de evaluacin ampliamente difundidos para este tipo de entorno. Por lo tanto, existe la gran necesidad de metodologas efectivas para la obtencin de aplicaciones Web de calidad. Actualmente, hay dos vertientes de metodologas de desarrollo para la Web: la comunidad de Ingeniera de Software y la comunidad de Hipermedia. Estas metodologas carecen sin embargo de mtricas que puedan ser aplicadas a los modelos intermedios (Ej. Modelo de Objetos, Modelo Navegacional) utilizados en el proceso de desarrollo orientado a la Web. Otras caractersticas de diseo de calidad Web son: Metas de diseo Una de las metas de diseo de una WebApp es abarcar lo siguiente: 5.2 PIRMIDE DEL DISEO IWEB El diseo conduce a un modelo que contiene una mezcla adecuada de esttica, contenido y tecnologa.

5.3DISEO DE LA INTERFAZ DE LA WEBAPP Toda interfaz de usuario debe presentar las siguientes caractersticas: Debe ofrecer al usuario final una experiencia satisfactoria y gratificante. Los principios y directrices esenciales del diseo de una WebApp se pueden mencionar:

error

En un momento de nuestra vida, cualquiera de nosotros puede llegar a experimentar una transicin fsica. Ya sea una minusvala temporal, como un hueso roto, o una discapacidad permanente, nos veremos enfrentados al cambio. El simple proceso de envejecimiento nos lleva a ser dependientes de otros. El diseo universal nos permite transitar por esos cambios y seguir disfrutando de igualdad de oportunidades, autodeterminacin y calidad de vida. Tcnicas de diseo Diseo fijo Diseo que utiliza dimensiones de tamao absoluto: inches (in), centmetros (cm), milmetros (mm), puntos (pt), picas (pc). Su efecto es bloquear el tamao de un elemento a un tamao fijo. Diseo lquido (o fluido) Diseo que utiliza cmo unidad de medida el porcentaje (%). Su efecto es la adaptacin de los elementos y su disposicin aprovechando todo el ancho de pantalla que ser calculada en base a la resolucin del dispositivo utilizado. Diseo elstico (o flexible) Diseo que utiliza cmo unidad de medida em. Su efecto es adaptar el ancho de los elementos y su disposicin en base al tamao de texto configurado por el usuario. Diseo hibrido Diseo que utiliza unidades de medida absolutas, porcentaje y em. diseo ms accesible que otro.

Flujo de trabajo en el diseo de la interfaz Las siguientes tareas representan un flujo de trabajo rudimentario para el diseo de la interfaz WebApp. 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. Revisar la informacin contenida en el modelo de anlisis y refinarla conforme se requiera. Desarrollar un bosquejo aproximado de la plantilla de la interfaz de la WebApp. Correlacionar los objetivos del usuario con acciones especficas de la interfaz. Definir un conjunto de tareas de usuario que estn asociadas con cada accin. Elaborar bosquejos con imgenes de la pantalla para cada accin de la interfaz. Refinar la plantilla de la interfaz y los bosquejos con el uso de entradas desde el diseo esttico. Identificar los objetos de la interfaz del usuario que se requieren para implementarla. Desarrollar una representacin de procedimiento de la interaccin de usuario con la interfaz. Desarrollar una representacin del comportamiento de la interfaz. Describir la plantilla de la interfaz para cada estado. Refinar y revisar el modelo de diseo de la interfaz.

5.4DISEO ESTTICO

El diseo esttico, tambin llamado diseo grfico, es un esfuerzo artstico que complementa los aspectos tcnicos de la ingeniera Web. Sin l una WebApp puede ser funcional, pero sin atractivo. 5.5DISEO DE CONTENIDO El diseo de contenido se enfoca en dos asuntos de diseo diferentes, cada uno lo abordan individuos con distintos conjuntos de habilidades. El diseo de contenido desarrolla una representacin de diseo para los objetos de contenido y representa los mecanismos que se requieren para que establezcan sus relaciones uno con otro. Objetos de contenido La relacin entre objetos de contenido, defina como parte del modelo de anlisis WebApp y los objetos de diseo que representan contenido es anloga a la relacin entre las clases de anlisis y los componentes de diseo. Un objeto de contenido tiene atributos que incluyen informacin especfica de contenido y atributos especficos de implementacin que se especifican como parte del diseo. 5.7 DISEO DE NAVEGACIN El diseador debe definir las rutas de navegacin que habiliten para la ruta de los usuarios el acceso al contenido y las funciones de las WebApp. Para ello se debe: la semntica de navegacin para diferentes usuarios del sitio

Semntica de navegacin Durante las etapas iniciales del diseo, de navegacin se valora la arquitectura de contenido de la WebApp para determinar una o mas FdN para cada caso de uso. Como se anot anteriormente, una FdN identifica los nodos de navegacin y los vnculos que permiten la navegacin entre ellos. Sintaxis de navegacin Conforme el diseo se lleva a cabo se define la mecnica de navegacin, entre sus posibilidades tenemos: 5.8 METRICAS DE DISEO PARA WEBAPPS Las mtricas deben ofrecer respuestas cuantitativas a las siguientes preguntas

La interfaz de usuario promueve la facilidad de uso? La esttica de la WebApp es apropiada para el dominio de la aplicacin y confortable al uso? El contenido est diseado en una forma que proporciona mayor informacin con el menor esfuerzo? La navegacin es eficiente y directa? La arquitectura de la WebApp se ha diseado para acomodar las metas y objetivos especiales de los usuarios de la WebApp la estructura de contenido y funcionalidad y el flujo de navegacin requerido para usar el sistema de manera efectiva? Los componentes estndar diseado en una forma que reduce la complejidad y aumenta la exactitud, la confiabilidad y el desempeo? Hasta el momento no existe un conjunto de mtricas cuantitativas por lo que estos deben ser tratados de manera cualitativa UNIDAD 6: VERIFICACIN Y VALIDACIN DE APLICACIONES WEB 6.1 PLANIFICACIN DE LA VERIFICACIN Y VALIDACIN invierte en V & V. aproximaciones estticas y dinmicas de V & V. software, establecer listas de comprobacin para conducir las inspecciones de programas y definir el plan de pruebas del software. El esfuerzo destinado a las inspecciones y las pruebas depende del tipo de sistema a desarrollar y de los expertos de la organizacin en V & V con que se cuente. tcnicas de verificacin estticas. pruebas, son tiles para los ingenieros del software implicados en el diseo y la realizacin de las pruebas del sistema. trabajo en este contexto. inspecciones y pruebas y controlar los costos del proceso de V & V. en etapas tempranas del proceso de desarrollo.

desarrollar el sistema se

6.2 INSPECCIONES DE SOFTWARE y anomalas. salida son debidas a un nuevo error o son efectos laterales del error original. entre errores. Pueden inspeccionarse versiones incompletas de un sistema sin costos adicionales. pruebas, para probar las partes disponibles. Adems de buscar los defectos en el programa, una inspeccin tambin puede considerar otros atributos de calidad ms amplios: cumplimiento con los estndares, portabilidad y mantenibilidad. podran tornar al sistema difcil de mantener y actualizar. costosa que las pruebas de defectos, a la hora de encontrar fallas en los programas. 6.3 PRUEBAS DE LAS APLICACIONES WEB Las pruebas que por cierto son de diferentes tipos. - El contenido: evaluacin sintctica (ortografa y gramtica de contenido) y semntica (exactitud de la informacin presentada y consistencia entre objetos de contenido y objetos relacionados) - La funcin: comprobar la concordancia con los requisitos del cliente - Estructura: se comprueba que se entregue adecuadamente el contenido y la funcionalidad de la WebApp. - Facilidad de uso: para cada categora de usuario, que va relacionado con la sintaxis y semntica de la navegacin - Navegabilidad: comprobar la sintaxis y semntica de navegacin as como comprobar que est controlado todo flujo, por ejemplo: vnculos rotos, vnculos inadecuados, etc.) - Desempeo: se prueba en una diversidad de condiciones operativas, configuraciones, y cargas para saber que el software responde adecuadamente a cargas extremas cualquier representacin legible del software. ntajas fundamentales de la inspeccin sobre las pruebas: Durante las pruebas, los errores pueden ocultar otros errores.

- Compatibilidad: se comprueba que la WebApp funciona en varias configuraciones husped tanto del lado del cliente como del servidor e infraestructura de seguridad - Interoperabilidad: se prueba para asegurar que la WebApp realiza interfaces adecuadas con otras aplicaciones y/o bases de datos, y que estas sean con un buen desempeo - Seguridad: se prueba la vulnerabilidad potencial. 6.4 EJEMPLOS DE PRUEBAS PARA WEBAPPS Prueba de Contenido - Sintctica (ortografa y gramtica de contenido) - Semntica (exactitud de la informacin presentada y consistencia entre objetos de contenido y objetos relacionados). Esta evaluacin que se hace para cada objeto de contenido debe el examinador responder a las siguientes preguntas: - La informacin realmente es precisa (concisa y exacta)? - La plantilla del objeto de contenido es fcil de entender para el usuario? - La informacin anidada en un objeto de contenido se encuentra con facilidad? - La informacin presentada internamente es consistente con la informacin de otros objetos de contenido? - El contenido es ofensivo, engaoso o abre la puerta a pleitos? - El contenido infringe derechos de autor o marcas registradas? - El estilo esttico del contenido entra en conflicto con el estilo esttico de la interfaz global Un grupo de pruebas adicionales en cuanto a la semntica es para los WebApp que construyen objetos de contenido dinmicos que se crean en tiempo real en base a una base de datos. Para esto se deben observar varios factores: - Pruebas que descubran errores cometidos al traducir la solicitud del usuario en una forma que pueda procesar la DBMS - Pruebas para comprobar errores en la comunicacin con la base de datos - Validar que los datos brutos provenientes de la DBMS hacia el servidor y este hacia el cliente estn correctamente formateados para crear los objetos de contenido

- Probar el formato y compatibilidad de presentacin de los objetos de contenido dinmico al usuario con diferentes configuraciones de ambiente del cliente - Estructurales/arquitectura (que se entregue adecuadamente el contenido y la funcin de la WebApp. Que pueda ser extensible en contenido y funcionalidad) CMS. Prueba de Interfaz del Usuario La verificacin y validacin de la interfaz del usuario se lo hace en tres puntos del proceso, en el anlisis (formulacin y anlisis de requisitos), en el diseo (al disear la interfaz que garantice la calidad) y durante las pruebas donde bsicamente se prueban ejecutando la aplicacin. Los objetivos que se obtienen con las pruebas de interfaz son: - Las caractersticas de la interfaz se prueban para asegurar que las reglas del diseo, la esttica y el contenido visual relacionado estn a disposicin del usuario sin error alguno - Los mecanismos individuales de la interfaz se prueban en forma unitaria (por ejemplo se prueba HTML dinmico, cgi, carrito de compras, etc.) - La interfaz se prueba frente cada caso de uso (USN) para descubrir errores de semntica, y facilidad de uso - La interfaz se prueba dentro de una diversidad de ambientes para asegurar su compatibilidad. Pruebas de semntica de la interfaz. Una vez que se ha probado de forma unitaria cada mecanismo de interfaz, se procede con la prueba semntica que evala cun bien el diseo se ocupa de los usuarios, ofreciendo una direccin clara, manteniendo consistencia de lenguaje y enfoque. Para esto se sugiere probar cada caso de uso (categoras de usuario) versus el diseo de la interfaz para confirmar que no hay errores y si los hubiere como los maneja y su recuperacin. Pruebas de compatibilidad. Como sabemos, el usuario puede tener diferentes ambientes (sistemas operativos, navegador, plataformas de hardware), por lo que se debe hacer pruebas de compatibilidad para descubrir errores asociados con un ambiente especfico. Para esto se debe definir un conjunto de configuraciones de computadoras cliente ms comunes y en funcin de estas armar las pruebas. Prueba al nivel de Componentes Conocidas como pruebas de funcin, que intentan descubrir errores en la funcionalidad de la WebApp. Para esto existen algunos mtodos de prueba: - Particin de equivalencia. Cuyo dominio de entrada se divide en categoras o clases de entrada y a partir de estos se derivan los casos de prueba. Se hacen pruebas con cada categora mientras las

otras permanecen constantes, por ejemplo en una pgina que importe el cdigo postal, aqu se hace pruebas posibles con el cdigo postal mientras los otros valores permanecen constantes - Anlisis de valores lmite. Probar los valores mximos o mnimos de campos o atributos que maneja el componente o la funcin - Pruebas de ruta. Para comprobar y garantizar que se ha ejercitado toda ruta posible en su funcionamiento. Para cada caso se debe especificar la entrada y salida esperada. Existen circunstancias en las que la funcionalidad es tan extensa que complica probar todas las posibles situaciones, por lo que una sugerencia seria acudir a un anlisis de riesgo para obtener los casos de prueba de mayor riesgo, como por ejemplo: - Cul funcionalidad es la ms importante para el propsito - Cuales reas del sitio amerita ms dura interaccin con la DB? - Cuales mecanismos especficos (cgi, applets, ActiveX) son los ms complejos? - Qu tipos de problemas causara la mayora de las quejas o la peor publicidad? - Qu reas del sitio sern las ms populares? - Qu partes del sitio tendrn mayores riesgos de seguridad? Pruebas de Navegacin Las pruebas de navegacin garantizan que todos los mecanismos que permiten al usuario de la WebApp viajar a travs de ella sean funcionales y validar que cada USN pueda ser alcanzado por la categora de usuario adecuada. La primera prueba de navegacin inicia con la prueba de interfaz. Estas pruebas inicialmente son probadas por los Ingenieros Web para luego pasar que prueben los usuarios. Prueba de sintaxis de navegacin. Con cada mecanismo de navegacin se prueba: vnculos navegacin, redirigir (destinos removidos), mapas de sitio, motores de bsqueda. Prueba de semntica de navegacin. Se deben probar los USN (unidad semntica de navegacin). Si no se han hecho los USN en el anlisis, se puede tomar los casos de uso para armar casos de prueba de navegacin respondiendo a las siguientes preguntas: Pruebas de Configuracin En las pruebas de compatibilidad en pruebas de interfaz usuario se probaron solo del lado del cliente, mientras que en estas pruebas de configuracin se prueban un conjunto de probables configuraciones de cliente y servidores.

Del lado del servidor: - La WebApp es totalmente compatible con el sistema operativo del servidor? - Los archivos de sistema, directorios y datos de sistema relacionados se crean correctamente cuando la WebApp esta operativa? - Las medidas de seguridad del sistema permiten a la WebApp ejecutarse y dar el servicio a los usuarios sin interferencia y a un buen desempeo? - La WebApp se ha probado con la configuracin de servidor distribuido (clster o balanceo de carga)? - La WebApp est integrada adecuadamente con la base de datos (incluyendo diferentes versiones de DB)? - Si se usan proxys, las diferencias en configuraciones se han abordado? Del lado del cliente: - Hardware: CPU, memoria, dispositivos de impresin, monitor - Sistemas operativos: normales y especiales para equipos mviles - Software de navegacin - Componentes de interfaz del usuario: ActiveX, applets java, otros - Plug in: QuickTime, real player, adobe, otros - Conectividad: cable, DSL, Modem, proxys, otros - Aplicaciones que corren al mismo tiempo. Pruebas de Desempeo Se aplican para descubrir problemas de desempeo que se presentan debido a la falta de recursos en el lado del servidor, ancho de banda de red inapropiada, capacidades inadecuadas de bases de datos, capacidades/defectuosos de sistemas operativos, funcionalidad mal diseada, u otros conflictos de hardware o software (seguridad) que impidan un buen desempeo. Esto conducir a comprender como el sistema responde a cierta carga (numero de usuarios activos, numero de transacciones, volumen de datos, etc.) y a poder recolectar mtricas para poder modificar el diseo o acoplar soluciones (hardware/software apropiadas) para mejorar el rendimiento. Las pruebas deben responder a las siguientes preguntas:

- En qu punto (usuarios, transacciones, carga de datos) el desempeo se vuelve inaceptable? - Que componentes del sistema son responsables de la reduccin del desempeo? - Cul es el tiempo de respuesta promedio para los usuarios en una variedad de condiciones de carga? - Que ocurre cuando se aplican cargas que rebasan la capacidad mxima del servidor? Para contestar a estas preguntas se hacen las pruebas de desempeo comunes (carga y tensin). Pruebas de carga. Para esta prueba se consideran variables: - N: nmero de usuarios concurrentes - T: numero de transacciones en lnea por usuario por unidad de tiempo - D: la carga de datos procesada por el servidor por transaccin. De estas variables el Ingeniero Web obtiene valores promedios aceptables y si en el momento de la prueba encuentra una disminucin precipitada de desempeo se debe revisar el porqu. Pruebas de tensin. Es una continuacin de la prueba de carga, en donde las variables N, T y D se fuerzan para poder superar los lmites operativos. Con esta prueba se responden a las siguientes preguntas: - El sistema se degrada o el servidor se desconecta cuando se rebasa su capacidad? - El software emite mensajes al cliente y al soporte tcnico del sitio que se no puede alcanzar el servidor? - El servidor pone en cola las peticiones que no alcanza a resolverlas para ir atendiendo poco a poco como su capacidad lo permita? - Las transacciones se pierden conforme se rebasa los lmites? - La integridad de datos se pierde cuando se rebasa los lmites? - Si el sistema falla, cunto tarda en estar en lnea de nuevo? Ciertas funciones del WebApp se descontinan cuando el servidor llega a sus umbrales (memoria, procesador, disco)? Una variacin de pruebas de tensin son las llamadas pruebas pico, que son las mismas pruebas de tensin pero se lo hace muy repentino llegar o sobrepasar el lmite volviendo a la normalidad y luego nuevamente sobrepasando el lmite para efectos de poder comprobar cun bien que el sistema/servidor se recupera regresando a su normalidad.