DISEÑO M

DHOO

MÉTO

DO

DE D

I SEÑ

O D

E

HI P

ERM

EDIA

OR

I EN

TAD

O A

OB

J ETO

S

Object Oriented Hypermedia Design

Methodology.Diseñado por D. Schwabe,

G. Rossi, y S. D. J. Barbosa.

Es una extensión de HDM con

orientación a objetos, para diseño de

aplicaciones hipermedia y para la Web.

Ha sido usada para diseñar diferentes

tipos de aplicaciones como:

-galerías interactivas-presentaciones multimedia  -numerosos sitios web.hipertexto: texto en formato no secuencial, compuesto

de nodos y enlaces que los interconectanmultimedia: unión de diferentes medios o morfologías de la información, como texto, gráficos, audio, vídeo, otros recursos audiovisuales, etc. hipermedia: hipertexto + multimediaMDH: Modelo de Diseño de Hipermedia

Propone el desarrollo de aplicaciones hipermedia mediante un

proceso de 4 etapas:

diseño conceptual

diseño navegacional

diseño de interfaces abstractas

Implementación

DISEÑO CONCEPTUAL • se construye un esquema conceptual representado por los objetos

de dominio o clases y las relaciones entre dichos objetos.

• Se puede usar un modelo de datos semántico estructural (como el modelo de entidades y relaciones).

• Propone como esquema conceptual basado en clases, relaciones ysubsistemas.

DISEÑO NAVEGACIONAL

• Un contexto navegacional es un conjunto de nodos, enlaces, clases de contextos y otros contextos navegacionales.

• el modelo hipermedia está definido en dos niveles de abstracción: las clases navegacionales y los contextos navegacionales.

• En el momento de la especificación de las clases navegacionales es cuando el diseñador define las correspondencias.

Se define clases navegacionales tales como nodos, 

enlaces y estructuras de

acceso (índices y visitas guiadas) inducidas del

esquema conceptual.

Se describe la estructura

navegacional en términos

de contextos navegacionales.

especificación de las clases

navegacionales

DISEÑO DE INTERFACES ABSTRACTAS

• Especificación de la interfaz abstracta. Así, se define la forma en la cual deben aparecer los contextos navegacionales.

• También se incluye aquí el modo en que dichos objetos de interfaz activarán la navegación y el resto de funcionalidades de la aplicación, esto es, se describirán los objetos de interfaz y se los asociará con objetos de navegación.

• La separación entre el diseño navegacional y el diseño de interfaz abstracta permitirá construir diferentes interfaces para el mismo modelo navegacional.

Interfaz: elemento que permite al usuario interactuar con los contenidos, no sólo se precisa una interfaz atractiva, sino funcional. 

IMPLEMENTACIÓN

Es la puesta en práctica, es donde se hacen corresponder los objetos

de interfaz con los objetos de implementación.

HERRAMIENTA

S PARA

DESARROLLO D

E

MODELOS W

EB

CSS GRID BUILDER• Es un GUI (interfaz gráfica de usuario) en línea para personalizar

plantillas web con ligero CSS elaborado por Yahoo! que viene con más de 1000 combinaciones de diseño de páginas.

• permite generar una rápida web basada en CSS que soporta estándares de diseño de páginas en cuestión de minutos (o incluso segundos).

• Una vez que tengas el diseño de tu página solo tienes que pulsar “Ver código” y se genera el HTML.

• no es necesario colocar en tu servidor web el archivo CSS (esto permite ahorrar ancho de banda y algunos problemas de mantenimiento), este será respaldado en los servidores de Yahoo!’s Developer Network API.

•  permite cargar la totalidad de tus imágenes pero antes debes subirlas comprimidas en un archivo .Zip mientras genera el CSS necesario para tu sitio.

CSS: es un lenguaje usado para definir y crear la presentación de un documento estructurado escrito en HTML

BLUEPRINT APLICACIÓN PARA CSS

Es una aplicación para hojas de estilos, que tiene por objeto reducir su tiempo en el desarrollo CSS. Brinda una sólida base CSS para

construir tu proyecto con un simple sistema de grilla, fácil uso de tipografías e incluso una hoja de estilos para impresión.

CSSTIDY

• Aplicación de código abierto que analiza, fija y optimiza el código CSS para reducir el tamaño del archivo y también para normalizar automáticamente el formato de código CSS.

