PREIMPRESIONA2 DIGITAL: 2018

viernes, 25 de mayo de 2018

Transiciones

Hola buenas!!!
En este apartado os explicaré como hacer transiciones en Adobe Acrobat.
Se hace con estos pasos:
Abrimos Adobe Acrobat Pro DC, entramos en Preferencias y a continuación sale esta pantalla:

Entramos dentro de la opción "pantalla completa"y a continuación vamos al apartado inferior:

Y donde pone "transición predeterminada: sin transición", abrimos el desplegable y salen varias opciones. Elegimos la opción "transición" y le damos a aceptar. Para comprobar que se han hecho correctamente las transiciones, ponemos el archivo en pantalla completa (comando + L), y vamos pasando de diapositiva en diapositiva, y como se puede observar, están hechas las transiciones.

PDF Multimedia e interactivo/ Hiper vínculos y marcadores

Muy buenas a todos.
Hoy vamos a trabajar con Adobe Acrobat para hacer una práctica sobre hipervínculos y marcadores.
Un hipervínculo es un vínculo asociado a un elemento de un documento con hipertexto, que apunta a un elemento de otro texto u otro elemento multimedia.
Un marcador sirve para llevar al lector a una página específica cuando pulsa encima de él.

Estas son las dos herramientas, la de la izquierda es el marcador, y la de la derecha con forma de cadena es el vínculo.
Lo primero de todo es sacar estas herramientas en el documento, en caso de que no las tengas para trabajar. Para ello, tenemos que ir a:
Ver-->Mostrar/ocultar-->Elementos de la barra de herramientas-->Personalizar herramientas rápidas.
Ahora te saldrá un panel y le darás a editar PDF, y ahí tendréis estas dos herramientas junto a otras cuantas.

Para usar el marcador, lo que haremos será pinchar en él y por defecto nos saldrá uno para crear, pues este que sale le borramos en la papelera que tenemos en la esquina superior izquierda.

Una vez hecho esto, lo que haremos será seleccionar la palabra/texto donde queremos que vaya el marcador, y una vez seleccionado, creamos un nuevo marcador, y éste se aplicará inmediatamente a la palabra.
Ya hecho este paso, tenemos el marcador, que pinchando con el ratón sobre él, nos llevará a la palabra /texto que habríamos seleccionado.

Para establecer un hipervínculo, pincharemos en la herramienta que he enseñado antes con forma de cadena, y nos saldrán varias opciones. Le damos a la primera de todas (añadir o editar vínculo de documento web). Seleccionaremos con el ratón la zona donde queremos que se establezca el hipervínculo (se hace como si creasemos una caja de texto).
Después de crearlo aparecerá esta ventana:

Vincular acción significa donde queréis ir cuando pinchéis en el vínculo, en este caso por ejemplo quiero que vaya a la página web de Unicef, porque de eso trataba la práctica entre otras cosas, entonces para ello pones la opción "abrir una página web", y le das a siguiente.
Ahora aparecerá este recuadro:

Aquí introducimos el enlace de la página a la que queremos que navegue.
Cuando cliquemos en aceptar, se establecerá el vínculo y luego cada vez que le pulses, irá a la página web.
También hemos usado la otra opción que es la de vista de página. Esta opción te permitirá ir a otra página del mismo documento donde tengas el vínculo, al crearlo, saldrá esto:

Significa que tenéis que ir a la página donde queréis que nos lleve al clicar sobre el vínculo, y cuando estéis en esta página le daremos a la opción "establecer vínculo", y ya está, así de sencillo.

CINEMAGRAPH

¡HOLA A TODOS!

Hoy os vengo a hablar acerca del cinemagraph.

