Ir al contenido principal

Banner dinamico con Photoshop

Hola que tal
En esta entrada os mostraré el mismo Gif que en la anterior pero en esta ocasión lo he realizado con el programa Adobe Photoshop. Os iré explicando como lo he ido haciendo yo y os dejare de nuevo con el que he realizado yo.

Para empezar lo que tenemos que hacer es crear todo el banner por completo y dejarlo separado en capas, una vez tengamos el banner creado, sacaremos la línea de tiempo y seleccionaremos que esta funcione a mediante cuadros.
Una vez creada nuestra línea de tiempo a cuadros lo que debemos hacer es ocultar las capas necesarias en función de lo que querremos que se vea en el primer cuadro de nuestra linea de tiempo, y una vez tenemos creado nuestro cuadro inicial vamos creando más cuadros a la vez que vamos revelando capas.

Aqui os dejo el mismo gif que en la entrada anterior pero creado con Photoshop y otros gifs que he creado de la misma manera:








Comentarios

Entradas populares de este blog

Linea de tiempo con Photoshop

Hola que tal, en esta entrada veremos como he realizado varias animaciones usando la linea de tiempo del programa Adobe Photoshop. Esta es la linea de tiempo con la que he realizado la animación como podemos ver he creado diferentes fotogramas clave en distintos puntos y cambiando varias cosas como puede ser la opacidad, el estilo y sobre todo la posición del elemento animado.

Video con transiciones Photoshop

Hola que tal, en esta entrada os mostrare un vídeo que he realizado con el programa Photoshop, este es un vídeo realizado con imágenes, pero en esta ocasión le he añadido diferentes transiciones que tenemos disponibles en la linea de tiempo, el botón para añadir las transiciones lo podemos encontrar en la barra de control de la linea de tiempo, hacemos click en el icono y nos saldrán diferentes transiciones, una vez elijamos la que queramos la arrastramos hacia uno de los dos extremos del clip que deseamos que tenga dicha transición.

Legibilidad web

Hola que tal. En esta entrada os mostrare la diferencia entre una pagina web ilegible y otra pagina web legible. Pagina web legible: Como ejemplo de pagina legible os mostrare la pagina web de Samsung. En esta web podemos observar que es bastante legible; las letras utilizadas en esta pagina son de la misma familia tipográfica y no hay exceso de diferentes tipografías, respecto al color vemos que es un contraste bastante legible y que no cansa a la vista puesto que los colores utilizados son colores que no cansan la vista.  Por otra parte el ancho de pagina se respeta bastante también. Por otra parte esta pagina web rompe todos los criterios de legibilidad web, ejemplos de esto pueden ser la excesiva cantidad de gifs utilizados, los colores utilizados como contraste entre carácter y caja de texto o carácter y fondo, por otra parte podemos ver que el ancho de pagina no se respeta en absoluto, y como ejemplo de esto podemos observar la caja de texto que se extie...