• Elimina los estilos y propiedades que considera redundante.Puedes ajustar la configuración de CSSTidy a tu nivel preferido de compresión, pero incluso la configuración por defecto te da el 30% de compresión.

LOGICSS. APLICACIÓN PARA CSS

• Colección de archivos CSS y PHP utilidades destinadas a reducir el tiempo de desarrollo web.

• Permite a los desarrolladores crear web personalizables fijas, elásticas o fluidas (líquidos). Echa un vistazo a la vista previa de su herramienta para generación de código CSS

LAYOUTS APLICACIÓN PARA CSS

• Es un creador de CSS que puede ser usado para crear web, soporta estándares de diseños de página.

• Ofrece 5 opciones predefinidas de anchos que soporta ancho tipo líquido o fijo.

DOMTOOL

• Fue creado para reducir el tiempo que tarda el código en estructuras DOM.

• DOM tiene opciones tan simples como copiar su código HTML en el DOMTool y a continuación, hacer clic en un botón.

FIREBUG

• Es una extensión de Mozilla Firefox que te da una gran cantidad de herramientas de desarrollo web y características.

• Permite moverte por su código así como permite realizar puntos de referencia para ver por qué el script es lento o débil.

• Se puede capturar rápidamente CSS, HTML, JavaScript, XML y los errores a través de Firebug, incluso te permite filtrar y buscar errores específicos.

METODOLO

GÍAS D

E

DESARROLLO PA

RA SIT

IOS

WEB

FASE I. FASE SE ANÁLISIS1. Definición de Objetivos del Sitio: Evaluación de los objetivos,

metas, necesidades y requerimientos técnicos del usuario.

2. Definición de Audiencia: estudio de otros sitios relacionados y a que usuarios será dirigida.

3. Expectativas de la Organización: arquitectura del mapa de sitio, los requerimientos técnicos, estrategias de posicionamiento y desarrollo, deberes y recomendaciones generales para el éxito de su sitio

FASE II. FASE DE PLANIFICACIÓN.

1. Selección Del Hardware

2. Selección del Software

3. Selección del Equipo de Trabajo

4. Benchmarking

5. Estructura de Navegación

6. Costos de Inversión

7. Beneficios a obtener.

8. Instrumentos de seguimiento

FASE III. FASE DE CONTENIDO.

1. Contenido Conceptual

2. Contenido Practico

3. Diagrama de Interacción con los Usuarios.

FASE IV. FASE DE DISEÑO.

1. Usabilidad2. Accesibilidad

FASE V. PROGRAMACIÓN.

1. Base de Datos

2. Programación Intermedia.

3. Interfaz

FASE VI. FASE DE TESTEO.1. Comprobación en Navegadores2. Detectar los vínculos rotos3. Comprobar tiempo de descarga

FASE VII. FASE DE MERCADEO Y PUBLICIDAD.1. Derechos internacionales del Autor

2. Publicidad

METODOLOGÍA RAD...

• Es un proceso de desarrollo de software, desarrollado inicialmente por James Martin en1980.

• El método comprende el desarrollo interactivo, la construcción de prototipos y el uso de utilidades CASE (Computer Aided Software Engineering).

• Tradicionalmente, el desarrollo rápido de aplicaciones tiende a englobar también la usabilidad, utilidad y la rapidez de ejecución.

FASES DEL RAD

Modelado de gestión: el flujo de información entre las funciones de gestión se modela de forma que responda a las siguientes preguntas: ¿Qué información conduce el proceso de gestión? ¿Qué información se genera? ¿Quién la genera? ¿A dónde va la información? ¿Quién la proceso?

Modelado de datos: el flujo de información definido como parte de la fase de modelado de gestión se refina como un conjunto de objetos de datos necesarios para apoyar la empresa. Se definen las características (llamadas atributos) de cada uno de los objetos y las relaciones entre estos objetos.

Modelado de proceso: los objetos de datos definidos en la fase de modelado de datos quedan transformados para lograr el flujo de información necesario para implementar una función de gestión. Las descripciones del proceso se crean para añadir, modificar, suprimir, o recuperar un objeto de datos. Es la comunicación entre los objetos.

Generación de aplicaciones: El DRA asume la utilización de técnicas de cuarta generación. En lugar de crear software con lenguajes de programación de tercera generación, el proceso DRA trabaja para volver a utilizar componentes de programas ya existentes (cuando es posible) o a crear componentes reutilizables (cuando sea necesario). En todos los casos se utilizan herramientas automáticas para facilitar la construcción del software.

