SISTEMA ACADEMICO INTEGRADO APARIENCIA DINAMICA WEB

Transcripción

1 SISTEMA ACADEMICO INTEGRADO APARIENCIA DINAMICA WEB

2 Marjorie Arias Julia Macías Marcos Maldonado

3 Misión: Nuestra Misión es proveer estándares gráficos a las páginas de todos los proyectos y permitir al usuario modificar la apariencia.

4 Visión: Nuestra Visión es ser el mayor proveedor de diseños visuales de páginas para administradores y usuarios de sistemas educativos de toda índole.

5 Objetivos Generales *Integrar los módulos *Evitar los problemas de visión y stress

6 Objetivos Específicos Mostrarle en forma dinámica Proveer de un Menú de plantillas Influir con los colores Tener flexibilidad para integrar más módulos

7 Herramientas utilizadas: Servidor: Apache Tomcat Base de Datos: POSTGRES Herramienta de Desarrollo: JDEVELOPER JSP Servlets CSS JavaScript XML Herramienta de Diseño: HTML Macromedia Gif, Jpg, PNG

8 Servidor Apache Tomcat Tomcat funciona como un contenedor de servlets. Tomcat implementa las especificaciones de los servlets y de Java Servlet Pages (JSP) de. Se le considera un servidor de aplicaciones y servidor web.

9 APLICACIÓN WEB El nivel de interfaz de usuario El nivel de lógica de negocio. El nivel de datos Servidores de aplicaciones Un servidor de aplicaciones es un servidor web con capacidad de procesamiento

10 JSP Es una tecnología para crear aplicaciones web. Es un desarrollo de la compañía Sun Microsystems Trabaja con java ( escríbelo una vez corrélo donde sea )

11 Servlet Los servlets son objetos que corren dentro del contexto de un servidor web o contenedor J2EE, fue especialmente diseñado para ofrecer contenido dinámico desde un servidor web

12 JDEVELOPER Es un Entorno de Desarrollo Integrado, un programa compuesto por un conjunto de herramientas para un programador.

13 POSTGRES PostgreSQL es un servidor de base de datos relacional libre, liberado bajo la licencia BSD. Es una alternativa a otros sistemas de bases de datos de código abierto

14 HTML El HTML, lenguaje de marcas hipertextuales, diseñado para estructurar textos y presentarlos en forma de hipertexto, que es el formato estándar de las páginas web.

15 CSS CSS: Hojas de estilo en cascada (Cascading Style Sheets) utilizadas para definir la presentación de un documento HTML o XML. Separar la estructura de un documento de su presentación.

16 JAVA SCRIPT JavaScript no es un lenguaje orientado a objetos, ya que no dispone de Herencia, es más bien orientado a eventos.

17 MACROMEDIA Sotware adicional: Macromedia Dreamweaver Macromedia Flash Macromedia Fireworks

18 XML Por lo tanto XML no es realmente un lenguaje en particular, sino una manera de definir lenguajes para diferentes necesidades

19 GIF, JPG, PNG Gif: formato gráfico utilizado ampliamente en la www, tanto para imágenes como para animaciones. Jpg: trata imágenes fijas Png: permite almacenar imágenes con una mayor profundidad de color y otros importantes datos.

20 PARA LA INTEGRACION Las librerías Las clases: en el directorio SRC source (paquetes) Strut config: tener todo el mapeo de ellos Se pegan los jsp En el menú link al action Poner el código tiles put Action

21 Colores M J T

22 Para Recordar Está demostrado que los nueve primeros segundos en los que una persona contempla nuestra página son cruciales, y de ellos depende que esta continúe con agrado navegando por nuestro sitio, lo haga con indiferencia o nos abandone. Y de lo que ve en estos segundos lo que tal vez mas llame y capte su atención sea la distribución y la gama de colores de nuestra página.

23 El ojo humano puede distinguir aproximadamente entre 7 y 10 millones de colores Los equipos de antes utilizaban un nivel grafico trabajan tan sólo con 256 colores. Actualmente, los equipos informáticos cuentan con memorias de hasta 64 megas, que desarrollan un trabajo de millones de texels.

24 Pero a la hora de la verdad?de cuantos colores disponemos para trabajar los diseñadores web?.

25 La paleta de color segura. Websafe y Reallysafe #FFFFF F #FFFF6 6 #FFFF3 3 #FFFF0 0 #CCFF6 6 #66FFF F #66FF3 3 #66FF0 0 #33FFF F #33FFC C #33FF6 6 #33FF3 3 #00FFF F #00FFC C #00FF6 6 #00FF0 0 #FF00F F #FF003 3 #FF000 0 #0000F F # # paleta web realmente segura de 22 colores Como comprenderéis, trabajar tan sólo con estos 22 colores no nos va a permitir construir un sitio web muy atractivo, ya que la limitación impuesta resulta excesiva.

26 Tipos de Color El punto de vista sustractivo El punto de vista aditivo

27 Otras formas de Dividir los colores colores calido y fríos colores claros y oscuros

28 Propiedades de los colores Matiz (Hue):es el estado puro del color Rueda de matices Saturación o Intensidad: se refiere a la viveza o palidez de un color. -Saturados Fríos Cálidos +Saturados Valor (value) o Brillo: es la intensidad con más claridad u obscuridad en el color. (-60%) C30001 (-30%) E50001 (0%) FF0000 (30%) FF1E1F (60%) FE3C3A brillos del rojo M J T

29 Accediendo al Sistema M J T

30 Bienvenida al Sistema M J T

31 Plantillas Predeterminadas M J T

32 Personalizando tu Pantalla M J T

33

34 defaultlayout.jsp Stylo.jsp template.jsp header.jsp menu.jsp copyright.jsp barra.jsp ESTRUCTURA DE UNA PAGINA CON TILES

35 ESTRUCTURA DEL MAPEADO DEL MODULO DE APARIANCIA WEB (Strut Config) Usuario.jsp User,Pass PersonaBO (valida User,clave) ValidaUsuarioAction PersonaDAO (valida User,clave) PlantillaDAO (valida Plantilla) PlantillaBO (int buscarplantilla(user)) Academico Table:usuario Academico Table:plantilla, usuario Barra.jsp Bienvenida.jsp EstiloPropioAction EstiloPropio.jsp Metodo: Actualizar PlantillaBO TituloBO SubtituloBO ActualizarPlantillaAction BotonBO ComboBO Metodo: ListaBO guardaractualizar ImagenBO EtiquetaBO CrearPlantillaAction PlantillaBO TituloBO SubtituloBO BotonBO ComboBO ListaBO ImagenBO EtiquetaBO PlantillaDAO (valida Plantilla) PlantillaDAO TituloDAO SubtituloDAO BotonDAO ComboDAO ListaDAO ImagenDAO EtiquetaDAO PlantillaDAO TituloDAO SubtituloDAO BotonDAO ComboDAO ListaDAO ImagenDAO EtiquetaDAO Academico Table:plantilla, Usuario, colorfondo, Colorfondo, Colorfuente, Fondoformulario Fondopagina Imagen Plantillacodigo Subtitulo Titulo Tamaniofuente Tipofuente Combo Etiqueta Boton M J T

36 Acceso Web al Sistema M J T

37 Usuario Administrador M J T

38 Personalizando las Reflexiones. Parte I M J T

39 Personalizando las Reflexiones. Parte II M J T

40 Ultimas Noticias M J T

41 Galería de Fotos. Parte I M J T

42 Galería de Fotos. Parte II M J T

43 Galería de Fotos. Parte III M J T

44 Contáctenos M J T

45 The End