MODELO DE DISEÑO DE APLICACIONES WEB - OBJETIVOS DE DISEÑO PIRÁMIDE DE DISEÑO

of 26/26
“2015, Año del Generalísimo José María Morelos y Pavón” TECNOLÓGICO NACIONAL DE MÉXICO Instituto Tecnológico de Salina Cruz Carretera a San Antonio Monterrey Km. 1.7, C. P. 70701, Salina Cruz, Oaxaca. Tels. 01 (971) 71 6 28 37 y 01 (971) 71 6 32 42, e-mail: [email protected] INSTITUTO TECNOLÓGICO DE SALINA CRUZ UNIDAD I: MODELO DE DISEÑO DE APLICACIONES WEB TRABAJO: Reporte TEMA: OBJETIVOS DE DISEÑO PIRÁMIDE DE DISEÑO MATERIA: MODELO DE DISEÑO DE APLICACIONES WEB FACILITADOR: MTI. MEDEL DÍAZ EDGAR PRESENTAN: CRUZ ROJAS ARIANA PATRICIA JARQUÍN MARTÍNEZ NOEMÍ JIMÉNEZ OSORIO VÍCTOR HUGO CARRRERA: ING. EN TECNOLOGÍAS DE LA INFORMACIÓN Y DE LAS COMUNICACIONES.
  • date post

    17-Jan-2016
  • Category

    Documents

  • view

    254
  • download

    0

Embed Size (px)

description

UNIDAD 1TEMA:1.3OBJETIVOS DE DISEÑO1.4 PIRÁMIDE DE DISEÑO

Transcript of MODELO DE DISEÑO DE APLICACIONES WEB - OBJETIVOS DE DISEÑO PIRÁMIDE DE DISEÑO

2015, Ao del Generalsimo Jos Mara Morelos y PavnTECNOLGICO NACIONAL DE MXICOInstituto Tecnolgico de Salina Cruz

INSTITUTO TECNOLGICO DE SALINA CRUZ

UNIDAD I: Modelo De Diseo De Aplicaciones WebTRABAJO:ReporteTEMA:Objetivos de DiseoPirmide de Diseo

MATERIA: Modelo De Diseo De Aplicaciones WebFACILITADOR:MTI. Medel Daz Edgar

PRESENTAN:Cruz Rojas Ariana PatriciaJarqun Martnez NoemJimnez Osorio Vctor Hugo

CARRRERA:Ing. En Tecnologas De La Informacin Y De Las Comunicaciones.

SEMESTRE: VIII GRUPO: E

SALINA CRUZ, OAXACA A 19 DE FEBRERO DEL 2015.NDICE PGINAIntroduccin21.1 Objetivos de Diseo31.2 Pirmide de Diseo51.2.1 Diseo de componentes61.2.2 Diseo de arquitectura71.2.2.1 Arquitectura del contenido.71.2.2.2 Arquitectura de las webapps.81.2.3 Diseo de navegacin91.2.3.1 Semntica de la navegacin.101.2.3.2 Sintaxis de navegacin.101.2.4 Diseo del contenido121.2.4.1 Objetos de contenido.121.2.5 Diseo esttico131.2.5.1 Aspectos de la distribucin.131.2.5.2 Aspectos del diseo grfico.141.2.6 Diseo de la interfaz141.2.6.1 Aspectos del diseo grfico.15Conclusin16Fuentes Bibliogrficas17

IntroduccinEl diseo de webapps incluye actividades tcnicas y no tcnicas que incluyen lo siguiente: establecer la vista y sensacin de la aplicacin web, creando la distribucin esttica de la interfaz de usuario, definiendo la estructura arquitectnica general, desarrollando el contenido y la funcionalidad que residen en la arquitectura y planeando la navegacin que ocurre dentro de la webapp.En la creacin del modelo del diseo de una webapp, intervienen ingenieros web, diseadores grficos, desarrolladores de contenido y varios participantes ms. El diseo permite crear un modelo que se evale respecto de su calidad para mejorarlo antes de la generacin de contenido y cdigo, de la realizacin de las pruebas y del involucramiento de un gran nmero de usuarios.

