DiseñO Para Web App
-
Upload
uneve -
Category
Technology
-
view
110 -
download
4
description
Transcript of DiseñO Para Web App
DISEÑO PARA WebApp
Modelado
¿Qué es?¿Qué es?
• Modelo que guía la construcción de una WebApp.
Jakob NielsenJakob Nielsen: “En esencia, existen dos enfoques básicos del diseño:El ideal artístico de expresarse uno mismo yEl ideal de ingeniería de resolver un
problema para el cliente.
¿Por qué es importante?¿Por qué es importante?
Permite al Ingeniero Web crear un modelo que pueda valorarse en calidad y
Mejorarse antes de que se generen el contenido y el código.
El diseño es el lugar donde se establece la calidad de la WebApp.
Diseño en la IWeb…Diseño en la IWeb…
Cuestiones genéricas como específicas.
Genéricas: el diseño resulta en un modelo que guía la construcción de la WebApp.
Específicas: debe abordar atributos clave de una WebApp en una forma que permita al ingeniero Web construir y ponerla a prueba de manera efectiva.
Diseño y calidad de una WebApp….Diseño y calidad de una WebApp….
Es la actividad de ingeniería que conduce a un producto de gran calidad.
¿qué es calidad?
En los sistemas basados en Web, la facilidad de uso, funcionalidad, confiabilidad, eficiencia y facilidad de mantenimiento, proporcionan una base útil para valorar la calidad.
Susan Weinschenk….Susan Weinschenk….
“Si los productos se diseñan para encajar mejor en las tendencias naturales del comportamiento humano, entonces la gente estará más satisfecha, más completa y será más productiva.”
Árbol de requisitos de calidad en una WebAppÁrbol de requisitos de calidad en una WebApp
Metas de Diseño...Metas de Diseño...
No importa el dominio, tamaño o complejidad de la aplicación: Simplicidad. “Todo con medida” Consistencia. Mismo patrón. Identidad. Identificación con el usuario. Robustez. “promesa” implícita al usuario. El usuario
espera contenido y funciones que sean relevantes para sus necesidades.
Navegabilidad. Simple, consistente, intuitiva y predecible.
Apariencia visual. Compatibilidad. Una WebApp se utilizará en una
diversidad de ambientes: equipos tipos de conexión a internet, sistemas operativos, navegadores.
Pirámide del diseño IWebPirámide del diseño IWeb
Diseño de interfaz Diseño de interfaz
Características: Fácil de aprender Fácil de navegar Intuitiva Consistente Eficiente Libre de errores Funcional
Debe ofrecer al usuario final una experiencia satisfactoria y gratificante.
“Si un sitio es perfectamente utilizable pero carece de un estilo de diseño elegante y adecuado, fracasará.”
Curl Cloninger
“El mejor viaje es el que tiene el menor número de pasos. Acorte la distancia entre el usuario y su meta.”
Anónimo.
“La gente tiene muy poca paciencia con los sitios WWW pobremente diseñados.”
Jakob Nielsen y Annette Wagner.
También llamado diseño gráfico. Esfuerzo artístico que complementa los
aspectos técnicos de la Iweb. Sin él una WebApp puede ser funcional
pero no atractiva. Lleva a los usuarios a un mundo que
incluye un ámbito tanto emocional como intelectual.
Diseño estético efectivo jerarquía de usuarios del modelo de análisis.
Diseño estéticoDiseño estético
Sitios Web bien diseñadosSitios Web bien diseñados
En su artículo “The top twenty Web Design tips”, Marcelle Toor (http://www.graphics-design.com/Web/feature/tips.html), sugiere los siguientes sitos Web como ejemplos de buen diseño gráfico:
www.grantasticdesigns.com www.wpdfd.com www.workbook.com, sirve de aparador para el
trabajo de ilustradores y diseñadores. www.pbs.org/riverofsong, serie de televisión para
la radio y la televisión. www.rkdinc.com, firma de diseño. www.commarts.com, publicación para diseñadores
gráficos. www.btdnyc.com, firma de diseño.
Diseño de contenidoDiseño de contenido
Se enfoca en dos asuntos de diseño diferentes:Para los objetos de contenido,
mecanismos para establecer relaciones unos con otros (ingeniero Web).
Representación de información dentro de un objeto de contenido específico (la dirigen los publicistas y diseñadores gráficos)
Enlazado con las metas establecidas para la WebApp: Contenido que se presentará Usuarios que la visitarán Filosofía de navegación Arquitectura de contenido y arquitectura de la
WebApp. Forma en que los objetos de contenido se
estructuran para su presentación y navegación. Forma en que la aplicación se estructura para
gestionar la interacción del usuario.
Diseño arquitectónicoDiseño arquitectónico
Diseño de navegaciónDiseño de navegación
Acceso al contenido y las funciones de la Web. Identificar la semántica de navegación
para diferentes usuariosDefinir la mecánica (sintaxis) que logra
la navegación.Barras de navegaciónColumnas de navegaciónPestañasMapas de sitio
Casos de Uso:Casos de Uso:
Una estética de alto peinado.Una florería de primera.Una compañía que se dedica a la
venta de dispositivos de seguridad.Una banda musical nueva.Un acuarioUna agencia de modelos y
edecanes.
Fuente:Fuente:Fuente:Fuente:
“Ingeniería del software”, un enfoque práctico Roger S. Pressman Ed. McGraw Hill, sexta edición.
Páginas Web antes mencionadas.