Diseño de WEBAPPS

Ing. Arturo Sandoval Rivera

 WEBAPPS
• El diseño web abarca actividades técnicas
y otras que no lo son. La visión y el
sentido del contenido se desarrollan como
parte del diseño grafico, la plantilla
estética de la interfaz de usuario se crea
como parte de diseño de la interfaz y la
estructura técnica de la webapp se
modela como parte del diseño
arquitectónico y de navegación.
Árbol de requisitos de calidad
web
 Atributos Extendidos
• Seguridad.- se han integrado con base de
datos criticas, corporativas y
gubernamentales; la seguridad es de las
webapps son de capital importancia.
Rechazar accesos no autorizados, detener
ataques provenientes del exterior.
• Disponibilidad.- es la medida porcentual del
tiempo en que una webapps puede utilizarse.
• Escalabilidad.-deben poder manejar 10,100,
1000, etc. usuarios
• Tiempo para llegar al mercado
 Metas del diseño de webapps
• Simplicidad
• Consistencia
• Identidad
• Robustez
• Navegabilidad
• Atractivo Visual
• Compactibilidad
La web abarca seis diferentes tipos de diseño cada uno contribuye a la calidad
global de la web esto se puede ver por medio de la pirámide siguiente
 Diseño de la Interfaz WEB
• Es la naturaleza indeterminada del punto
en el que entra el usuario. Sus objetivos
son:
– Establecer una ventana congruente con el
contenido
– Guiar al usuarios a través de un a serie de
interacciones con la webapp
– Organizar las opciones de navegación y
contenidos disponibles para el usuario.
 Diseña de estética
También llamado diseño grafico, es una actividad artística que
complementa los aspectos técnicos del diseño de las webapps. Considera
aspecto de presentación y percepción de la web.
Aspectos de distribución. Se tiene una cantidad limitada de superficie, que
se utiliza para dar apoyo a la estética no funcional, características de
navegación, contenido de información y funciones dirigidas por el usuario.
Lineamientos a considerar:
– No tema al espacio en blanco
– Hacer énfasis en el contenido
– Organizar los elementos con la distribución que vaya de desde arriba a la izquierda
hacia abajo a la derecha.
– Agrupar la navegación, el contenido y la función en forma geométrica dentro de la
pagina.
– No aumente la superficie con la barra de desplazamiento.
– Cuando se diseñe la distribución hay que considerar la resolución y el tamaño de la
ventana del navegador.
 Diseño del contenido
Se centra en dos tareas diferentes del diseño,
cada uno de los cuales es dirigida por individuos
que poseen habilidades distintas.
– OBJETOS DE CONTENIDO.- Desarrollar una
representación del diseño para los objetos del
contenido y los mecanismos requeridos para
establecer una relación entre ellos.
– ASPECTOS DE DISEÑO DE CONTENIDO, crear
información dentro de un objeto de contenido
especifico.
 Diseño Arquitectónico
Esta ligado a las metas establecidas en el webapp, con
el contenido que se va a presentar, con los usuarios que
la visitaran y con la filosofía de navegación adoptada.
Arquitectura de contenido.- se centra en la manera en la
que los objetos del contenido (o compuestos como
pagina web) se estructuran para la presentación y la
navegación. Estructuras lineales, estructuras de mallas,
estructuras jerárquicas, estructura de red.
Arquitectura de la webapp.- describe la infraestructura
que permite que un sistema o aplicación basados en
web alcance los objetivos empresariales.
 Diseño de la navegación
• Aquí se define las rutas de navegación, que
permitan al usuario acceder al contenido y a las
funciones de las webapp.
• Semántica de la navegación.- conjunto de
estructuras de información navegación
relacionadas que colaboran para el cumplimiento
de un subconjunto de requerimientos del usuario.
• Sintaxis de navegación.- define la mecánica de la
navegación. Vínculos de navegación individual,
barra de navegación horizontal, columna de
navegación vertical, pestañas, mapas del sitio.
 Diseño en el nivel de
componentes
Las web modernas dan funciones de procesamiento
cada vez mas complejas que :
– Realizan un procesamiento localizado para generar
contenido y capacidad de navegación en forma dínamica.
– Proporcionan capacidad de computo o procesamiento de
datos que resultan apropiados para el dominio del negocio
webapp.
– Dan consulta y accesos complejos a bases de datos.
– Establecen interfaces de datos con sistemas corporativos
externos.
Para lograr estas capacidades se deben diseñarse y
construirse componentes de programas con forma
idéntica a los componentes de forma tradiconal.