CURSO ADOBE MUSE 2014+Tienda Online+Edge Animate CC

Transcription

CURSO ADOBE MUSE 2014+Tienda Online+Edge Animate CC
CURSO ADOBE MUSE 2014+Tienda
Online+Edge Animate CC
VIDEO 1. Presentación del curso.
VIDEO 2. Relleno del navegador y relleno de página.
En este capítulo veremos cómo enfrentarnos a un proyecto nuevo, recopilar
información, inspiración y comenzamos con los primeros pasos iniciales en el
proyecto que vamos a ir maquetando. Una bonita web completa sobre el
tema de Ferrari, donde veremos el proceso completo hasta su publicación.
Vemos también el concepto de páginas maestras, muy útil en la planificación
de cualquier sitio web.
VÍDEO 3: Maquetando la página HOME (I)
Trabajaremos en la primera página del proyecto, la página “HOME”, donde
comenzaremos a crear ya los contenidos. En este caso, comenzamos por
añadir una imagen que ocupará el 100% del ancho del navegador y veremos
cómo trabajar con las Capas. Por último, importamos un botón de Photoshop
con sus capas correspondientes.
VIDEO 4. Efectos de desplazamiento.
Un recurso muy utilizado en las páginas web más modernas es el
desplazamiento de objetos por el navegador. En este video, aprenderas a
crear esas animaciones de manera muy sencilla y a través de unos ejercicios
muy visuales. Además, a utilizar la opacidad o transparencia, velocidad etc ...
VÍDEO 5: Maquetando la página HOME (II)
Continuamos el proyecto “Ferrari”, añadiendo más contenidos, como las
zonas del <HEAD> (cabecera) y a utilizar para ello los efectos de
desplazamiento que vimos en el capítulo anterior. Además veremos cómo
“fijar” objetos en el navegador y añadiremos unos botones de redes sociales
desde la Biblioteca, importando directamente desde un fichero .mulib. Por
último trabajamos el apartado “noticias” de la HOME.
VÍDEO 6: Maquetando la página HOME (III)
La página web “Ferrari” va tomando forma y continuamos maquetando
contenidos. Trabajamos con los textos que encontraremos en la carpeta
“Recursos” y con los que podremos ir copiando-pegando de manera muy
sencilla. Aprenderemos en este capítulo a crear y editar los Estilos, tanto de
párrafo, carácter y gráficos, cada uno con sus peculiaridades.
VIDEO 7. MENÚ PRINCIPAL.
Creamos la estructura del proyecto desde al área de Plan y también el menú
principal con todos los botones correspondientes. Veremos cómo funcionan
los diferentes estados de los botones (normal, RollOver, Pulsado y Activo).
VÍDEO 8: Maquetando la página HOME (IV)
Vamos a ir dejando ya finalizada nuestra página HOME, añadiendo más
contenidos y viendo diferentes modos de incluir imágenes y trabajar con los
rellenos (mosaico etc ...). Crearemos un baner de publicidad para la tienda
Online y por último, añadiremos un Widget de Google Maps en la página.
VÍDEO 9: Animación con Edge Animate CC 2014. Animación
interactiva completa.
Este capítulo lo veremos integramente en Adobe Edge Animate CC y
crearemos desde cero una aplicación interactiva. En ella, podremos ver dos
pilotos de la escuderia Ferrari y podremos interactuar con ellos, creando la
programación tanto de los botones como de la línea de tiempo. Veremos el
área de trabajo de Edge Animate y también cómo exportar los ficheros para su
publicación HTML. Video 10: SEGUNDA PÁGINA MAESTRA​
.
Creamos una segunda página maestra y veremos las caracteristicas de trabajar
con varias de estas páginas maestras. Además, continuando nuestro
proyecto, crearemos las páginas destino de las noticias y cómo repercutirá
esto en la estructura del sitio web. También configuraremos el pié de página
(Footer) en la zona inferior del navegador. Por último, aprenderemos a
trabajar con las “anclas” para movernos entre diferentes secciones de la
página y con los hipervínculos.
Video 11: NOTICIAS- MULTIMEDIA-TIENDA y CONTACTO.
En este capítulo iremos maquetando las páginas que nos quedan del
proyecto. Importaremos el fichero de “Adobe Edge Animate” dentro de la
página y también la tienda virtual (solo el código, ya que la tienda la veremos
más adelante). Por último, crearemos un formulario de contacto y
añadiremos algunos vídeos de Youtube en “Multimedia”.
VÍDEO 12: Dominio y alojamientos gratuitos con Hostinger.
Un interesante capítulo donde veremos cómo crear y configurar un
alojamiento y dominio gratuito para subir los contenidos del proyecto
“Ferrari” y, de este modo, tenerlo subido y accesible en Internet. Usaremos la
opción de “Cargar en FTP” directamente desde Adobe MUSE para transferir
nuestros archivos al servidor gratuito.
VÍDEO 13: Diseño de contenidos para tabletas y moviles.
Vamos a crear un diseño para dispositivo móvil a partir del diseño ya
terminado para Ordenador. Veremos cómo trasladar la maquetación para
verla en una pantalla más grande a una pantalla de un SmartPhone.
Crearemos un botón especial para pulsar en un móvil y lo configuraremos a
través de unos Widgets de Adobe MUSE para que se despliegue y nos
muestre las opciones de navegación.
Video 14: TIENDA VIRTUAL (I)
Video 15: TIENDA VIRTUAL (II)
En los capítulos 14 y 15 veremos cómo instalar y configurar las opciones
iniciales de una tienda Online (gratuita hasta 10 artículos) y aprenderemos a
trabajar el BackEnd (zona interna), es decir, configurar las diferentes opciones
de los envios, tarifas, artículos, promociones, etc ... y en el video 15, veremos la
parte que los clientes van a visualizar (FrontEnd). Generaremos el código que
nos servirá para insertar la tienda dentro de nuestro proyecto “Ferrari”. Todas
las imágenes, textos y ficheros necesarios para crear nuestra tienda los
encontraremos en la carpeta “Recursos”.
Video 16: TRUCOS, CONSEJOS y despedida ...
Para despedir el curso, veremos pequeños trucos que nos servirán para
optimizar nuestro trabajo con Adobe MUSE y que no hemos visto en capítulos
anteriores. Sobretodo orientados a ganar en productividad en maquetar los
contenidos.