1.1 Objetivos de DiseoSimplicidad: Aunque parezca algo pasado de moda, el aforismo todo con moderacin es aplicable a las aplicacin webs. Existe una tendencia entre ciertos diseadores a dar al usuario final demasiado: contenido exhaustivo, extremos visuales, animaciones intrusas, pginas web enormes y la lista sigue. Es mejor moderacin y simplicidad. El contenido debe ser informativo pero sucinto y debe utilizar un modo de entrega (texto, imgenes, video o audio) que resulte apropiado para la informacin que se enve. La navegacin debe ser directa y sus mecanismos, obvios para la intuicin del usuario final.La esttica debe ser agradable pero no abrumadora (demasiados colores tienden a distraer al usuario en vez de mejorar la interaccin). La arquitectura debe lograr los objetivos de la aplicacin web de la manera ms sencilla posible. Las funciones deben ser fciles de utilizar y ms fciles de entender. Consistencia. Esta meta del diseo se aplica virtualmente a todo elemento del modelo del diseo. El contenido debe construirse de modo congruente (formato y tipografa del texto deben ser los mismos en todos los documentos de texto; las imgenes deben tener coherencia en su aspecto, color y estilo). El diseo grfico (esttica) debe presentar una vista consistente en todas las partes de la aplicacin web. El diseo arquitectnico debe establecer plantillas que generen una estructura de hipermedios constante. El diseo de la interfaz debe definir modos consistentes de interaccin, navegacin y despliegue del contenido. Los mecanismos de navegacin deben usarse de manera consistente en todos los elementos de la aplicacin web. Hay que recordar que para un visitante, un sitio web es un lugar fsico. Si sus pginas no tienen un diseo consistente, son fuente de confusin.Identidad. El diseo de la esttica, la interfaz y la navegacin de una aplicacin web deben ser consistentes con el dominio de la aplicacin para la que se va a elaborar. Un sitio web para un grupo de hip-hop sin duda tendr un aspecto y sensacin distintos que una aplicacin web diseada para una compaa de servicios financieros.La arquitectura de la aplicacin web ser diferente por completo, las interfaces se construirn para que reciban a distintas categoras de usuarios, la navegacin se organizar para que cumpla objetivos diferentes. Usted (y quienes contribuyan al diseo) debe trabajar para establecer la identidad de la aplicacin web por medio del diseo. Robustez. Con base en la identidad que se haya establecido, es frecuente que una aplicacin web haga una promesa implcita al usuario. ste espera contenido y funciones robustas que sean relevantes para sus necesidades. Si no existen o son insuficientes, es probable que la aplicacin web fracase. Navegabilidad. Ya se dijo que la navegacin debe ser sencilla y consistente. Tambin debe estar diseada en forma tal que sea intuitiva y predecible. Es decir, el usuario debe comprender cmo moverse por la aplicacin web sin tener que buscar vnculos o instrucciones para la navegacin. Por ejemplo, si un campo de iconos grficos o de imgenes contiene algunos que sern usados como mecanismos de navegacin, deben identificarse visualmente. Nada es ms frustrante que intentar encontrar el vnculo vivo apropiado entre muchas imgenes. Tambin es importante colocar los vnculos hacia el contenido y las funciones de la aplicacin web en una ubicacin predecible en cada pgina web. Si se requiere desplazar la pgina (lo que sucede con frecuencia), los vnculos situados en las partes superior e inferior de la pgina hacen que las tareas de navegacin del usuario sean ms fciles. Atractivo visual. De todas las categoras de software, las aplicaciones web son indiscutiblemente las ms visuales, dinmicas y estticas. La belleza (atractivo visual) radica sin lugar a dudas en los ojos del espectador, pero muchas caractersticas del diseo (aspecto y sensacin del contenido, distribucin de la interfaz, coordinacin del color, balance del texto, imgenes y otros medios) aumentan el atractivo visual. Compatibilidad. Una aplicacin web se usar en varios ambientes (distinto hardware, tipos de conexin, sistemas operativos, navegadores, etctera) y debe disearse para que sea compatible con cada uno.1.2 Pirmide de DiseoLa creacin de un diseo eficaz requerir por lo general de un conjunto diversificado de aptitudes. En ocasiones, para proyectos pequeos, un desarrollador nico necesitar tener varias habilidades. Para los proyectos grandes, es aconsejable o factible confiar en la experiencia de especialistas: ingenieros web, diseadores grficos, desarrolladores de contenido, programadores, especialistas de bases de datos, arquitectos de la informacin, ingenieros de redes, expertos en seguridad y probadores.La mezcla apropiada de habilidades de diseo variar en funcin de la naturaleza de la webapp. La figura 1.1 ilustra la pirmide del diseo de las webapps. Cada nivel representa una accin del diseo que se describe en las siguientes secciones.