Un cinemagraph es una imagen animada que resulta de la combinación de fotografía y vídeo (de ahí su nombre: Cinema (Video) - graph (fotografía). Se trata de imágenes fundamentalmente estáticas en las que se sustituye una porción de éstas por una pequeña animación que, normalmente, muestra pequeños movimientos en bucle infinito. Para montarlas, a menudo se usa el formato de imágenes.gif. La intención de un cinmegraph es sorprender al espectador: éste se encontrará en un primer momento, ante una imagen que, de repente presentará un movimiento. Además, este tipo de imágenes busca transmitir sensaciones que con las fotografías no se pueden transmitir.

A continuación os dejo con un cinemagraph creado por mi, espero que os guste.

Para la creación de un Cinemagraph hay que seguir unos sencillos pasos:

1º Buscar un video en formato MP4, si es posible grabado con cámara estática para facilitar el proceso.

2º Introducir el video en photoshop, el cual deberemos duplicar y resterizar, colocándolo a la misma altura para que el vídeo quede bien centrado.

3º Una vez duplicada la capa y resterizada, la subimos arriba del todo, encima de "Grupo de vídeos 1" y creamos una mascara de capa.

4º Seleccionamos la mascara de capa y con la herramienta pincel pintamos todo lo que queramos que se vea en movimiento en el cinemagraph, en mi caso es el agua.

5º A continuación, entramos en el apartadp "Archivo" y le damos a exportar

6º Dentro de la pestaña "Exportar"le damos a "Interpretar vídeo" en el cual lo guardaremos a la calidad y resolución que deseemos.

Espero que os haya gustado y os haya servido, un saludo.

jueves, 24 de mayo de 2018

Formularios

Hola a todos, hoy os vengo a hablar a cerca de los formularios que estamos realizando con la aplicación Adobe Acrobat.
Hemos realizado un formulario a partir de un documento vacío, al que le hemos tenido que añadir cajas de texto editables, botones, menús desplegables...
Después de abrir el documento en Adobe Acrobat, se nos abre un menú en el que aparece lo siguiente:

En dicho menú pulsamos en el apartado "Preparar formulario" para poder editarlo y agregarle lo que necesitamos, se nos abrirá una barra de herramientas en la parte superior del documento con las herramientas que necesitaremos para crear el formulario, que es el siguiente:

A continuación empezamos a preparar el formulario, para ello yo tan solo he utilizado las siguientes herramientas que son:

He creado diferentes capas de texto a las que he renombrado para dejas las cosas claras y organizadas, también he añadido botones para selecciones y algún menú desplegable como en el caso de la elección de provincias.

Éste es el resultado final de mi formulario, espero que os haya gustado y servido de ayuda, un saludo.

Página 1:

Página 2:

Formulario Diego Bravo

jueves, 10 de mayo de 2018

Banner en la web

HOLA MUY BUENAS A TODOS!!!

Hoy os vengo a hablar acerca del Hyper Text Markup Lenguage o mas conocido como HTML5.

Hasta ahora, para la visualización y animación de vídeos en Internet, generalmente se utilizaba el formato Flash. Y decimos hasta ahora, porque con la llegada del nuevo lenguaje de programación HTML 5, esta situación se encuentra en vísperas de un profundo cambio. Es de hecho la quinta revisión del estandar que fue creado en 1990.

A parte de crear banners en Photoshop, también los podemos crear en diferentes páginas web como por ejemplo html5maker, bannersnack, gifmaker, etc. Dichas páginas no están en español, pero son muy intuitivas y fáciles de utilizar.

A continuación voy a realizar un GiF con dos de las diferentes páginas web que hay para herlo, espero que os gusten.

1ª. La primera página web que he utilizado es Gifmaker, es la página que más fácil me ha resultado.

Lo que hice fue descargar las 7 imágenes que he necesitado, arrastrarlas a la aplicación en el apartado "upload images" y ordenarlas para que hagan la transición que nosotros deseemos.

2ª. La segunda página web que he utilizado es Bannersnack, es una página un poco mas compleja pero también es bastante intuitiva.

viernes, 27 de abril de 2018

Banner Estatico y Dinámico en Photoshop.

¡Hola a todos!
Hoy os vengo a enseñar la facilidad de crear dos tipos de Banners distintos, uno estático y otro dinámico con la aplicación Photoshop, para ello os enseñare dos practicas realizadas por mi.

1ª DÍA MUNDIAL SIN TABACO (ESTÁTICO)

Este es el banner estático que he creado para el día mundial sin tabaco, se trata de un Pop Under.

PASO 1:Para crearlo lo he realizado con diferentes capas a partir de una imagen de un cigarrillo a la que le he añadido más lienzo para poder trabajar mejor sobre ella.

PASO 2: He realizado un degradado de color en la zona de la izquierda. Encima he colocado varios cuadros de texto con los diferente mensajes que quiero dar al espectador.

PASO 3: He colocado un rectángulo de color amarillo sobre el cual he puesto un texto en negro al que le he añadido un resplandor exterior para destacar más.

2ª TRIODOS BANK (ESTÁTICO)

Este es el banner estático que he creado para Triodos Bank, se trata de un Large rectangle.

PASO 1:Para crearlo lo he realizado con diferentes capas a partir de un nuevo documento que he creado con unas dimensiones de 336px x 280px.
PASO 2: He realizado un marco de color rojo para destacar mas la imagen. En la zona inferior he colocado el logotipo de Triodos Bank.
PASO 3: He colocado un rectángulo con los bordes azules sobre el cual he añadido tres círculos de diferentes colores en los que he añadido un texto especifico para cada uno de ellos. Dentro del rectángulo he añadido también uno más pequeño de color azul en el que he añadido un texto en blanco para destacar mas.

1ª DÍA MUNDIAL SIN TABACO (DINÁMICO)

Este es el banner dinámico que he creado para el día mundial sin tabaco a partir del banner estático creado anteriormente.

PASO 1: Desde el programa photoshop en el apartado Ventana, seleccionamos la opción Línea del tiempo.

PASO 2: En el apartado Línea del tiempo vamos colocando las diferentes imagenes o en mi caso textos para que vayan apareciendo uno a uno descubriendo el mensaje entero que queremos dar.

2ª TRIODOS BANK (DINÁMICO)

Este es el banner dinámico que he creado para Triodos Bank a partir del banner estático creado anteriormente.

PASO 1: Desde el programa photoshop en el apartado Ventana, seleccionamos la opción Línea del tiempo.

PASO 2: En el apartado Línea del tiempo vamos colocando las diferentes elementos (circulos, rectangulos...) ademas del texto que queremos ir mostrando.

Banner dinámico en Photoshop (GIF)

Hola buenas, a continuación os enseñaré una forma fácil de crear un Banner dinámico (GIF) con la aplicación Photoshop. En mi caso es sobre una bailarina, en el cual se ven los movimientos de la bailarina de una forma en la que parezca que esta bailando.

PASO 1: Crearemos diferentes capas de dicha bailarina en el cual aparezca de diferentes formas, creando la impresión de movimiento.

PASO 2: Desde la barra superior entraremos en el apartado "ventana" y activaremos la opción "Línea de tiempo"

PASO 3: Una vez activada la opción "Línea de tiempo" se nos abrirá un apartado en la zona inferior del programa en el cual nos dará la opción de "Crear animación de cuadros" en la que pulsaremos y comenzaremos a crear el GIF.

PASO 4: Dentro de la opción Línea del tiempo, iremos creando diferentes capas en las cuales seleccionaremos la imagen que queramos ver en dicho momento y quitaremos las que no queramos que se vean (si queremos que se vean todas las imagenes no las quitaremos e iremos añadiéndolas progresivamente), aquí también les asignaremos un tiempo determinado para las transiciones entre una imagen y la siguiente (el tiempo puede ir desde 0 hasta 240 segundos).

A continuación os dejo con con mi Banner dinámico:

Espero que os guste y os haya servido de ayuda para empezar a crear vuestros GIFs, un saludo.

jueves, 26 de abril de 2018

¡¡Hola a todos!!

En esta entrada os vengo a hablar acerca de los Banners.

¿QUE ES UN BANNER?

Un banner es una forma de publicidad en Internet que consiste en incluir una pieza publicitaria gráfica dentro de una página web. Su objetivo fundamental es atraer tráfico hacia el sitio web del anunciante que paga por su inclusión. En principio, cualquier sitio web puede incluir la publicación de banners y otros formatos publicitarios, aunque suelen ser los sitios con contenidos de mayor interés, con una fuerte especialización o con grandes volúmenes de tráfico, los que atraen las mayores inversiones de los anunciantes.

Os pondré 6 diferentes banners dinámicos, y otros 6 banners estáticos, con sus correspondientes características y las paginas diferentes paginas web de donde los he sacado.

6 BANNERS DINÁMICOS.