Diplomado en Diseño Web
El objetivo es crear un sitio en Internet, utilizando estándares web
Diseño Web 50 Horas:
2.5 al día o 5 horas los sábados.
El pre requisito es que se tenga conocimiento básico del sistema operativo Macintosh o PC. Ser estudiante de la carrera en Diseño Gráfico, que estén laborando en un despacho, imprenta, Agencia de Publicidad, sistemas o que cuentes con formación gráfica autodidáctica.
Temario HTML
HTML (Hypertext Markup Language): es un set de códigos lógicos que constituyen la apariencia de una página Web y la información que contiene. En este apartado se conocerán los elementos básicos de este lenguaje.
-Se creará una página básica utilizando etiquetas HTML en Simple Text
Curso FireWorks
Fireworks es un editor para el ambiente Web, nos permite optimizar imágenes, crear animaciones GIF, transparencia y rollovers. Puede trabajar con imágenes vectoriales o bitmap.
-Introducción a FireWorks.
Interfaz
Diferencia entre Imágenes Vectoriales y Bitmap.
Entender la Barra de Herramientas.
Navegar entre diferentes paneles de opciones.
Modo Objeto.
Modo Editar Imagen.
Guías y red.
Editar Bitmap.
Utilizar las herramientas de selección: laso, varita mágica, selección de rectángulo y círculo.
Utilizar la herramienta de clonación.
Seleccionar y agrupar objetos.
Las Capas y sus propiedades.
Entender la herramienta de texto y sus opciones.
Formatos de texto.
Añadir texto sobre un trazo.
Convertir texto a curvas.
Importar gráficos externos
Combinar Imágenes con Unión, Intersección, perforar y cortar.
Utilizar Estilos.
Aplicar “Live effects” a un texto
Aplicar relleno de color, patrón y textura.
Gradientes.
Mascarillas Bitmap y Vectoriales
Crear Colores Seguros Web.
Producir Colores Web “dither”.
Animación GIF.
Trabajar con “frames” cuadros.
Crear animación con símbolos e instancias.
Animación por medio de “tweening”.
Crear serie de Botones con Rollover, texto y vínculos
Entender “swap images” rollover (intercambiar imágenes).
Menú Pop Up.
Seleccionar vínculos en una “imagen mapa”.
Crear y editar vínculos
Comprender “slices”.
Posibilidad de editar múltiples imágenes al mismo tiempo “Batch Process”.
Web Layer.
Checar el Gamma.
Optimizar documentos.
Exportar Documentos.
Interacción entre Fireworks y Dreamweaver
Curso Flash
Flash es un programa que ha revolucionado el diseño Web, porque nos abre una excelente perspectiva en animación e interacción, utilizando vectoriales baja más rápida la información.
Además es un programa soportado por una gran comunidad que comparte trucos y técnicas.
Es preferible utilizar imágenes vectoriales en lugar de Bitmaps en animaciones Flash.
Interfaz de Flash
Barra de herramientas
Páneles
Guías, reglas, retícula
Escenario
Línea de tiempo
Manejar layers
Trabajar con grupos
Tiempo y espacio
Velocidad de la película
Dimensiones
Color del fondo
Elementos de Dibujo y Pintura:
Todas las herramientas incluyen modificadores y opciones
La línea
La pluma
::::Editar nodos, segmentos y tangentes
Herramienta de elipse
Herramienta de rectángulo
El lápiz
El pincel
Modificar rellenos y líneas
Crear y editar gradientes
Utilizar el mezclador de color
Fundamentos
Seleccionar con flecha
Modificar selecciones
Propiedades de la película
Escalado, rotación, reflejo e inclinación
Alinear objetos
Trabajar con capas
Comprender la utilización de Frames y Keyframes
Cuantos frames por Segundo?
Añadir copiar y borrar frames
Cambiar de orden a los frames
Onion Skin
Escenas
Probar película
Crear símbolos y manejar librerías
Crear símbolos gráficos, botones y movie clips
Editar símbolos
Editar instancias
Trabajar con librerías
Motion Tween
Animación utilizando el modo motion tween
Seguir una línea guía
Orientar a un trazo
Enmascarillar “mask”
Mascarilla animada
Shape tween
Crear una animación de transformación o shape tween
Utilizar la forma “easing” para crear un efecto de animación real
Ayudarse con los “shape hints”
Editar múltiples frames
Texto
Crear texto
Modificar texto
Diferentes tipos de texto: estático, input y dinámico
Botones
Crear botones básicos
Botones con animación
Botones con sonido
Vínculos a botones
Botones invisibles
Movie clips
Animación en la línea de tiempo principal y otra en un movie clip
Características generales de un movie clip
Utilizar movie clips como instancias
Importar imágenes externas
Compresión de bitmaps
Editando bitmaps
Convertir bitmap a vectorial
Importar una secuencia de imágenes
Importar ilustraciones vectoriales
Interactividad
Acciones en frames
Acciones en objetos
Controlar movie clips por medio de acciones
Sonido
Importar diferentes formatos de sonido
Compresión
Efectos de sonido
Botón on/off de música
Interacción ActionScript
Que es ActionScript?
Concepto de la sintaxis de punto
Panel de acciones
Acciones aplicadas al objeto
Acciones aplicadas al fotograma
Navegar entre fotogramas, labels y escenas
go to, play y stop
Vinculación URL a páginas web y correo
Cargar y descargar películas (loadMovie, unloadMovie)
Navegación entre movie clips (with)
Producción de un Slide Show (mostrar imágenes una por una)
Creación de un Menú desplegable
Bajar un JPG
Bajar un SWF
Creación de preloaders
FS Command
Proyectores y ejecutables (Mac y PC)
FullScreen
Allow Scale
Quit
Integración
Con Fireworks
Freehand e Illustrator
Dreamweaver
Quicktime
Publicar
Bandwith profiler
Preloader
Publish settings
Exportar diferentes formatos
Publicar a Quicktime
Curso Dreamweaver
Dreamweaver es uno de los mejores editores para crear páginas Web. Crea el código HTML en forma amigable así como DHTML, JavaScript, CSS, etc.
Planeación del sitio
Creación de un sitio nuevo o rediseñar uno ya existente
La estructura del sitio (arquitectura)
Determinar la audiencia
Compatibilidad entre navegadores
Navegación
Usabilidad
Administración del sitio
Crear, editar y borrar documentos HTML desde la ventana de sitio
Entender la ventana de sitio
Preferencias sitio local y remoto
Area de trabajo
Visualizar el área en forma de diseño WYSIWYG
Visualizar en código HTML
Definir un sitio
Barra de herramientas en susu diferentes modalidades
Panel de control
Páneles flotantes
Historia
Añadir Contenido
El formato del documento
Colores seguros Web
Formato de texto
Propiedades y prefernecias del documento
Interactuar con FireWorks referente al contenido
Maquetación de las páginas
Trabajar en vista Design
Trabajar en vista Standard
Tablas y celdas
Crear, modificar y borrar tablas y celdas
Asignar color a las tablas
Importar y exportar datos de una tabla
Utilizar imeagenes como base para diseñar
Manejar imágenes
Insertar imágenes
Modificar imágenes en conjunción a FireWorks
Alinear imágenes
Image Maps
Utilizar Templetes y Bibliotecas
Diseñar con marcos
Utilizar o no utilizar marcos
Cuando es más factible diseñar con marcos
Como salvar documentos con marcos
Manejar el contenido y vínculos entre marcos
Crear una página para los navegadores que nos soportan marcos
Manejar JavaScript entre marcos
Crear Formas (forms)
Entendiendo formas HTML
El proceso de las formas
Diferentes tipos de formas
Mandar datos de forma a un email utilizando script CGI
Comportamientos JavaScript
Botones con rollover
Rollover desfazados
Menú Jump
Introducción a Cascading Style sheets
Crear un nuevo estilo
Utilizar custom classes
Selector de estilos
Editar estilos
Embedded styles
Insertar Multimedia
Objeto Flash
Botón Flash
Sonidos
QuickTime
Avi, etc.
Probar, desarrollar y mantener un sitio Web
Conectarse a el servidor
Probar el sitio en línea
Encontrar y reemplazar
Mantener el sitio
Aprovechar las extensiones disponibles en la red
Puedes pedir información a
info@recreodigital.com