Figura 1.1 Pirmide del Diseo

1.2.1 Diseo de componentesLas webapps modernas dan funciones de procesamiento cada vez ms complejas que: 1) Realizan un procesamiento localizado para generar contenido y capacidad de navegacin en forma dinmica.2) Proporcionan capacidad de cmputo o de procesamiento de datos que resultan apropiados para el dominio del negocio de la webapp. 3) Dan consulta y acceso complejos a bases de datos.4) Establecen interfaces de datos con sistemas corporativos externos. Para lograr estas capacidades (y muchas otras) deben disearse y construirse componentes de programas con forma idntica a los componentes del software tradicional. Los mtodos de diseo se aplican a los componentes de las webapps con poca, o ninguna, modificacin. El ambiente de implementacin, los lenguajes de programacin, los patrones de diseo, estructuras y software, tal vez varen un poco, pero el enfoque general del diseo es el mismo.

MTODO DE DISEO DE HIPERMEDIOS ORIENTADO A OBJETOS (MDHOO) En la ltima dcada, se han propuesto varios mtodos de diseo para aplicaciones web. Hasta hoy, ninguno de ellos es el dominante. Se presenta un panorama breve de uno de los mtodos de diseo de webapps ms estudiado. Daniel Schwabe propuso por primera vez el Mtodo de Diseo de Hipermedios Orientado a Objetos (MDHOO), que est compuesto de cuatro distintas actividades de diseo: diseo conceptual, diseo de navegacin, diseo abstracto de la interfaz e implementacin.

Diseo conceptual del MDHOO.El diseo conceptual del MDHOO genera una representacin de los subsistemas, clases y relaciones que definen el dominio de aplicacin para la webapp. Se puede utilizar UML para crear diagramas de clase apropiados, agregaciones y representaciones compuestas de clase, diagramas de colaboracin y otra clase de informacin que describa el dominio de la aplicacin.

1.2.2 Diseo de arquitecturaEl diseo arquitectnico est ligado con las metas establecidas para una webapp, con el contenido que se va a presentar, con los usuarios que la visitarn y con la filosofa de navegacin adoptada. Como diseador de la arquitectura, el lector debe identificar la arquitectura del contenido y la de la webapp. La arquitectura del contenido se centra en la manera en la que los objetos de contenido (o compuestos, como pginas web) se estructuran para la presentacin y la navegacin. La arquitectura de la webapp se aboca a la forma en la que la aplicacin queda estructurada para administrar la interaccin con el usuario, manejar tareas de procesamiento interno, navegar con eficacia y presentar el contenido.En la mayora de los casos, el diseo arquitectnico se lleva a cabo en paralelo con el de la interfaz, el esttico y el del contenido. Como la arquitectura de la webapp tal vez est muy influida por la navegacin, las decisiones que se tomen durante esta accin del diseo influirn en el trabajo realizado durante el diseo de aqulla.

