ACTIVIDAD 18: TERMINOLOGÍA BÁSICA DEL SOFTWARE PARA DISEÑAR PAGINAS WEB

1.- DREAMWEAVER CS5: Aplicación en programa de estudio (basada en la forma de estudio de Adobe Flash) que está destinada a la construcción, diseño y edición de sitios, vídeos y aplicaciones Web basados en estándares. Creado inicialmente por Macromedia (actualmente producido por Adobe Sistemas) es uno de los programas más utilizados en el sector del diseño y la programación web por sus funcionalidades, su integración con otras herramientas como Adobe Flash y, recientemente, por su soporte de los estándares del World Wide Web Consortium.

 FUENTE:

2.- CSS: Es un lenguaje usado para definir y crear la presentación de un documento estructurado escrito en HTML o XML (y por extensión en XHTML). El World Wide Web Consortium (W3C) es el encargado de formular la especificación de las hojas de estilo que servirán de estándar para los agentes de usuario o navegadores. La idea que se encuentra detrás del desarrollo de CSS es separar la estructura de un documento de su presentación.

FUENTE:

3.- PLANTILLA DE DREAMWEAVER: Las plantillas son una especie de copia de la página en la que van a estar basadas el resto de páginas del sitio web, pero que incluyen la posibilidad de establecer unas zonas editables y otras zonas que serán fijas, que no podrán ser modificadas.

FUENTE:




4.- CONTENEDOR EN DREAMWEAVER: Todos los contenedores están incluidos en la misma página, pero cada contenedor puede albergar un elemento muy concreto tal como una imagen, una animación o un texto, y podemos situarlo donde deseemos, en cualquier parte de la página.

FUENTE:




5.- COMPORTAMIENTOS EN DREAMWEAVER: Los comportamientos son acciones, programadas normalmente en código JavaScript, que suceden cuando los usuarios realizan algún evento sobre un objeto (en lenguaje Dreamweaver) ya sea imagen, texto, capa, ... Los comportamientos de Dreamweaver introducen en los documentos código JavaScript que permite a los visitantes interactuar con la página Web para modificarla de diversas maneras o para que se realicen determinadas tareas. Un comportamiento es una combinación de un evento con una acción que desencadena ese evento.


FUENTE:

6.- SITIO LOCAL: Al definir un sitio local, está indicando a Dreamweaver el lugar en el que tiene intención de almacenar todos los archivos de un sitio concreto. Para trabajar de manera eficaz con Dreamweaver, defina siempre un sitio local para cada sitio Web que cree. 

FUENTE:



7.- SITIO DINÁMICO: Son aquellos que permiten crear aplicaciones dentro de la propia Web, otorgando  una mayor interactividad con el navegante. Aplicaciones dinámicas como  encuestas y votaciones, foros de soporte, libros de visita, envío de e-mails inteligentes, reserva de productos, pedidos on-line, atención al cliente personalizada .

FUENTE:



8.- SITIO INTERACTIVO:  Los sitios web en general son interactivos, dado que el usuario puede interactuar a través del teclado y el mouse, recibiendo una "respuesta" del mismo.
Es cierto que existen sitios web mucho más interactivos que otros, pudiendo interactuar (es decir, intercambiar información y comandos constantemente desde el sitio web hacia el usuario y viceversa) de muchas otras formas. 

FUENTE:

9.- REGIÓN EDITABLE: Las regiones editables son las partes de la página que se pueden cambiar en los archivos basados en esa plantilla. Las regiones bloqueadas (no editables) son las partes del diseño de la página que permanecen constantes de una página a otra.


FUENTE:


10.- MAQUETACION: Distribución de los elementos en nuestra página.
Actualmente, la maquetación con tablas ha caído en desuso, y se realiza utilizando capas(<div>), también llamadas divisiones o contenedores. La colocación de las capas en la página se realiza a través de CSS. Esto permite, por ejemplo, que podamos pasar de un diseño con un menú lateral a otro con el menú en la parte superior, sólo cambiando la hoja de estilos.

FUENTE:

11.- ETIQUETA DIV: La etiqueta <div> se emplea para definir un bloque de contenido o sección de la página, para poder aplicarle diferentes estilos e incluso para realizar operaciones sobre ese bloque específico.

FUENTE:

12.- TABLA: Las tablas son una herramienta potente para presentar datos e imágenes en páginas HTML. Las tablas proporcionan a los diseñadores Web formas de añadir estructura vertical y horizontal a una página. Utilice las tablas para presentar datos tabulares, diseñar columnas o disponer texto o gráficos en una página Web. Podrá agregar contenido; añadir, eliminar, dividir y combinar filas y columnas; modificar las propiedades de tablas, de filas o de celdas para añadir color y alineaciones, así como copiar y pegar celdas.

FUENTE:

13.- FORMULARIO: Los formularios permiten interactuar con los visitantes del sitio o recopilar información de ellos. Por ejemplo, puede solicitar el nombre y la dirección de correo electrónico de un usuario o hacer que los visitantes respondan a una encuesta o proporcionen comentarios acerca del sitio.

