SlideShare una empresa de Scribd logo
1 de 12
UNIVERSIDAD ESTATAL DE BOLIVAR

 FACULTAD DE CIENCIAS DE LA EDUCACION

  ESCUELA DE INFORMATICA EDUCATIVA

TRABAJO DE: DESARROLLO DE SOFTWARE 2

    CATEDRATICO LIC. MARCELO BAÑO

                TEMA:

MODELO DE DISEÑO PARA APLICACIONES WEB
Según Jakob Neilsen dos enfoques Básicos
del diseño : el ideal artístico de expresarle
     uno mismo y el ideal de ingeniería de
     resolver un problema para un cliente.
Seguridad


   Disponibilidad


    Escalabilidad


Tiempo en el mercado
Simplicidad




               Metas de
Consistencia                 Identidad
                diseño




                Robustez
anticipación




      Enfoque                                           Comunicación



                       Principios y
                       directrices
Flexibilidad
                      del diseño de
                        la interfaz                       consistencia




               eficiencia                  Autonomía
                                           controlada
El diseño estético, también llamado diseño
grafico es un esfuerzo artístico que
complementa los aspectos técnicos de la
ingeniería Web.
 El diseño estético considera aspectos de la
presentación y percepción de Web.
El diseño del contenido se enfoca en dos
asuntos de diseño diferente, cada uno lo
abordan    individuos  con    conjunto   de
habilidades. Además el diseño de contenidos
se ocupa de representar la información
dentro de un objeto.
El diseño arquitectónico esta enlazado con
las metas establecidas para la Web, el
contenido que representan, los usuarios que
la visitaran y la filosofía de navegación que se
establezca. El diseñador arquitectónico de
identificar la arquitectura de contenido y la
arquitectura de la Web.
Una vez establecida la arquitectura de la web
y la identificación de los componentes, el
diseñador debe definir las rutas de
navegación que habiliten para los usuarios el
acceso al contenido y las funciones de la web.
PATRONES DE DISEÑO HIPERMEDIA.
Son patrones de diseño en la ingeniera web que abarcan.
 Patrones de diseño Genérico.
 Patrones de diseño Hipermedia.
Otras categorías de patrones:
 Patrones arquitectónicos: Esto patrones auxilian en el diseño del
   contenido y la arquitectura.
 Patrones de construcción de componentes: Estos patrones recomienda
   métodos para combinar componentes.
 Patrones de navegación: Estos mas ayudan al diseño.
 Patrones de presentación: estos patrones auxilian en la presentación de
   contenidos.
 Patrones de interacción comportamiento / usuario: estos patrones auxilian
   en el diseño de la interacción usuario maquina.
METODOS DE DISEÑO HIPERMEDIA ORIENTADO A OBJETOS (MDHOO).
Durante las pasadas décadas se propusieron varios métodos de diseño para aplicaciones
web hasta la fecha ningún método es dominante. El método de diseño hipermedia
orientado a objetos esta compuesto de cuatro diferentes actividades de diseño.
 Diseño Conceptual.
 Diseño de Navegación.
 Diseño Abstracto de la Interfaz.
 Implementación.
Componentes
                           .
                    Parte numero
                    parte nombre    Factura de
 Habitación.          parte tipo    materiales.
Dimensiones          Descripción   Identificado
 Exterior de            Precio     r numero de
  ventanas                           artículos
 Exterior de                        Precio total
   puertas


                                       Articulo
                                      Cantidad
                                    Parte numero
                                    Parte, nombre
                                      Parte tipo
                   Pedido               Precio
               Pedido numero
                   Cliente
                 Factura de
                 materiales
                 Embarque
                  cobranza

Más contenido relacionado

La actualidad más candente

Metodologia de desarrollo de aplicaciones eorm
Metodologia de desarrollo de aplicaciones eormMetodologia de desarrollo de aplicaciones eorm
Metodologia de desarrollo de aplicaciones eormLeonardo Martinez
 