1.2.2.1 Arquitectura del contenido.El diseo del contenido se centra en la definicin de la estructura general de los hipermedios de la webapp. Aunque en ocasiones se crean arquitecturas personalizadas, siempre se tiene la opcin de elegir entre cuatro distintas estructuras de contenido.Las estructuras lineales (vase la figura 1.2) se encuentran cuando es comn una secuencia predecible de interacciones (con cierta variacin o diferencia). Un ejemplo clsico es la presentacin de tutoriales en los que se despliegan pginas de informacin junto con imgenes relacionadas, videos cortos o audio, slo despus de haber mostrado cierta informacin de prerrequisitos. La secuencia de la presentacin del contenido es predefinida y por lo general es lineal. Otro ejemplo sera una secuencia de entrada para ordenar un producto en la que debe proporcionarse informacin especfica en un orden determinado. A medida que el contenido y el procesamiento se hacen ms complejos, el flujo exclusivamente lineal que se aprecia a la izquierda de la figura da origen a estructuras lineales ms complejas en las que puede invocarse contenido alternativo o en las que sucede una desviacin para adquirir contenido complementario (estructura que aparece en el lado derecho de la figura 1.2).

Figura 1.2 Estructuras Lineales

1.2.2.2 Arquitectura de las webapps. La arquitectura de una webapp describe una infraestructura que permite que un sistema o aplicacin basados en web alcance sus objetivos empresariales. Jacyntho describe las caractersticas bsicas de esta infraestructura del modo siguiente: Las aplicaciones deben construirse con el empleo de capas en las que se tomen en cuenta distintas preocupaciones; en particular, deben separarse los datos de la aplicacin de los contenidos de sta (nodos de navegacin), y stos, a su vez, deben separarse con toda claridad del aspecto y la sensacin de la interfaz (pginas). Los autores sugieren una arquitectura del diseo en tres capas que desacopla la interfaz de la navegacin y del comportamiento de la aplicacin. Plantean que mantener separadas la interfaz, la aplicacin y la navegacin, simplifica la implementacin y mejora la reutilizacin. La arquitectura de controlador de la vista del modelo (CVM) es uno de varios modelos sugeridos para la infraestructura de webapps que desacoplan la interfaz de usuario de sus funciones y contenido informativo. El modelo (a veces denominado objeto de modelo) contiene todo el contenido y la lgica de procesamiento especficos de la aplicacin, incluso todos los objetos de contenido, acceso a fuentes de datos o informacin externos y todas las funciones de procesamiento que son especficas de la aplicacin. La vista contiene todas las funciones especficas de la interfaz y permite la presentacin de contenido y lgica de procesamiento, incluidos todos los objetos de contenido, el acceso a fuentes de datos o informacin del exterior y todas las funciones de procesamiento que requiere el usuario final. El controlador administra el acceso al modelo y la vista, y coordina el flujo de datos entre ellos. En una webapp, la vista es actualizada por el controlador con datos del modelo, basndose en las entradas que da el usuario.

1.2.3 Diseo de navegacinUna vez que la arquitectura de la webapp ha sido establecida y se han identificado sus componentes (pginas, textos, subprogramas y otras funciones de procesamiento), deben definirse las rutas de navegacin que permitan a los usuarios acceder al contenido y a las funciones de la webapp. Para lograr esto, debe hacerse lo siguiente: 1) identificar la semntica de navegacin para los distintos usuarios del sitio y 2) definir la mecnica (sintaxis) para efectuar la navegacin.