Pruebas de entrega: Como el proceso DRA enfatiza la reutilización, ya se han comprobado muchos de los componentes de los programas. Esto reduce tiempo de pruebas. Sin embargo, se deben probar todos los componentes nuevos y se deben ejercitar todas las interfaces a fondo.

MODELO EN ESPIRAL

• Combina las principales ventajas del modelo de ciclo de vida en cascada y del modelo de construcción de prototipos.

• Proporciona un modelo evolutivo para el desarrollo de sistemas de software complejos, mucho más realista que el ciclo de vida clásico, y permite la utilización de prototipos en cualquier etapa de la evolución del proyecto.

•  incorpora en el ciclo de vida el análisis de riesgos. (que ya veremos lo que es). Los prototipos se utilizan como mecanismo de reducción del riesgo, permitiendo finalizar el proyecto antes de haberse embarcado en el desarrollo del producto final, si el riesgo es demasiado grande.

FASES

• Planificación.• Análisis de riesgo.• Ingeniería.• Evaluación del cliente.

PLANIFICACIÓN

Determinar los objetivos del proyecto, las posibles alternativas y las restricciones.

.

ANÁLISIS DE RIESGO

• Identificar los riesgos.Pueden ser: riesgos del proyecto (presupuestarios, de organización, del cliente. etc.), riesgos

técnicos (problemas de diseño, codificación, mantenimiento), riesgos del negocio (riesgos de mercado: que se adelante la competencia o que el producto no se venda bien).

• Estimación de riesgos.Consiste en evaluar, para cada riesgo identificado, la probabilidad de que ocurra y las

consecuencias, es decir, el coste que tendrá en caso de que ocurra.

• Evaluación de riesgos.Consiste en establecer unos niveles de referencia para el incremento de coste, de duración del

proyecto y para la degradación de la calidad que si se superan harán que se interrumpa el proyecto.

Luego hay que relacionar cuantitativamente cada uno de los riesgos con estos niveles de referencia, de forma que en cualquier momento del proyecto podamos calcular si hemos superado alguno de los niveles de referencia.

• Gestión de riesgos.Consiste en supervisar el desarrollo del proyecto, de forma que se detecten los riesgos tan pronto

como aparezcan, se intenten minimizar sus daños y exista un apoyo previsto para las tareas críticas (aquéllas que más riesgo encierran).

INGENIERÍA

• desarrollo del sistema o de un prototipo del mismo.

• La codificación consiste en la traducción del diseño a un formato que sea legible para la máquina.

• Si el diseño es lo suficientemente detallado, la codificación es relativamente sencilla, y puede hacerse de forma automática, usando generadores de código.

• Representación del software de forma que pueda conocerse la arquitectura, funcionalidad e incluso la calidad del mismo antes de comenzar la codificación.

EVALUACIÓN DEL CLIENTE

Evaluar el prototipo y con sus comentarios, se procede a refinar los requisitos y a reajustar la planificación inicial, volviendo a empezar el ciclo.

MODELO DE PROCESO UNIFICADO

• Esta dirigido por casos de uso, centrado en la arquitectura y por ser iterativo e incremental.

• El refinamiento más conocido y documentado del Proceso Unificado es el Proceso Unificado de Rational o simplemente RUP.

INICIO

•  Se define el negocio: facilidad de realizar el proyecto, se presenta un modelo, visión, metas, deseos del usuario, plazos, costos .

• Se evalúa la viabilidad “técnica, operacional, económica y legal”

ELABORACIÓN

Visión refinada del proyecto a realizar, la implementación iterativa del núcleo de la aplicación, la resolución de riesgos altos, nuevos requisitos y se ajustan las estimaciones.

CONSTRUCCIÓNEvolución hasta convertirse en producto listo incluyendo requisitos mínimos. Aquí se afinan los detalles menores como los diferentes tipos de casos o los riesgos menores.

TRANSICIÓN

• El programa debe estar listo para ser probado, instalado y utilizado por el cliente sin ningún problema.

• Una vez finalizada esta fase, se debe comenzar a pensar en futuras novedades para la misma.

• Desde el punto de vista Técnico: el proyecto está formado por los flujos de trabajo fundamentales: captura de requerimientos, análisis, diseño, implementación y pruebas.