Metodologias para el desarrollo de aplicacones web
Metodologias para el desarrollo de aplicacones webMetodologias para el desarrollo de aplicacones web
Metodologias para el desarrollo de aplicacones webJosafat Mtz
 
Ingenieria Web
Ingenieria WebIngenieria Web
Ingenieria WebLiszeth
 
Ingenieria web
Ingenieria webIngenieria web
Ingenieria webarienneya
 
INGENIERIA WEB
INGENIERIA WEBINGENIERIA WEB
INGENIERIA WEBwilboyman
 
presentacion de software y estimacion de doste
presentacion de software y estimacion de dostepresentacion de software y estimacion de doste
presentacion de software y estimacion de dosteCAMILO
 
Proyecto de Software y Estimacion de Costo
Proyecto de Software y Estimacion de CostoProyecto de Software y Estimacion de Costo
Proyecto de Software y Estimacion de CostoCAMILO
 
PROYECTOS DE SOFTWARE Y COSTOS
PROYECTOS DE SOFTWARE Y COSTOSPROYECTOS DE SOFTWARE Y COSTOS
PROYECTOS DE SOFTWARE Y COSTOSCAMILO
 
Introducción a la ingeniería web
Introducción a la ingeniería webIntroducción a la ingeniería web
Introducción a la ingeniería webCarlos Van de Velde
 
Exp. Ingenieria Web
Exp. Ingenieria WebExp. Ingenieria Web
Exp. Ingenieria WebDiego Celi
 
050608 architect academy webcast 1
050608 architect academy webcast 1050608 architect academy webcast 1
050608 architect academy webcast 1juliank13
 

La actualidad más candente (18)

Metodologia de desarrollo de aplicaciones eorm
Metodologia de desarrollo de aplicaciones eormMetodologia de desarrollo de aplicaciones eorm
Metodologia de desarrollo de aplicaciones eorm
 
Metodologia Diseño Web
Metodologia Diseño WebMetodologia Diseño Web
Metodologia Diseño Web
 
Metodologias para el desarrollo de aplicacones web
Metodologias para el desarrollo de aplicacones webMetodologias para el desarrollo de aplicacones web
Metodologias para el desarrollo de aplicacones web
 
Ingenieria Web
Ingenieria WebIngenieria Web
Ingenieria Web
 
OOWS
OOWSOOWS
OOWS
 
Ingenieria web
Ingenieria webIngenieria web
Ingenieria web
 
Modelado web
Modelado webModelado web
Modelado web
 
Ingenieria web
Ingenieria webIngenieria web
Ingenieria web
 
Ingenieria web
Ingenieria webIngenieria web
Ingenieria web
 
Ingeniería web
Ingeniería webIngeniería web
Ingeniería web
 
INGENIERIA WEB
INGENIERIA WEBINGENIERIA WEB
INGENIERIA WEB
 
presentacion de software y estimacion de doste
presentacion de software y estimacion de dostepresentacion de software y estimacion de doste
presentacion de software y estimacion de doste
 
Proyecto de Software y Estimacion de Costo
Proyecto de Software y Estimacion de CostoProyecto de Software y Estimacion de Costo
Proyecto de Software y Estimacion de Costo
 
PROYECTOS DE SOFTWARE Y COSTOS
PROYECTOS DE SOFTWARE Y COSTOSPROYECTOS DE SOFTWARE Y COSTOS
PROYECTOS DE SOFTWARE Y COSTOS
 
Introducción a la ingeniería web
Introducción a la ingeniería webIntroducción a la ingeniería web
Introducción a la ingeniería web
 
Exp. Ingenieria Web
Exp. Ingenieria WebExp. Ingenieria Web
Exp. Ingenieria Web
 
050608 architect academy webcast 1
050608 architect academy webcast 1050608 architect academy webcast 1
050608 architect academy webcast 1
 
La Ingeniería Web
La Ingeniería WebLa Ingeniería Web
La Ingeniería Web
 

Destacado