FUENTE:

14.- FORMULARIO DE CONTACTO:

PROYECTO FINAL

P.33: TERMINOLOGIA BASICA DEL SOFTWARE DE DISEÑO

1.-¿Para que se utiliza un editor de imágenes?  Para optimizarlas, manipularlas, retocarlas, etc, con el fin de alcanzar la meta deseada. Una de las metas puede ser eliminar las fallas que pueden haberse producido durante el escaneo o al fotografiar, por ejemplo sobre-exposición,baja exposición, falta de contraste, ruido en la imagen,efecto de los ojos rojos, paradoja de las líneas paralelas en perspectiva, etc.

FUENTE:

2.-¿Que es una imagen digital?Es una representación bidimensional de una imagen a partir de una matriz numérica, frecuentemente en binario (unos y ceros). Dependiendo de si la resolución de la imagen es estática o dinámica, puede tratarse de una imagen matricial (o mapa de bits) o de un gráfico vectorial.

FUENTE:

3.-Tipos de imágenes digitales:  

1.- Mapa de Bits: Es un imagen creada sobre una rejilla o cuadrícula, que se guarda como fichero. Cada unos de los cuadritos de la rejilla se denomina píxel, y este guarda información del color. Cuantos más píxeles, mayor es la imagen. Además hay píxeles que guardan más información que otros, depende de la información que queramos guardar.

2.- Imágenes vectoriales:  Figura, representación, semejanza o apariencia de algo. El término también se emplea para nombrar a la representación visual de un objeto mediante técnicas de la fotografía, el video, la pintura u otra disciplina.

FUENTE:

4.- Formatos de archivos: 

• JPEG. Es uno de los formatos más conocido y usado para fotografías digitales ya que admite millones de colores. Lo admiten la mayor parte de las cámaras fotográficas y escáneres y es muy utilizado en páginas web, envío de fotografías por correo electrónico, presentaciones multimedia y elaboración de vídeos de fotografías.

• PNG. Formato creado con el fin de sustituir a GIF. Utiliza sistemas de compresión gratuitos, y admite muchos más colores que GIF. También admite transparencias pero no animaciones. Al admitir más colores es posible crear imágenes transparentes con mayor detalle.
• PSD. Es el formato por defecto del editor de imágenes Adobe Photoshop y por tanto es un formato adecuado para editar imágenes con este programa y otros compatibles. Admite millones de colores, capas, canales.
• RAW. Formato “en bruto”. Esto quiere decir que contiene todos los píxeles de la imagen captada, tal y como se han tomado. Es el formato que ofrece la mayor calidad fotográfica y suele ser admitido por cámaras de gama media y alta (réflex, y compactas) indicadas para fotógrafos aficionados avanzados y profesionales.
• TIFF. Formato utilizado para el escaneado, la edición e impresión de imágenes fotográficas Es compatible con casi todos los sistemas operativos y editores de imágenes. Como PSD, admite millones de colores, capas, canales alfa… y también lo incluyen algunas cámaras y la mayoría de los escáneres. 

FUENTE:

5.-¿Que es un mapa de Bits?Estructura o fichero de datos que representa una rejilla rectangular de píxeles o puntos de color, denominada matriz, que se puede visualizar en un monitor, papel u otro dispositivo de representación.

A las imágenes en mapa de bits se las suele definir por su altura y anchura (en píxeles) y por su profundidad de color (en bits por píxel), que determina el número de colores distintos que se pueden almacenar en cada punto individual, y por lo tanto, en gran medida, la calidad del color de la imagen.

6.-¿Que es un Pixel?Es la menor unidad homogénea en color que forma parte de una imagen digital. Ampliando lo suficiente una imagen digital (zoom) en la pantalla de una computadora, pueden observarse los píxeles que componen la imagen. Los píxeles son los puntos de color (siendo la escala de grises una gama de color monocromática). 

FUENTE:


7.-¿Que es un Voxel? La unidad cúbica que compone un objeto tridimensional. Constituye la unidad mínima procesable de una matriz tridimensional y es, por tanto, el equivalente del píxel en un objeto 2D. Al igual que los píxels, los vóxeles no contienen su posición (x,y,z) en el espacio 3D, sino que esta se deduce por la posición del vóxel dentro del archivo de datos. 
FUENTE:
8.-¿Que es Texel?Unidad mínima de una textura aplicada a una superficie,usada en gráficos por computador. De la misma forma que una imagen digital se representa mediante una matriz de píxeles, una textura se puede representar mediante un matriz de texeles. 
FUENTE:

9.-¿Que es una resolución de imagen? Término que describe el nivel de detalles que tiene una imagen. Este término se aplica a imágenes digitales, filmadas y otro tipo de imágenes. Una resolución de imagen más alta, significa una imagen con más detalles. La resolución de imagen puede ser medida de varias formas. Básicamente, la resolución cuantifica cuan cercas las líneas pueden estar entre sí y todavía ser visiblemente resueltas.