1.2.3.1 Semntica de la navegacin. Como muchas acciones del diseo de webapps, el diseo de la navegacin comienza con la consideracin de la jerarqua del usuario y los casos de uso relacionados, desarrollados para cada categora de usuario (actor). Cada actor puede usar la webapp en forma algo diferente, por lo que tendrn distintos requerimientos de navegacin. Adems, los casos de uso desarrollados por cada actor definirn un conjunto de clases que incluirn uno o ms objetos de contenido o funciones de la webapp. A medida que cada usuario interacte con la webapp, encuentra una serie de unidades semnticas de navegacin (USN): conjunto de estructuras de informacin y navegacin relacionadas que colaboran para el cumplimiento de un subconjunto de requerimientos del usuario relacionados.Una USN est compuesta por un conjunto de elementos de navegacin llamados formas de navegar (FdN). Una FdN representa la mejor ruta de navegacin a fin de lograr una meta para un tipo de usuario especfico. Cada FdN est organizada como un conjunto de nodos de navegacin (NN) conectados por vnculos. En ciertos casos, un vnculo navegable es otra USN. Entonces, la estructura de navegacin general de una webapp est organizada como jerarqua de USN. Durante las etapas iniciales del diseo de la navegacin, se evala la arquitectura del contenido de la webapp a fin de determinar una o ms FdN para cada caso de uso. Como ya se dijo, una FdN identifica los nodos de navegacin (por ejemplo, contenido) y despus los vnculos que permiten navegar entre ellos. Entonces, las FdN estn organizadas en USN.

1.2.3.2 Sintaxis de navegacin.Al avanzar en el diseo, la tarea siguiente es definir la mecnica de la navegacin. Se dispone de varias opciones para desarrollar un enfoque de implementacin para cada USN: Vnculo de navegacin individual: incluye vnculos basados en texto, iconos, botones e interruptores, as como metforas grficas. Deben elegirse vnculos que sean apropiados para el contenido y consistentes con la heurstica que conduzca al diseo de una interfaz de alta calidad. Barra de navegacin horizontal: enlista las categoras principales de contenido o de funciones en una barra que contiene vnculos apropiados. En general, se enlistan de cuatro a siete categoras. Columna de navegacin vertical: enlista las principales categoras de contenido o funciones o enlista virtualmente todos los principales objetos de contenido que hay dentro de la webapp. Si se elige la segunda opcin, las columnas de navegacin pueden expandirse para que presenten objetos de contenido como parte de una jerarqua (seleccionar una entrada en la columna original ocasiona una expansin que enlista una segunda capa de objetos de contenido relacionados). Pestaas: metfora que no es ms que una variacin de la barra o columna de navegacin y representa categoras de contenido o funciones como pestaas que se seleccionan cuando se requiere un vnculo. Mapas del sitio: dan una tabla de contenido que incluye todo el contenido a fin de navegar hacia todos los objetos y funciones contenidas dentro de la webapp. Adems de elegir la mecnica de navegacin, tambin deben establecerse las convenciones y ayudas apropiadas para navegar. Por ejemplo, los iconos y vnculos grficos deben invitar a hacer clic en ellos, desvaneciendo las aristas a fin de darles una apariencia tridimensional. Debe disearse retroalimentacin auditiva o visual con objeto de dar al usuario una indicacin de que se ha escogido cierta opcin de navegacin. Para la navegacin basada en texto debe utilizarse color que indique los vnculos de navegacin y que seale aqullos ya recorridos. stas son unas cuantas convenciones entre las decenas que hay para el diseo y que hacen que la navegacin sea amigable para el usuario.

1.2.4 Diseo del contenidoEl diseo del contenido se centra en dos tareas diferentes del diseo, cada una de las cuales es dirigida por individuos que poseen habilidades distintas. En primer lugar, se desarrolla una representacin del diseo para los objetos del contenido y los mecanismos requeridos para establecer una relacin entre ellos. Adems, se crea la informacin dentro de un objeto de contenido especfico. El trabajo posterior es llevado a cabo por escritores, diseadores grficos y otros actores que generan el contenido que se usar en la webapp.El diseo del contenido se enfoca en dos asuntos de diseo diferente, cada uno lo abordan individuos con conjunto de habilidades. Adems el diseo de contenidos se ocupa de representar la informacin dentro de un objeto. Se enfoca en dos asuntos de diseo diferentes:Para los objetos de contenido, mecanismos para establecer relaciones unos con otros (ingeniero Web) y en la representacin de informacin dentro de un objeto de contenido especfico (la dirigen los publicistas y diseadores grficos).

