Your SlideShare is downloading. ×
  • Like
DiseñO Para Web App
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Now you can save presentations on your phone or tablet

Available for both IPhone and Android

Text the download link to your phone

Standard text messaging rates apply

DiseñO Para Web App

  • 8,642 views
Published

Ingenieria en comunicación multimedia UNEVE

Ingenieria en comunicación multimedia UNEVE

Published in Technology , Business
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
8,642
On SlideShare
0
From Embeds
0
Number of Embeds
3

Actions

Shares
Downloads
264
Comments
0
Likes
1

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. DISEÑO PARA WebApp Modelado
  • 2. ¿Qué es?
      • Modelo que guía la construcción de una WebApp.
      • Jakob Nielsen : “En esencia, existen dos enfoques básicos del diseño:
        • El ideal artístico de expresarse uno mismo y
        • El ideal de ingeniería de resolver un problema para el cliente.
  • 3. ¿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.
  • 4. 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.
  • 5. 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.
  • 6. 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.”
  • 7. Árbol de requisitos de calidad en una WebApp
  • 8. 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.
  • 9. Pirámide del diseño IWeb
  • 10. 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 .
  • 11.
    • “ 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.
  • 12.
    • 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ético
  • 13. Sitios 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.
  • 14. Diseñ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)
  • 15.
    • 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ónico
  • 16. Diseño de navegación
    • Acceso al contenido y las funciones de la Web.
      • Identificar la semántica de navegación para diferentes usuarios
      • Definir la mecánica (sintaxis) que logra la navegación.
        • Barras de navegación
        • Columnas de navegación
        • Pestañas
        • Mapas de sitio
  • 17. 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 acuario
    • Una agencia de modelos y edecanes.
  • 18. Fuente:
    • “ Ingeniería del software ”, un enfoque práctico
    • Roger S. Pressman
    • Ed. McGraw Hill, sexta edición.
    • Páginas Web antes mencionadas.