Redes de computadoras
Redes de computadorasRedes de computadoras
Redes de computadorasIsabel Corrao
 
Clasificacion de redes
Clasificacion de redesClasificacion de redes
Clasificacion de redesjohanra
 
Red De Computadoras
Red De ComputadorasRed De Computadoras
Red De Computadorasguest896c6a
 
Clasificación de las Redes
Clasificación de las RedesClasificación de las Redes
Clasificación de las Redesnoebiolatto
 
Tipos de redes
Tipos de redesTipos de redes
Tipos de redesrircmx
 
¿Cómo hacer un informe escrito?
¿Cómo hacer un informe escrito?¿Cómo hacer un informe escrito?
¿Cómo hacer un informe escrito?Osvaldo Igor
 

Destacado (7)

Tpa diego perez
Tpa diego perezTpa diego perez
Tpa diego perez
 
Redes de computadoras
Redes de computadorasRedes de computadoras
Redes de computadoras
 
Clasificacion de redes
Clasificacion de redesClasificacion de redes
Clasificacion de redes
 
Red De Computadoras
Red De ComputadorasRed De Computadoras
Red De Computadoras
 
Clasificación de las Redes
Clasificación de las RedesClasificación de las Redes
Clasificación de las Redes
 
Tipos de redes
Tipos de redesTipos de redes
Tipos de redes
 
¿Cómo hacer un informe escrito?
¿Cómo hacer un informe escrito?¿Cómo hacer un informe escrito?
¿Cómo hacer un informe escrito?
 

Similar a Modelo de diseño para aplicaciones web

Los Elementos de la experiencia de usuario | TransCyberiano 2010 | Manfred Pé...
Los Elementos de la experiencia de usuario | TransCyberiano 2010 | Manfred Pé...Los Elementos de la experiencia de usuario | TransCyberiano 2010 | Manfred Pé...
Los Elementos de la experiencia de usuario | TransCyberiano 2010 | Manfred Pé...Seminario TransCyberiano
 
Metodología del diseño de sitios web educativos
Metodología del diseño de sitios web educativosMetodología del diseño de sitios web educativos
Metodología del diseño de sitios web educativosEdward Bermúdez M.
 
Metricas Orientada a Operacion, Metricas de Interfaz de Usuario y WebApps‏
Metricas Orientada a Operacion, Metricas de Interfaz de Usuario y WebApps‏Metricas Orientada a Operacion, Metricas de Interfaz de Usuario y WebApps‏
Metricas Orientada a Operacion, Metricas de Interfaz de Usuario y WebApps‏David Leon Sicilia
 
Experiencia Interaccion Interfaces
Experiencia Interaccion InterfacesExperiencia Interaccion Interfaces
Experiencia Interaccion InterfacesGonzalo Auza
 
DiseñO Para Web App
DiseñO Para Web AppDiseñO Para Web App
DiseñO Para Web Appuneve
 
Introducción al Diseño Web
Introducción al Diseño WebIntroducción al Diseño Web
Introducción al Diseño WebLorena Guerrero
 
Presentacion interfaz hombre_maquina
Presentacion interfaz hombre_maquinaPresentacion interfaz hombre_maquina
Presentacion interfaz hombre_maquinaulises1305
 
Presentacion interfaz hombre_maquina
Presentacion interfaz hombre_maquinaPresentacion interfaz hombre_maquina
Presentacion interfaz hombre_maquinaulises1305
 
metodologia desarrollo_sistemas_hipermedia_orientada_objetos
metodologia desarrollo_sistemas_hipermedia_orientada_objetosmetodologia desarrollo_sistemas_hipermedia_orientada_objetos
metodologia desarrollo_sistemas_hipermedia_orientada_objetosMayta Coronel
 
Unidad 4 diseño de interfaces hombre máquina
Unidad 4 diseño de interfaces hombre máquinaUnidad 4 diseño de interfaces hombre máquina
Unidad 4 diseño de interfaces hombre máquinaalastar16
 