1.2.4.1 Objetos de contenido. La relacin entre los objetos de contenido definidos como parte del modelo de requerimientos para la webapp y los objetos de diseo que representan el contenido es anloga a la relacin que existe entre las clases de anlisis y los componentes del diseo. En el contexto del diseo de la webapp, un objeto de contenido se parece ms a un objeto de datos del software tradicional. Un objeto de contenido tiene atributos que incluyen informacin de contenido especfico (normalmente definido durante el modelado de los requerimientos de la webapp) y atributos de implementacin especfica que se establecen como parte del diseo.

1.2.5 Diseo estticoEl diseo esttico, tambin llamado diseo grfico, es una actividad artstica que complementa los aspectos tcnicos del diseo de las webapps. Sin esttica, una webapp tal vez sea funcional pero no atractiva. Con esttica, una webapp lleva a sus usuarios a un mundo que los sita en un nivel tanto visceral como intelectual.

1.2.5.1 Aspectos de la distribucin.Toda pgina web tiene una cantidad limitada de superficie que se utiliza para dar apoyo a la esttica no funcional, caractersticas de navegacin, contenido de informacin y funciones dirigidas al usuario. El desarrollo de dicha superficie se planea durante el diseo esttico. Igual que todos los temas de la esttica, cuando se disea la distribucin de la pantalla no hay reglas absolutas. Sin embargo, es til considerar varios lineamientos de la distribucin general. No temer al espacio en blanco. No es aconsejable ocupar con informacin cada centmetro cuadrado de una pgina web. La mezcla resultante har difcil que el usuario identifique la informacin o las caractersticas que necesita y crear un caos visual que no ser agradable a los ojos. Hacer nfasis en el contenido. Despus de todo, sta es la razn de que el usuario est ah. Organizar los elementos con una distribucin que vaya desde arriba a la izquierda hacia abajo a la derecha. La gran mayora de usuarios de una pgina web la recorrern en forma muy parecida a como lo hacen con las hojas de un libro: desde arriba a la izquierda hacia abajo a la derecha. Si los elementos de la distribucin tienen prioridades especficas, aquellos que sean prioritarios deben colocarse en la parte superior izquierda de la superficie de la pgina. Agrupar la navegacin, el contenido y la funcin en forma geogrfica dentro de la pgina. Los humanos buscamos patrones virtualmente en todas las cosas. Si en una pgina web no hay patrones discernibles, es probable que la frustracin del usuario aumente (debido a la bsqueda innecesaria de la informacin requerida). No aumente la superficie con la barra de desplazamiento. Aunque es frecuente que se necesite el desplazamiento, la mayor parte de estudios indican que los usuarios preferiran no hacerlo. Es mejor reducir el contenido de la pgina o presentar en varias pginas el que sea necesario. Cuando se disee la distribucin hay que considerar la resolucin y tamao de la ventana del navegador.

1.2.5.2 Aspectos del diseo grfico.El diseo grfico toma en cuenta cada aspecto de la vista y sensacin de la webapp. El proceso de diseo grfico comienza con la distribucin y avanza hacia la consideracin de los esquemas de color globales; tipos, tamaos y estilos del texto; uso de medios complementarios (audio, video y animacin) y todos los dems elementos estticos de una aplicacin.

