En esta primera entrega arranco ya con las guías dispuestas de acuerdo a lo que voy a crear, además de tener al lado un psd con las imágenes que se van a agregar y otro con fragmentos de texto Lorem Ipsum, todo para ahorrar tiempo y no distraer mi atención.
———
Este video no pretende ser un detallado tutorial de como se dibuja una pagina web, simplemente es un ejemplo de como desarrolle este diseño, por lo que esta dirigido a usuarios con un nivel de Medio a Avanzado en el manejo de Photoshop quienes dominen a la perfección las Herramientas Básicas del programa. Es algo extenso, así que lo hemos dividido en 4 partes de 5 mins. cada uno. La canción en esta primera parte es "Eyes on Me" de Faye Wong, la que escuche por primera vez en el juego Final Fantasy VIII.
———
Desarrollo.
– El documento con fondo RGB con fondo transparente tiene un tamaño de 738 X 226 px.
– Primero se rellena el fondo con el color 843B00, el cual también tomaré como base para los demás colores.
– Luego se crea la base del diseño y se rellena de blanco (ffffff)
– Se agrega la primera imagen a la izquierda.
– Entonces una columna central que será la base del menú, esta se hace con un degradado un poco inclinado.
– Se continúa con una columna derecha que soportará mayormente los contenidos de la pagina, en especial del home.
– Viene entonces una sombra entre la columna central y la derecha.
– Se agregan otras dos imágenes externas. Se ajusta su tamaño y se agrega un borde. Con en cambio de tamaño una se difumina un poco, lo cual se revierte con una máscara de enfoque.
– Finalmente se agrega una base a la imagen izquierda, luego veremos para que.
Espera un momento mientras carga el video…
Esta es tan solo la primera de 4 partes. Al final quedará así:
– Diseño de una Pagina Web con Photoshop CS 1
– Diseño de una Pagina Web con Photoshop CS 2