Universidad estatal de bolivar
Universidad estatal de bolivarUniversidad estatal de bolivar
Universidad estatal de bolivarrolex_ueb
 
Universidad estatal de bolivar
Universidad estatal de bolivarUniversidad estatal de bolivar
Universidad estatal de bolivarChino CT
 
Universidad estatal de bolivar
Universidad estatal de bolivarUniversidad estatal de bolivar
Universidad estatal de bolivarChino CT
 
Universidad estatal de bolivar
Universidad estatal de bolivarUniversidad estatal de bolivar
Universidad estatal de bolivarChino CT
 
PiX una herramienta para la comunidad UX
PiX una herramienta para la comunidad UXPiX una herramienta para la comunidad UX
PiX una herramienta para la comunidad UXKatherine Exss
 
Seminario Metodos De Trabajo Revit 2011
Seminario Metodos De Trabajo Revit 2011Seminario Metodos De Trabajo Revit 2011
Seminario Metodos De Trabajo Revit 2011marielruartes
 

Similar a Modelo de diseño para aplicaciones web (20)

Los Elementos de la experiencia de usuario | TransCyberiano 2010 | Manfred Pé...
Los Elementos de la experiencia de usuario | TransCyberiano 2010 | Manfred Pé...Los Elementos de la experiencia de usuario | TransCyberiano 2010 | Manfred Pé...
Los Elementos de la experiencia de usuario | TransCyberiano 2010 | Manfred Pé...
 
Metodología del diseño de sitios web educativos
Metodología del diseño de sitios web educativosMetodología del diseño de sitios web educativos
Metodología del diseño de sitios web educativos
 
Metricas Orientada a Operacion, Metricas de Interfaz de Usuario y WebApps‏
Metricas Orientada a Operacion, Metricas de Interfaz de Usuario y WebApps‏Metricas Orientada a Operacion, Metricas de Interfaz de Usuario y WebApps‏
Metricas Orientada a Operacion, Metricas de Interfaz de Usuario y WebApps‏
 
oohdm
oohdmoohdm
oohdm
 
Roles del diseñador digital
Roles del diseñador digitalRoles del diseñador digital
Roles del diseñador digital
 
Experiencia Interaccion Interfaces
Experiencia Interaccion InterfacesExperiencia Interaccion Interfaces
Experiencia Interaccion Interfaces
 
Unidad 4
Unidad 4Unidad 4
Unidad 4
 
DiseñO Para Web App
DiseñO Para Web AppDiseñO Para Web App
DiseñO Para Web App
 
Introducción al Diseño Web
Introducción al Diseño WebIntroducción al Diseño Web
Introducción al Diseño Web
 
Presentacion interfaz hombre_maquina
Presentacion interfaz hombre_maquinaPresentacion interfaz hombre_maquina
Presentacion interfaz hombre_maquina
 
Presentacion interfaz hombre_maquina
Presentacion interfaz hombre_maquinaPresentacion interfaz hombre_maquina
Presentacion interfaz hombre_maquina
 
metodologia desarrollo_sistemas_hipermedia_orientada_objetos
metodologia desarrollo_sistemas_hipermedia_orientada_objetosmetodologia desarrollo_sistemas_hipermedia_orientada_objetos
metodologia desarrollo_sistemas_hipermedia_orientada_objetos
 
Inter tecno clase 01 - plan asignatura
Inter tecno   clase 01 - plan asignaturaInter tecno   clase 01 - plan asignatura
Inter tecno clase 01 - plan asignatura
 
Unidad 4 diseño de interfaces hombre máquina
Unidad 4 diseño de interfaces hombre máquinaUnidad 4 diseño de interfaces hombre máquina
Unidad 4 diseño de interfaces hombre máquina
 
Universidad estatal de bolivar
Universidad estatal de bolivarUniversidad estatal de bolivar
Universidad estatal de bolivar
 
Universidad estatal de bolivar
Universidad estatal de bolivarUniversidad estatal de bolivar
Universidad estatal de bolivar
 