1.2.6 Diseo de la interfazCuando el usuario interacta con un sistema basado en computadora, se aplica un conjunto de principios fundamentales y lineamientos generales de diseo. Aunque las webapps plantean algunas dificultades especiales en el diseo de la interfaz de usuario, los principios y lineamientos bsicos son aplicables. Uno de los retos del diseo de la interfaz de las webapps es la naturaleza indeterminada del punto en el que entra el usuario. Es decir, ste puede ingresar por una ubicacin inicial de la webapp (la pgina de arranque, por ejemplo) o por algn vnculo en cierto nivel inferior de la arquitectura de aqulla. En algunos casos, la webapp se disea de modo que redirija al usuario a una ubicacin inicial, pero si esto es algo indeseable, entonces el diseo debe dar caractersticas de navegacin en la interfaz que acompaen a todos los objetos de contenido y de las cuales se disponga sin importar el modo en el que el usuario ingrese al sistema. Los objetivos de la interfaz de una webapp son los siguientes: 1) Establecer una ventana congruente en el contenido y las funciones que brinda, 2) Guiar al usuario a travs de una serie de interacciones con la webapp.3) Organizar las opciones de navegacin y contenido disponibles para el usuario.Para lograr una interfaz consistente, primero debe usarse un diseo esttico. Esto incluye muchas caractersticas, pero debe ponerse nfasis en la distribucin y la forma de los mecanismos de navegacin. Para guiar la interaccin del usuario, debe establecerse una metfora apropiada que permita al usuario tener una comprensin intuitiva de la interfaz. A fin de implementar las opciones de navegacin, puede seleccionarse alguno de los siguientes mecanismos: Mens de navegacin: contienen palabras clave (organizadas en forma vertical u horizontal) que enlistan contenido o funciones clave. Estos mens se implementan de modo que el usuario pueda elegir entre una jerarqua de subtemas que se despliegan al seleccionar la opcin principal en el men. Iconos grficos: botones, interruptores y otras imgenes similares que permiten que el usuario seleccione alguna propiedad o que especifique una decisin. Imgenes: cierta representacin grfica que el usuario selecciona para establecer un vnculo hacia un objeto de contenido o funcin de la webapp.

1.2.6.1 Aspectos del diseo grfico.El diseo grfico toma en cuenta cada aspecto de la vista y sensacin de la webapp. El proceso de diseo grfico comienza con la distribucin y avanza hacia la consideracin de los esquemas de color globales; tipos, tamaos y estilos del texto; uso de medios complementarios (audio, video y animacin) y todos los dems elementos estticos de una aplicacin.

ConclusinEl diseo es el lugar donde se establece la calidad de la webapp. El diseo de una webapp incluye seis etapas principales que son orientadas por la informacin obtenida durante la modelacin de los requerimientos. El diseo del contenido utiliza el contenido del modelo (desarrollado durante el anlisis) como la base para establecer el diseo de los objetos del contenido. El diseo esttico (tambin llamado diseo grfico) establece la vista y sensacin que el usuario final percibe. El diseo arquitectnico se centra en la estructura general de hipermedios de todos los objetos y funciones del contenido. El diseo de la interfaz establece la distribucin y mecanismos de distribucin que definen a la interfaz de usuario. El diseo de la navegacin define la forma en la que el usuario final navega a travs de la estructura de hipermedios. Y el diseo de los componentes representa la estructura interna detallada de los elementos funcionales de la webapp.

Fuentes Bibliogrficas

Captulo 13: diseo de webapps. (s.f) Internet. En lnea. Pgina web consultada el 17 de Febrero del 2015. Del sitio web: http://www.e-softdesign.com/wp-content/uploads/2014/07/INGENIERIA-DE-SOFTWARE-Capitulo13.pdf

Modelado de Diseo para Aplicaciones. (s.f) Internet. En lnea. Pgina web consultada el 17 de Febrero del 2015. Del sitio web: http://elchrboy.blogspot.mx/2010/03/modelado-de-diseno-para-aplicaciones.html

2.1 Diseo de sitios web. (s.f) Internet. En lnea. Pgina web consultada el 17 de Febrero del 2015. Del sitio web: http://148.204.208.183/taw%20apuntes%20web/Unidad%20II/2.1%20Dise%C3%B1o%20de%20sitios%20WEB.pdf

Modelado de anlisis para aplicaciones web.(s.f) Internet. En lnea. Pgina web consultada el 17 de Febrero del 2015. Del sitio web: http://es.slideshare.net/karinaarevalo22/modelado-de-anlisis-para-aplicaciones-webkarina?next_slideshow=1

Carretera a San Antonio Monterrey Km. 1.7, C. P. 70701, Salina Cruz, Oaxaca. Tels. 01 (971) 71 6 28 37 y 01 (971) 71 6 32 42, e-mail: [email protected] www.itsalinacruz.edu.mx

2