FUENTE:


10.-Sistemas de color y calidad de pixeles:
ESCALA DE GRISES: Empleada en la imagen digital en la que el valor de cada píxel posee un valor equivalente a una graduación de gris. Las imágenes representadas de este tipo están compuestas de sombras de grises.

FUENTE:

RGB: Composición del color en términos de la intensidad de los colores primarios de la luz.

FUENTE:


11.-¿Cuales son los 5 mejores software por la edición de imágenes? 

1.-Photoshop
2.-Photofiltre
3.-Photoscape
4.-Adobe Photoshop Express
5.-The Gimp

FUENTE:

3.3 CONCEPTOS BÁSICOS DEL SOFTWARE DE ANIMACIÓN

1.-¿Que es Animación? Cualquier cambio visual que se produce a lo largo del tiempo. Se puede modificar varios aspectos de un elemento gráfico para animarlo: posición, tamaño, rotación, color, transparencia etc. Se basa en el concepto de fotograma o frame.

FUENTE

2.-Menciona 5 Softwares comerciales para realizar animaciones:

. Blender: Es un programa multiplataforma para el modelado, animación y creación de gráficos tridimensionales.
. 3D Canvas: Permite la creación de objetos simples y complejos, los cuales se pueden modelar, pintar, texturizar y animar.  Para esta última función simplemente se debe posicionar los objetos de un punto a otro del escenario, y el software de Canvas se encargará de animarlo.
. Google SketchUp: Programa gratuito de Google que permite la moderación de objetos y escenarios 3D. Cuenta con completas herramientas que permiten modelar, dar efectos, texturizar. También cuenta con un versátil sistema de cámara que hace más fácil la utilización del programa.
. K 3D: Permite crear objetos y animaciones en 3D. También es multiplataforma y se lo puede mejorar con una serie de plugins. Es útil para perfilar imágenes comunes hacia el 3D, soportando moldeado poligonal. Incluye herramientas básicas para NURBS, parches, curvas y animación.
. Wings 3D: Programa  para modelar y texturizar objetos 3D. Si bien su software no permite crear animaciones, su interfaz es más flexible que otras aplicaciones, lo cual lo convierte en una opción ideal para la creación de gráficos estáticos. Por lo demás, ofrece las herramientas completas para crear un gráfico 3D de calidad (texturizar, iluminar, etc).
FUENTE:



3.-¿Que es un efecto especial? Crea una ilusión audiovisual gracias a la cual el espectador asiste a escenas que no pueden ser obtenidas por medios normales.
FUENTE:

4.-¿Que es un gráfico de computación? Campo de la informática visual, donde se utilizan computadoras tanto para generar imágenes visuales sintéticamente como integrar o cambiar la información visual y espacial probada del mundo real.
FUENTE:

5.-¿Que es vídeo games? Aplicación interactiva orientada al entretenimiento que, a través de ciertos mandos o controles, permite simular experiencias en la pantalla de un televisor, una computadora u otro dispositivo electrónico.

FUENTE:


7.-¿Que es un fotograma? Es la imagen obtenida sin la cámara fotográfica, por medio de un proceso que consiste en la superposición del objeto a registrar sobre el material fotosensible de placa o de película fotográfica, de modo que el fotograma es cada una de las imágenes impresionadas de este modo químicamente en la tira de celuloide.
FUENTE:

 8.-¿Que es un gráfico 3D? Trabajos de arte gráfico que son creados con ayuda de software y programas especiales en general, o de términos, de técnicas y tecnología relacionadas con los gráficos de dimensiones altamente concentradas pueden ser grises o azul con rojo.

FUENTE:

9.-¿Que es Flash? Tecnología para crear animaciones gráficas vectoriales independientes del navegador y que necesitan poco ancho de banda para mostrarse en los sitios web. La animación en Flash se ve exactamente igual en todos los navegadores, un navegador sólo necesitan un plug-in para mostrar animaciones en Flash.

Con Flash los usuarios pueden dibujar sus propias animaciones o importar otras imágenes vectoriales.

Flash era conocido como FutureSplash hasta 1997, cuando Macromedia Inc. compró la compañía que lo desarrolló.

FUENTE:

10.-Explica los tipos de movimiento en Flash:

•  fotograma a fotograma:Debemos dibujar cada uno de los fotogramas de la animación uno por uno, al estilo de las clásicas películas de dibujos animados. Permite una gran flexibilidad, pero a costa de un elevado esfuerzo. Además, el archivo debe almacenar los cambios de cada fotograma. 
• Interpolación de movimiento: Debemos elegir cuando los objetos de los dos fotogramas claves sólo se diferencian en su posición, escala o rotación.
• Interpolación de forma: Ese diferencia en que gradúa el cambio de la forma del objeto, realizada a través de la manipulación de sus puntos de control bezier. También permite cambiar el color.

FUENTE:

VENTANA DE FLASH

2.1 VENTANA DE SOFTWARE DE DISEÑO

2.2 BARRA DE HERRAMIENTAS DE PHOTOSHOP