Universidad estatal de bolivar
Universidad estatal de bolivarUniversidad estatal de bolivar
Universidad estatal de bolivar
 
Universidad estatal de bolivar
Universidad estatal de bolivarUniversidad estatal de bolivar
Universidad estatal de bolivar
 
PiX una herramienta para la comunidad UX
PiX una herramienta para la comunidad UXPiX una herramienta para la comunidad UX
PiX una herramienta para la comunidad UX
 
Seminario Metodos De Trabajo Revit 2011
Seminario Metodos De Trabajo Revit 2011Seminario Metodos De Trabajo Revit 2011
Seminario Metodos De Trabajo Revit 2011
 

Modelo de diseño para aplicaciones web

  • 1. UNIVERSIDAD ESTATAL DE BOLIVAR FACULTAD DE CIENCIAS DE LA EDUCACION ESCUELA DE INFORMATICA EDUCATIVA TRABAJO DE: DESARROLLO DE SOFTWARE 2 CATEDRATICO LIC. MARCELO BAÑO TEMA: MODELO DE DISEÑO PARA APLICACIONES WEB
  • 2. Según Jakob Neilsen dos enfoques Básicos del diseño : el ideal artístico de expresarle uno mismo y el ideal de ingeniería de resolver un problema para un cliente.
  • 3. Seguridad Disponibilidad Escalabilidad Tiempo en el mercado
  • 4. Simplicidad Metas de Consistencia Identidad diseño Robustez
  • 5. anticipación Enfoque Comunicación Principios y directrices Flexibilidad del diseño de la interfaz consistencia eficiencia Autonomía controlada
  • 6. El diseño estético, también llamado diseño grafico es un esfuerzo artístico que complementa los aspectos técnicos de la ingeniería Web. El diseño estético considera aspectos de la presentación y percepción de Web.
  • 7. El diseño del contenido se enfoca en dos asuntos de diseño diferente, cada uno lo abordan individuos con conjunto de habilidades. Además el diseño de contenidos se ocupa de representar la información dentro de un objeto.
  • 8. El diseño arquitectónico esta enlazado con las metas establecidas para la Web, el contenido que representan, los usuarios que la visitaran y la filosofía de navegación que se establezca. El diseñador arquitectónico de identificar la arquitectura de contenido y la arquitectura de la Web.
  • 9. Una vez establecida la arquitectura de la web y la identificación de los componentes, el diseñador debe definir las rutas de navegación que habiliten para los usuarios el acceso al contenido y las funciones de la web.
  • 10. PATRONES DE DISEÑO HIPERMEDIA. Son patrones de diseño en la ingeniera web que abarcan.  Patrones de diseño Genérico.  Patrones de diseño Hipermedia. Otras categorías de patrones:  Patrones arquitectónicos: Esto patrones auxilian en el diseño del contenido y la arquitectura.  Patrones de construcción de componentes: Estos patrones recomienda métodos para combinar componentes.  Patrones de navegación: Estos mas ayudan al diseño.  Patrones de presentación: estos patrones auxilian en la presentación de contenidos.  Patrones de interacción comportamiento / usuario: estos patrones auxilian en el diseño de la interacción usuario maquina.
  • 11. METODOS DE DISEÑO HIPERMEDIA ORIENTADO A OBJETOS (MDHOO). Durante las pasadas décadas se propusieron varios métodos de diseño para aplicaciones web hasta la fecha ningún método es dominante. El método de diseño hipermedia orientado a objetos esta compuesto de cuatro diferentes actividades de diseño.  Diseño Conceptual.  Diseño de Navegación.  Diseño Abstracto de la Interfaz.  Implementación.
  • 12. Componentes . Parte numero parte nombre Factura de Habitación. parte tipo materiales. Dimensiones Descripción Identificado Exterior de Precio r numero de ventanas artículos Exterior de Precio total puertas Articulo Cantidad Parte numero Parte, nombre Parte tipo Pedido Precio Pedido numero Cliente Factura de materiales Embarque cobranza