Hoy le enseñaremos como crear en illustrator un cocktail con efectos muy realisticos.

Abrir un nuevo documento, de cualquier tamaño, en modo RGB. Tome la herramienta pluma y dibuja la forma que ves en la imagen de abajo. Rellenar con el degradado lineal  mostrado abajo. Los colores son (230,230,230) o 10% negro; blanco (255,255,255) y (204,204,204) 20% negro. Con angulo de: -45

Ahora, copie y pegue encima esta forma. Tome la herramienta Selección directa y selecciona el punto superior de la forma y arrastre un poco hacia abajo, como en la imagen. Hacer lo mismo con el punto más bajo de la forma. Luego, llene con el degradado lineal que se muestra con los colores: (191,191,191) o 25% negro; blanco (255,255,255) y (230,230,230) 10% negro.

A continuación, copie y pegue encima  la forma de nuevo y la hacemos un poco más pequeña. Llene con el degradado lineal que se muestra en la imagen con los colores: (77,77,77) 70% negro; blanco y (51,51,51) 80% negro. Ponemos el modo a Color Burn. Vamos a utilizar esta forma de nuevo más tarde para hacer el líquido dentro del vaso. Debería obtener algo como en la siguiente imagen:

A continuación dibujamos una forma como en la imagen debajo y la rellenamos con el degradado de los siguientes colores: (204,204,204) 20% negro; (230,230,230) 10% negro; blanco; (242,242,242) 5% negro y (153,159,164).

Tome la herramienta Elipse y dibuje la forma que ves en la imagen y la rellenas con el degradado lineal. Los colores son (230,230,230) 10% negro; blanco y (178,178,178) 30% negro. Para crear más profundidad, copia y pega la forma que  acabas de hacer, la rellenamos con un gris más oscuro y la colocamos como en la imagen debajo. Ahora, el vaso debe tener este aspecto:

Es hora de dar color al liquido. Copie la forma que dijimos que utilizaremos para esta prte y rellenela del degradado con estos colores: (63,98,46); (85,124,62); (168,194,88); (248,211,103) y (251,232,191).  La forma original, creada con modo Color Burn, tiene que estar por encima de éste y no al contrario.

Ahora, vamos a hacer los cubos de hielo. Tome la herramienta Lápiz y crea algunas formas como las de abajo. Rellenalas con un degradado radial de blanco a negro, establezca el modo Screen y reduce la opacidad para cada uno de ellos. Pueden ajustarlas mas tarde también hasta que le gusta lo que ven.

Ahora los ponemos encima de todas las capas y tendremos algo parecido a esto:

En el siguiente paso vamos a añadir algunos reflejos. Con la herramienta de lápiz dibuja las formas de la imagen abajo,  rellena con degradado lineal con blanco y un color verde similar al utilizado para el líquido, a continuación, establezca el modo de multiplicar y baja la opacidad.

Para que el cocktail tiene un aspecto mas realistico vamos hacer un efecto de cristalizado. Con la herramienta de Pluma dibuja una figura como la de abajo o cualquier otra forma que quepa en la copa. Rellena la de negro, copia y pegala encima de la anterior y rellenala de degradado de la forma que esta mostrado abajo utilizando grises oscuros y blanco. Te vas a panel Transperancy y haces opacity mask.

Te vas a Effects/Pixelate/Mezzotint y selecionas  Fine Dots. Pega la forma encima del vaso cambie el modo a Screen y reduce la opacidad hasta que obtienes un efecto de congelado.

Con la herramienta Pluma hacemos una forma parecida a la mostrada abajo. La rellenamos con el degradado utilizado para el liquido. Despues nos vamos a Effects/Pixelate/Crystallize y establecemos el valor a 4.

Cambiamos el modo a multiply y bajamos la opacidad.

Ahora vamos a hacer gotas deslizandose por el vaso. Para hacer esto cojemos elipse tool y hacemos 3 formas con los siguientes colres: (63,98,46) verde oscuro; (179,202,109)verde ligero y blanco. Y las ponemos una encima de la otra como en la imagen abajo. Vamos a Effects/Stylize/Drop Shadow y ponemos los valores indicados en la imagen abajo.

Coloque la gota de agua como en la imagen y reduce la opacidad al 25%. Copia una gota más de agua y  reduzca su tamaño para conseguir un aspecto más realista.

Con la herramienta de Pluma dibuja una forma, como una paja. Rellena la de blanco con borde 0.5px ligero gris.

Con la herramienta Rectángulo, dibuje un rectángulo pequeño, llenalo de color verde o de otro color que prefiere y arrastralo al panel de pinceles como pattren brush. Despues haga el rectángulo naranja, lo necesitaremos más tarde para la segunda paja.

Ahora traza una linia sigiendo la forma de la paja y rellenala con el nuevo pincel verde que hemos creado. Para hacer modificaciones sobre el pincel basta con hacer doble click sobre el pincel y se nos habre una ventana en cual podemos modificar el espaco entre los cuadrados y su tamaño. Despues de esto ponemos la forma de la paja con el color blanco encima da los cuadrados verdes y hacemos Cliping mask. Tendremos algo asi.

Vamos a hacer otra Opacity mask para que la parte inferior de la paga parezca transparente. Copiamos la forma principal de la paga y la rellenamos con degradado blamco y blanco. Hacemos el segundo bblanco totalmente trasparente. Pegamos esta forma encima de la paga con los rectangulos y hacemos Opacity mask.

Hacemos tambien la otra paja de la misma manera que esta y las colocamos en el cocktail.

Ahora haremos una pequeña paragua para nuestro cocktail vectorial. Usamos el pincel de la biblioteca que esta mostrado abajo. Trazamos una liniea, le damos Expand appearance y copiamos y pegamos la misma forma. Borramos el resto de la figura dejando solo las puntas. Los coloramos de marron.

Usando la herramienta pluma dibujamos una forma parecida a la mostrada abajo y la rellenamos con degradado lineal de un verde mas ligero a uno mas oscuro. Encima dibujamos unas lineas con color verde mas ligero y le añadimos el efecto de sombra ajustando los valores hasta que se consigue algo asi:

Le añadimos las puntitas que hicimos antes y le ponemos un poco de decoracion a nuestro gusto. Yo puse un par de flores. Cojemos la primera forma que trazamos con el pincel y la ponemos como el palito del paragua.

Lisot! La imagen final del cocktail vectorial es esta:

Para cualquier duda sobre el tutorial o preguntas, criticas y sugerencias por favor deja su comentario. Le responderemos inmediatamente. Esperamos que este tutorial le ha servido.

P.D.  Si recibimos comentarios y suscripciones pondremos los archivos originales para descargar. Hay que ver que les interesa lo que ponemos.

Me decido a escribir porque quiero dar una opinión sincera sobre el día a día de esos “friquis informáticos” normalmente socialmente incomprendidos y esclavos de la pasión que los mueve en su trabajo.  (No, no estoy siguiendo el consejo terapéutico de nadie, no pretendo cambiar el mundo y no me creo más importante que un Sony Vaio…aunque admito que tengo celos de MacBook Air – pero solo porque tiene “un cuerpazo” mas estilizado que el mío)

¿Os creéis que vuestros portátiles llevan una vida mejor que la vuestra? Vamos a ver, estoy encendido hasta las altas horas de la noche y cuando por fin me decido poner a hibernar, me doy cuenta de que mi “amo y señor” vuelve a tocarme el “touch pad” para verificar una vez más la bandeja de entrada de su Outlook. Ah, ¿qué crees que eso no molesta? Listillo, como te sentirías tu si yo te metiera un dedo en la nariz cuando intentas dormir…

Para empeorar mi situación un poco más, me ensucian el teclado, sobre el cual pueden nevar migas de un bocata tardío, o lo que es peor, un chorrete de una pizza!

Pero hoy quiero centrarme en un tema en particular, el que, la verdad, me tiene preocupado. (Es que yo al ser un portátil no me puedo tomar un “actimel” y subir mis defensas y la verdad, hay ciertos anti-virus que no me van nada bien. Por muy gratuitos que sean no me protegen de TODAS las amenazas que están ahí fuera…porque vale, “la verdad está ahí fuera” pero también están los códigos maliciosos y todas esas cosas que me hacen pupa…Y no, tu primo no me sabe formatear, no  dejes que me abra tu amigo que “controla el tema”… Es que no entiendo a los humanos, la verdad, la próxima vez que a tu hijo le duela una muela y necesite una extracción le llevare a mi “primo” brazo hidráulico modelo 10060 de Hiab Valman porque ese sí que controla!

Bueno, vale a lo que interesa: como deshabilitar absolutamente el autorun para evitar  entrada de códigos malicios, virus, (me pregunto si servirá contra la gripe A…)

Hay que entrar a gpedit.msc, y entrar a un lugar donde se modifica el modo en que se comporta Windows al insertar un CD/DVD/USB. Se le coloca como esta aquí:

En esta prueba vemos para nuestro propio control en regedit la clave MountPouints2 que es aparentemente el nexo entre el autorun y los virus.

Vamos a la clave MountPoints2 y con el boton secundario del ratón (click derecho) entramos a permisos.

Inmediatamente, procedemos a denegar permisos a cada uno de los usuarios, uno por uno. La primera vez, nos preguntará si estamos seguros:

Como prueba, salimos del regedit y volvemos a entrar, el resultado es este (MountPoints2 no funciona más):

Para le gente que quiere más opciones y más seguridad, recomiendo visitar este sitio.

En su blog, Steve Riley nos explica que lo que acabamos de explicar funcionara solo en el caso de que nuestro sistema no es un viejo conocido del pen-drive cuyo contenido queremos ejecutar, porque en la llave de registro de MountPoints2 se queda una llave de registro la que guarda todos los dispositivos USB que el ordenador ha conocido a lo largo de su vida. Disponemos de esta información gracias al blog de Nick Brown – Memory Stick Worms.

En nuestro próximo blog, yo, Leny, que después de todo el tostón que he soltado ya no ando tan deprimido, explicaremos un poco mas este tema y prometo hablarles de algún que otro USB que he conocido (y que tras haberle dado toda mi confianza, casi destroza mi sistema operativo).

Hasta pronto. Que sean buenos y traten bien a ese portátil que tenéis. Somos amigos del hombre, tan fieles como perros y ni siquiera tenéis que recoger nuestras “cosillas”.

]]> http://www.zendal.es/blog/2009/12/14/la-historia-de-un-portatil-deprimido-o-como-deshabilitar-absolutamente-el-autorun/feed/ 0 http://www.zendal.es/blog/2009/11/17/como-crear-efectos-de-luz-en-photoshop/ http://www.zendal.es/blog/2009/11/17/como-crear-efectos-de-luz-en-photoshop/#comments Tue, 17 Nov 2009 18:17:13 +0000 Diseñador http://www.zendal.es/blog/?p=1098 En este tutorial le vamos a enseñar cómo crear efectos de luz muy reales en Photoshop (realistic IES (photometric) lighting effect). Voy a usar Photoshop CS4 y algunos plugins y software gratuitos.

Para completar este tutorial, necesitará el siguiente software:

• Photoshop CS4
• Karbaras’s IES Generator 3 (Download)
• Richard Rosenman’s Grid Generator 1.7 Plug-in
• Cybia AlphaWorks Plug-in (Download)
• 1589835-nice.IES Profile (Download)

Antes de comenzar el tutorial, asegúrese de tener instalado el Grid Generator y la AlphaWorks plug-ins para Photoshop, y que ha descargado IES Karbaras Generator (una aplicación independiente) y el 1589835 perfil nice.IES.

Paso 1: Poniendo la textura PSD

Esta PSD servirá como un lugar para crear ciertas texturas utilizadas en el diseño final. Me parece muy útil para crear texturas en un documento separado. Es como una caja de arena para la experimentación.

Hacemos un nuevo documento en Photoshop con dimensiones1024px wide x 1024px high con 72dpi. Ajuste el color de primer plano a #34240f y  el color de fondo a #825826. Rellenamos la capa de fondo con este color pulsando Ctrl + Backspace.

Paso 2: Hacer la textura corcho

Nos vamos a Filter > Render > Fibers. Y ponemos – Variance: 8.0, Strength: 47.0. A lo mejor tendremso que pulsar el boton Randomize varias veces hasta que consiguimos el efecto deseado.

Ahora nos vamos a Filter > Distort > Glass. Ponemos los valores en la ventana de la siguiente manera Distortion: 15, Smoothness: 1, Texture: Frosted y Scaling:100%. Pinchamos  OK.

Llamamos esta capa “corcho.” La textura de corcho está completa. Guarde el PSD como “textures.psd”, pero no la cierra.

Paso 3:

Creamos un documento nuevo 1920px wide x 1200px high con 72dpi. Guarde este documento como layout.psd. Rellenamos la primera capa con este color #1a211c y la llamamos “bg”.

Paso 4:

Volvemos a “textures.psd”, duplicamos la capa (botón derecho – “Duplicate Layer…”). En la ventana que se abre elegimos el documento layout.psd. Así la textura nos aparece en ese documento, encima de la capa “bg”.

Paso 5:

Seleccionamos la capa “Background” (que es la textura de corcho) y pulsamos Ctrl + T. Escalamos hasta que cubre toda la capa.

Paso 6:

Hacemos una selección empezando por la esquina superior izquierda con las dimensiones: 1920 x 852.

Paso 7:

Pinchamos en el botón Add Layer Mask al final  del panel de capas. Esto añade una máscara para la capa de textura, ocultando los píxeles de la capa que son fuera de la selección.

Seleccionamos la capa “Background” y al final del panel de capas elegimos “Create new fill or adjustment layer” y elegimos Hue/Saturation.

Hue: -6, Saturation: -7 y Lightness: -8. Y para que la capa de ajustes afecta solo a la capa de la textura del corcho pinchamos en el icono Clip To Layer (se parece a  dos círculos que  se intersecan apilados uno encima del otro).

Paso 8:

Hacemos una capa nueva encima de la capa “bg”. La llamamos “sombra”. Con esta misma capa seleccionada usamos el Rectangular Marquee tool (M) para hacer una selección con dimensiones 1920 x 42, como esta mostrado en la imagen abajo.

Pulsamos la tecla D y así receteamos los colores a negro y blanco. Después seleccionamos la herramienta de degradado Gradient tool (G). Ponemos los colores y los ajustes como esta mostrado en la imagen abajo:

Para ser exactos, zoom sobre la selección. Comenzando en la parte superior de la selección, haga clic y arrastre pulsando Shift (la tecla Mayúsculas mientras arrastra) a la parte inferior. En este caso, Shift-arrastrando limitará la herramienta de degradado para el eje X, de modo que el gradiente está en un perfecto ángulo de 90 grados. Cuando haya terminado, pulse Ctrl + D para deseleccionar.

Cambiar la opacidad de esta capa al 60%.

Paso 9:

Duplicamos la capa “sombra” y la llamamos “lip”. La movemos encima de todas las demás capas.

Seleccionamos la capa “lip” y pulsamos Ctrl + I, así se invierten los colores y el degradado se transforma de blanco a transparente.

Voltear la capa verticalmente, vaya a Edit > Transform > Flip Vertical.

Movemos la capa arriba pulsando Ctrl y la flecha up 10 veces. Cambiamos el modo de la capa a Overlay y la Opacidad a 50%.

Paso 10:

Hacemos una nueva capa encima de la “bg” y la llamamos  “bg-sombra”. Nos aseguramos que el color de primer plano es negro. Usando la herramienta de degradado Gradient tool (G) y la capa “bg-sombra” seleccionada hagan clic en la parte inferior de la imagen y pulsando Shift arrastramos a cerca de tres cuartas partes del camino hasta la parte inferior del panel del corcho. Por último, cambiamos la opacidad de la capa a 50%.

Paso 11:

Ahora vamos a hacer el suelo. Vamos a crear textura de figuras que lo va a representar. Hacemos nueva capa encima de la capa “bg” y la llamamos “suelo” la rellenamos de color negro. Ahora usaremos el plug-in  Grid Generator  de Richard Rosenman. Para hacer esto nos vamos a Filter > Richard Rosenman > Grid Generator. Ponemos los ajustes de la manera que esta mostrado abajo.

Y el resultado:

Paso 12:

Nos vamos a Edit > Transform > Perspective. Ajustamos las asas hasta que conseguimos el efecto mostrado en la imagen abajo. Como pueden ver el grafico sale por fuera de la imagen principal. Cambiamos el modo de la capa a Multiply y la Opacidad a 30%.

Duplicamos la capa “suelo” y la llamamos “suelo-luz”. Movemos esta capa debajo de la capa “suelo”. Lo invertimos pulsando Ctrl + I, cambiamos el modo a Overlay y su opacidad a 10%. Como último lo movemos 1px a la derecha y con esto conseguimos el efecto de iluminación.

Paso 13:

Hacemos nueva capa y la llamamos “suelo_highlight.” La movemos encima de todas las demás capas. Ponemos como color principal blanco. Elegimos la herramienta de degradado y ponemos los siguientes ajustes:

Pulsamos Ctrl y T y modificamos la altitud, después pulsando Shift-Alt alargamos la selección como esta mostrado en la imagen.

Movemos la capa justo encima de la capa “bg-sombra”. Cambiamos su modo a Overlay y la Opacidad a 50%.

Paso 14:

Creamos nueva capa encima de todas las demás y la llamamos “light_housing.” Hacemos una selección en la parte superior de todo el documento con las dimensiones 1920 x 42 y la rellenamos con este color #17150e.

Duplicamos la capa “lip”, la llamamos “housing_highlight” y la movemos encima de todas las demás. Movemos la capa de modo que su base está en la misma posición que la parte inferior de la “light_housing.” Pulsamos Ctrl + T para transformar la capa. Ajustamos desde la parte superior de modo que es aproximadamente la mitad de su altura actual.

Paso 15:

Seleccionamos la capa “housing_highlight” y la duplicamos. La nueva capa llamamos “housing_shadow” y la invertimos pulsando Ctrl +I. Invertimos la capa Edit > Transform > Flip Vertical. Entonces, movemos hacia abajo 1px pulsando la flecha hacia abajo una vez y cambiamos la opacidad a 80%.

Paso 16:

Ejecutamos el IES Generator . En la parte inferior izquierda de la ventana de la aplicación, haga clic en el botón “Load” y busque el perfil “1589835-nice.IES” que  bajamos de internet antes.

Usando  los controles deslizantes en la parte inferior izquierda de la ventana, ajustamos Brightness a 1.11 y Away From Wall a 3.00.

Paso 17:

IES Generator no tiene una función de exportación, por lo que se necesita una captura de pantalla  para pegarlo en el diseño de Photoshop. Puede usar una utilidad de captura de pantalla, si dispone de una, sino pulsando Alt + Print Screen y pegamos en Photoshop en el documento “textures.psd” .

Hacemos una selección, después nos vamos a Select > Inverse y rellenamos todo el campo con color negro.

Paso 18:

Ajora vamos a usar AlphaWorks plug-in con cual vamos a extraer solo los pixeles blancos de esta imagen. Nos vamos a Filter > Cybia > AlphaWorks. Desde el menú desplegable situado en la parte superior derecha del cuadro de diálogo del filtro elegimos “LINEAR BlackOut – remove from BW lineart.” Pulsamos OK. Y este es el resultado:

Movemos esta capa en nuestro documento principal y la llamamos “ies_light.” La ponemos justo encima de la capa “Hue/Saturation 1.” Movemos la luz hacia la parte superior del documento como esta mostrado en la imagen y cambiamos el modo de la capa a Overlay.

Duplicamos la capa “ies_light” dos veces. Cambiamos la opacidad del último duplicado (”ies_light copy 2″) a 50%. Después unimos las 3 capas de luces en un mismo grupo llamado “luz”. Con el grupo seleccionado pulsamos el botón de “Add a layer mask” que se encuentra al final del panel de capas. El grupo “luz” ponemos en otro grupo llamado “luces”.

Pichamos en la miniatura de la máscara del grupo “luz” para seleccionarla. Escogemos la herramienta de degradado Gradient tool (G) con los ajustes del Paso 7. Y trazamos como esta mostrado:

Paso 19:

Duplicamos la capa “suelo_highlight” . La nueva capa “suelo_highlight copy” movemos dentro del grupo “luces”.

Pulsamos Ctrl +T y reducimos la anchura de la capa “suelo_highlight copy” casi a la mitad. Cambiamos su nombre a “spot” y reducimos la Opacidad a 70%. Después duplicamos 2 veces el grupo “luces”. Y los posicionamos de la siguiente manera.

Después duplicamos los 3 grupos de luces y los unimos en una capa Ctrl + E. Llamamos esta capa “spill.” La movemos encima de todas las demás capas y cambiamos su modo a Overlay. Después nos vamos a Edit > Transform > Flip Vertical. Bajamos la opacidad a 21%.

Como ultimo añadimos el texto, pueden usar cualquier fuente. Los ajustes para el efecto de texto son los siguientes:

Resultado Final:

Descargar Fondo de Escritorio en tamaño real

How to Create a Realistic IES Lighting Effect in Photoshop Posted: 13 Nov 2009 06:36 AM PST In this tutorial, I’ll show you how to create a realistic IES (photometric) lighting effect. We’ll be using Photoshop CS4 as well as some free plugins and software. Let’s get started! Final Image Preview Take a look at the image we’ll be creating. Want access to the full PSD files and downloadable copies of every tutorial, including this one? Join Psd Plus for just $9/month. You can view the final image preview below. Tutorial Preparation In order to complete this tutorial you’ll need the following software: Photoshop CS4 Karbaras’s IES Generator 3 (Download) Richard Rosenman’s Grid Generator 1.7 Plug-in Cybia AlphaWorks Plug-in (Download) 1589835-nice.IES Profile (Download) Prior to beginning the tutorial, make sure you have installed the Grid Generator and the AlphaWorks Photoshop plug-ins, and that you’ve downloaded Karbaras’s IES Generator (a standalone app) and the 1589835-nice.IES profile. Step 1: Setting Up the Texture PSD This PSD will serve as a place to create certain textures used in the final layout. I find it helpful to create textures in a separate document. It’s like a sandbox for experimentation. Make a new document in Photoshop that is 1024px wide by 1024px high at 72dpi. Set the foreground color to #34240f by clicking the topmost color swatch in the Tools palette and entering this number at the bottom of the Color Picker dialog box. Set the background color by the same method to #825826. Fill the “Background” layer with this color by pressing Command + Backspace. Step 2: Making the Corkboard Texture Now go to Filter > Distort > Glass. In the Glass filter dialog box, set Distortion to 15, Smoothness to 1, Texture to Frosted and Scaling to 100%. Click OK. Go to Filter > Render > Fibers. In the Fibers filter dialog box set Variance to 8.0 and Strength to 47.0. You will probably need to click the Randomize button several times to get a texture that has an even distribution of Step 1’s foreground and background colors. The best way to get a feel for the overall effect is to reduce the magnification of the preview image by clicking the minus sign below it until the minimum is reached, in this case 16%. When done, click OK. The result will be similar to this: Now go to Filter > Distort > Glass. In the Glass filter dialog box, set Distortion to 15, Smoothness to 1, Texture to Frosted and Scaling to 100%. Click OK. Name this layer “corkboard.” The result will be similar to this: The corkboard texture is complete. Save the PSD as “textures.psd” but don’t close it. Step 3: Setting up the Main Layout Create a new document that is 500px wide by 300px high at 72dpi. These dimensions are arbitrary and meant for the tutorial only. Save this document as “main_layout.psd.” Rename the “Background” layer to “floor_color” and fill it with #1a211c. This can be accomplished by setting the foreground color in the Tools palette to #1a211c and pressing Alt + Backspace. Step 4: Bringing in the Corkboard Texture Go back to the “textures.psd” document. Right-click the “corkboard” layer and select “Duplicate Layer…” from the contextual menu. In the resulting dialog, name the copied layer “corkboard” and select “main_layout.psd” as the destination document. Go back to the “main_layout.psd” document. The new “corkboard” texture layer should appear above the “floor_color” layer. Step 5: Resizing and Repositioning the Corkboard Texture With the “corkboard” layer selected in the Layers palette, press Command + T, the keyboard shortcut for the Edit > Transform > Scale command. In the Transform Tool Options palette click the Maintain Aspect Ratio icon (noted with a red arrow in the image below) between the width and height fields, and enter 75.00% for the width. Press Enter twice and the transform will be complete. Clicking the “Maintain aspect ratio” icon ensures that the layer will be scaled equally in both directions. Alternatively, 75.00% can be entered in both fields without clicking the icon; the result would be the same. The scaling operation will cause the texture layer to shift out of position so that it’s located awkwardly in the lower right of the layout. With the “corkboard” layer selected, use the Move tool (V) and drag the texture around until it’s in a position that looks pleasing, without great variations in tone across the layout: Step 6: Revealing the Floor Layer and Adjusting the Corkboard Color With the “corkboard” layer selected use the Rectangular Marquee tool (M) to select a region that is 500px wide by about 230px high, starting at the upper left of the layout. Click the Add Layer Mask button at the bottom of the Layers palette. This will add a mask to the texture layer, hiding the layer’s pixels outside of the selection. With the floor color revealed, the corkboard texture looks a bit oversaturated. This can be corrected using Adjustment Layers. Select the “corkboard” layer. At the bottom of the Layers palette, click the “Create new fill or adjustment layer” icon, and select Hue/Saturation. In the Adjustments palette, set Hue to -6, Saturation to -7 and Lightness to -8. Also, so that the Adjustment layer only affects the “corkboard” texture layer, click the Clip To Layer icon at the bottom of the Adjustments palette (it looks like two intersecting circles stacked one on top of the other). This causes the Adjustment layer to affect only the layer directly below it in the Layers palette, which is indicated in the Layers palette by a downward-pointing arrow on the “Hue Saturation” layer; the name of the layer below it will be underlined. Step 7: Adding a Shadow Beneath the Corkboard Make a new layer above the “floor_color” layer by clicking the Create New Layer icon at the bottom of the Layers palette (indicated by a red arrow in the image below). Once the new layer is created, move it directly above the “floor_color” layer and rename it to “cork_shadow.” Layers are rearranged in the Layers palette by clicking and dragging them into position above or below other layers. With the “cork_shadow” layer selected, use the Rectangular Marquee tool (M) to make a selection region 500px wide by 10px high starting at the bottom of the cork texture. Change the foreground color to black by pressing D on the keyboard (this resets the color swatches in the Tools palette to the default black foreground and white background). Next, select the Gradient tool (G). In the Gradient Tool Options palette, select the gradient preset Foreground to Transparent and the type Linear Gradient. To be accurate, zoom in on the selection. Starting at the top of the selection, click and Shift-drag (hold the Shift key while dragging) to the bottom. In this case, Shift-dragging will constrain the Gradient Tool to the X-axis, so that the gradient is at a perfect 90-degree angle. When done, press Command +D to deselect the region. Change the opacity for this layer to 60%. Do this either by pressing 6 on the keyboard or entering the value directly in the Master Opacity box for the layer in the Layers palette. Step 8: Adding a Lip on the Corkboard With the “cork_shadow” layer selected, press Command +J to duplicate it. In the Layers palette, drag the copied layer (automatically named “cork_shadow copy”) to the top of all other layers. Rename this layer “lip.” Make sure the “lip” layer is selected and invert the color of the layer pixels by pressing Command +I. Now it will be a white-to-transparent gradient. Flip the layer vertically by going to Edit > Transform > Flip Vertical. Nudge the layer up 9px by pressing Command + Up Arrow nine times. Now change the layer blending mode to Overlay and change the layer opacity to 50%. Step 9: Adding a Shadow to the Floor Make a new layer above the “floor_color” layer and name it “floor_shadow.” Make sure the foreground color in the Tools palette is black. Using the Gradient tool (G) with the “floor_shadow” layer selected, click at the bottom of the layout and Shift-drag to about three-quarters of the way up to the bottom of the corkboard. Finally, change the layer opacity to 50%. Step 10: Adding Floorboards Next, we’ll add some lines to suggest floorboards. Make a new layer above the “floor_color” layer, fill it with black and name it “floorboards.” This step uses the free Grid Generator plug-in by Richard Rosenman. With the “floorboards” layer selected, go to Filter > Richard Rosenman > Grid Generator. Adjust the settings in the Grid Generator dialog box to match those shown below: This is the result: Step 11: Adding Perspective and Highlights to the Floorboards Go to Edit > Transform > Perspective. Adjust the perspective of the “floorboards” layer by dragging the handles in the upper and lower corners of the transformation box left and right (indicated by red arrows) until it looks something like the image below. Note that the handles will need to be dragged beyond the edges of the document. When done, press Enter to apply the transformation. Change the “floorboards” layer’s blending mode to Multiply and its opacity to 30%. Duplicate the “floorboards” layer and rename the new layer to “floorboards_highlight.” Move this layer directly below the “floorboards” layer. Invert it by pressing Command +I, change its blending mode to Overlay and its opacity to 10%. Finally, nudge it 1px to the right by pressing the Right Arrow once. This will give a subtle highlight to the floorboards. Step 12: Adding an Overall Highlight to the Floor Make a new layer and name it “floor_highlight.” Move this new layer to the top of the Layers palette, above all other layers. Change the foreground color to white by pressing D, then X, on the keyboard (this resets the Tools palette color swatches to default and then reverses them). Select the Gradient tool (G), and change its preset to Foreground to Transparent and its type to Radial Gradient. Starting at the center of the layout, click and Shift-drag to nearly the top edge of the layout. Press Command +T to transform the layer. Use the top center handle of the transform region to adjust the layer’s height. Adjust its width outward from the center by Shift-Alt-dragging the left or right center handle. Press Enter to apply the transformation. Move the “floor_highlight” layer to the spot directly above the “floor_shadow” layer in the Layers palette. Change its blending mode to Overlay and its opacity to 50%. Step 12: Creating the Light Housing Make a new layer and move it to the top spot in the Layers palette. Name this layer “light_housing.” At the very top of this layer, use the Rectangular Marquee tool (M) to make a selection that’s 500px wide by 10px high. Change the foreground color in the Tools palette to #17150e and fill the selection with this color by pressing Alt+Backspace. Duplicate the “lip” layer by selecting it in the Layers palette and pressing Command +J. Move this new layer above the “light_housing” layer in the Layers palette and rename it “housing_highlight.” Use the Move tool (V) to move the layer up so that its bottom is in the same position as the bottom of the “light_housing.” Press Command + T to transform the layer. Adjust it from the top so that it’s roughly half its current height. Step 13: Adding a Shadow Beneath the Light Housing Select the “housing_highlight” layer in the Layers palette and press Command + J to duplicate it. Rename the layer “housing_shadow” and invert it by pressing Command +I. Flip the layer vertically by going to Edit > Transform > Flip Vertical. Then, nudge it down 1px by pressing the Down Arrow once. Finally, change its opacity to 80%. Step 14: Creating a Light Launch IES Generator. At the bottom left of the application window, click the Load button and locate the “1589835-nice.IES” profile that you downloaded in the Tutorial Preparation. Using the sliders at the lower left of the window, adjust Brightness to 1.11 and Away From Wall to 3.00 so that the image on the right side of the window looks something like this: Step 15: Bringing the Light into Photoshop IES Generator doesn’t have an export or save function, so a screen capture is needed to paste it into the Photoshop layout. You can use a screen capture utility if you have one. Otherwise, press Alt + Print Screen (this is a Windows key-combination which captures the active window to the clipboard). After making the capture, return to Photoshop. Open the “textures.psd” document created in Step 1, if it isn’t already open. Press Command +V to paste the screen capture into the document. It will appear in a new layer above the “corkboard” layer. If for some reason it ends up below the “corkboard” layer, just move it up in the Layers palette. With the new layer selected, use the Rectangular Marquee tool (M) to make a selection around the IES image as shown: Go to Select > Inverse to invert the selection. Fill this region with black. Step 15: Extracting the White Pixels from the Light Layer and Positioning It Now we’ll use the free AlphaWorks plug-in by Cybia to remove all the black from this layer, so that we end up with just the white pixels that make up the light pattern. Go to Filter > Cybia > AlphaWorks. From the drop down menu at the upper right of the filter’s dialog box, select “LINEAR BlackOut – remove from BW lineart.” Click OK. This will be the result: With this layer still selected, press Command +A (Select > All), copy it, then switch to the “main_layout.psd”. Select the “Hue/Saturation 1″ layer in the Layers palette and press Command +V to paste. The new layer will appear between the “lip” layer and the “Hue/Saturation 1″ layer. Rename it to “ies_light.” Nudge the “ies_light” layer up 6px by pressing the Up Arrow six times. Now change this layer’s blending mode to Overlay. Step 16: Intensifying the Light Duplicate the “ies_light” layer twice by selecting it in the Layers palette and pressing Command +J twice. Change the opacity of the topmost copy (”ies_light copy 2″) to 50%. The three layers, “ies_light,” “ies_light copy” and “ies_light copy 2″ make up a single effect. Collect them into one layer group by clicking the “ies_light” layer, holding down the Shift key and selecting “ies_light copy 2.” Click the icon at the top right of the Layer palette and select New Group from Layers. In the dialog box that pops up, name the group “light.” Click OK. Now the three layers will be in a single group. Step 17: Controlling the Extent of the Light Select all the layers within the “light” group, and group them again by the same method described in Step 16. It’s not necessary to rename this new layer group. Select “Group 1″ in the Layers palette and create a layer mask for this group by clicking on the “Add a layer mask” icon at the bottom of the palette. The mask will appear ahead of the group name – it looks like a white box. In the Layers palette, click the layer mask thumbnail (the white box) to select it. Select the Gradient tool (G). As described in Step 6, make sure the gradient preset is Foreground to Transparent and the type is Linear Gradient. Starting at the middle of the floor, click and Shift-drag to a spot approximately as shown in the image below. A preview of the mask just created will appear in the layer mask thumbnail. Step 18: Adding a Highlight Spot on the Floor Collapse “Group 1″ within the “light” layer group by clicking the gray arrow to the left of its name. Select the “floor_highlight” layer in the Layers palette and duplicate it by pressing Command +J. The new layer will be named “floor_highlight copy.” Move this new layer into the “light” group by dragging and dropping it directly on the “light” group’s name. Press Command +T to transform the “floor_highlight copy” layer until it’s approximately 50% of its current width. Press Enter to apply the transformation. Rename the layer to “spot” and change its opacity to 70%. Step 19: Duplicating the Light Two more copies of the “light” group are needed. Select and collapse the “light” layer group in the Layers palette. Drag and drop it on the “Create a new layer” icon at the bottom of the palette. A copy of the group, named “light copy” will appear above the original in the Layers palette. Copy this new group by the same method. There will now be three groups in the Layers palette named “light,” “light copy” and “light copy 2.” Step 20: Moving the Lights into Position With the “light copy 2″ layer group selected in the Layers palette, nudge it left 140px by pressing Shift+Left Arrow 14 times (holding the Shift key down while using the arrow keys nudges 10px at a time). Next, select the “light copy” group and nudge it right 140px by the same method. Rename “light copy 2″ to “light_left,” “light copy” to “light_right” and “light” to “light_center,” to coordinate with their positions in the layout. Step 21: Spilling the Lights onto the Housing Select the layer groups “light_center,” “light_right” and “light_left.” Drag and drop them onto the “Create a new layer” icon at the bottom of the Layers palette. Three new copies of these groups will appear above the originals in the Layers palette. Press Command +E to merge the groups into one layer. Rename the layer “spill.” Move it to the top of the Layers palette above the “housing_shadow” layer and change the layer’s blending mode to Overlay. Flip it vertically by going to Edit > Transform > Flip Vertical. Nudge the “spill” layer up 230px by pressing Shift+Up Arrow 23 times. Using the Rectangular Marquee tool (M), make a selection that’s 500px wide by 10px high, starting at the upper left of the layout. Click the “Add layer mask” icon at the bottom of the Layers palette to add a mask to the “spill” layer. This will restrict its effect to the light housing area. Step 22: Adding a Shadow Behind the Lights (optional) Next, we’ll darken the area around the top of the lights against the corkboard to give them a little more emphasis. This step is optional. In the Layers palette, select the “lip” layer and click the “Create a new layer” icon at the bottom of the Layers palette. The new layer will appear above the “lip” layer. Rename it to “top_shadow.” Using the Gradient tool (G), with the preset Foreground to Transparent, type Linear Gradient and a foreground color of black, Shift-drag in the “top_shadow” layer as shown: The “top_shadow” layer needs to be masked so that it excludes the lights. Select the layer groups “light_center,” “light_right” and “light_left.” Duplicate and merge them into a single layer. Command-click the layer thumbnail in the Layers palette to load the layer’s transparency as a selection. Go to Select > Inverse to invert the selection. Now select the “top_shadow” layer in the Layers palette and click the “Add layer mask” icon at the bottom of the palette. Change the “top_shadow” layer’s opacity to 60%, and its blending mode to Overlay. Finally, delete the “light_left copy” layer. Step 23: Adding Text, The Final Step As the final step, inlaid text will be added to the corkboard. Any font(s) can be used, but this example uses Arista 2.0 Light and DIN Mittelschrift. (How to use Photoshop’s Text Tool will not be covered in this part of the tutorial.) The text layers should be placed above all other layers in the Layers palette. In the Layers palette, double-click in the area to the right of the text layer’s name. This will open up the Layer Style dialog box. In the Layer Style window, adjust the settings as shown. Drop Shadow: Inner Shadow: Color Overlay: Final Result This is the final result: Further Suggestions I recommend that this effect be used sparingly. For example, use it only to highlight a logo in the header of a website, or to emphasize a few elements on a page. Angling the light(s) can further enhance the effect; flipping the effect vertically gives the impression of footlights. You can also colorize the lighting by use of a Color Overlay or Gradient Overlay layer style. For this tutorial, I selected an IES profile that has been very popular in 3D art, as it has such a distinct appearance. For this reason it has become overused and clichéd. However, there are hundreds of other IES/photometric profiles freely available: ERCO Light Scout GE Photometric Files Karbaras’s IES Generator also allows you to create your own profiles. I hope you enjoyed this tutorial! Subscribe to the Psdtuts+ RSS Feed for the best Photoshop tuts and articles on the web.

Resultado Final:

Paso 1:

Crear un nuevo documento: 1000 X 500 px. con una resolución de 300 px., con el nombre de “Home”.

Paso 2:

Vamos a  usar  textura para nuestro planeta.  Pueden obtener la textura  desde planetpixelemporium.com. Descarguen el “mapa de color”  del sitio y lo insertan como capa nueva en Photoshop. Cambien el nombre de esta capa a “Tierra”.

Paso 3:

Nos vamos a 3D > New Shape From Layer > Sphere. Esto envolvera la capa alrededor de una esfera y va a ser la capa base de nuestra ilustración planeta.

Paso 4:

La capa  “Tierra” es ahora capa 3D y un icono de cubo esta mostrado en la paleta de las Capas. Pueden interactuar con un modelo 3D en una capa 3D en Photoshop. Pueden rotar y mover el modelo o cambiar la posición de la cámara en espacio 3D utilizando las herramientas 3D en la caja de herramientas.

Paso 5:

Cogen la herramienta de rotación 3D, hagan clic en el lienzo, mantengan y arrastren para girar la esfera y ajustarla como quieran. Manteniendo pulsada la tecla Alt o Shift restringirá el eje de rotación.

Paso 6:

Vamos a arreglar los bordes de la esfera. Pinchamos 2 veceses en el icono cubo de la capa “Tierra” para sacar la paleta 3D. Aqui pueden hacer varios ajustes en la capa 3D. Asegúrense de que la “Scene” esta seleccionada en la lista superior y establecer Anti-Alias a Best. Esto solucionará los bordes.

Paso 7:

Ahora hagan clic en el cuadro de Global Ambient Color y establecen el color a R:100, G:100, B:100 y pulse OK. Esto cambiara el color de ambiente a uno mas claro.

Paso 8:

Ahora añadiremos un mapa de relieve a nuestro planeta. Primero hay que bajar el “bump map” de planetpixelemporium.com y guardar la imagen en su escritorio. Ahora nos vamos a la paleta de 3D. Nos vamos a Sphere_Material y pinchamos el boton de  Edit the Bump Texture y elegimos  Load Texture. Seleccionen el archivo que acaban de descargar. También queremos que nuestro planeta sea brillante, así que pongan el brillo al 100%.

Paso 9:

En la Paleta de 3D verán que hay tres luces. Estas son las luces de escena por defecto de Photoshop. Ahora vamos a cambiar sus tipos, colores y posiciones. Primero selecionen “Infinite Light 1″ y cambian su color a  R:150, G:150, y B:150. Ahora seleccionen “Infinite Light 2″ y establecen el tipo a  Point para cambiar la posicion. Cambian el color a  r:180, G:180, and B:180. Por ultimo seleccionen “Infinite Light 3,” tipo -  Point tambien y Color – R:130, G:130, y B:130.

Paso 10:

“Infinite Light 3″ esta colocada en algún lugar bajo la esfera. Como vamos a poner la esfera sobre una superficie y añadir algunas sombra más tarde,  no quieremos ninguna luz por debajo de ella. Así que coloquen la luz por encima de la esfera usando Slide and Drag Tools.

Paso 11:

Ahora haremos las nubes alrededor del planeta. Ir a la paleta Capas, duplicar la capa “Tierra”  y ponganle el nombre “Nubes”. Abren el panel de propiedades 3D para la capa “Nubes”. Pinchen el boton  Edit the Diffuse Texture y eligen Remove Texture.  Ajusten el color difuso en blanco.

Pinchen en el boton  Edit the Bump Texture y eligen a quitar  Texture. Ahora tenemos una esfera blanca. Vamos a usar otra textura para las nubes. Pueden descargar la imagen”cloud transparency ” desde  planetpixelemporium.com. Pinchen en el boton  Edit the Opacity Texture y eligen Load Texture. Localizen el archivo “earthcloudmaptrans.jpg”.

Hagan clic en el botón Editar la opacidad de textura de nuevo y esta vez seleccionen Abrir Textura (Open Texture). Esto abrirá la textura en una nueva ventana. Nos vamos a Image > Adjustments > Invert. Guarden y cierran el docuemnto. Volvemos a “Home.PSD” y veremos que la mapa de opacidad esta actualizada.

Tenemos demasiadas nubes. Lo arreglamos quitando la opcion Two Sided. Ajustamos los colores Ambient y Specular a blanco. Pueden obtener la herramienta de rotación 3D de la caja de herramientas y ajustar la orientación de las nubes, si lo desean.

Paso 12:

Para hacer que las nubes destaquen un poco más definimos el color de las tres luces a blanco.

Paso 13:

Aplicamos Drop Shadow a la capa “Nubes” con los siguientes ajustes: Blend Mode – Multiply, Color- negro, Opacity s – 75%, Distance  – 1px y Size – 3px.

Paso 14:

Duplicamos las dos capas que tenemos – Tierra y Nubes. Oclultamos los originales y juntamos las copias. Ponemos el nombre “Planeta” a la nueva capa que se ha generado juntando las dos anteriores. Le vamos a aplicar Inner Shadow usando los siguientes ajustes: Blend Mode – Multiply, Color – negro, Opacity – 100%, Angle : -90, Distance – 25px y Size- 46px. Esto va a hacer la parte de abajo más oscura.

Paso 15:

Creamos nueva capa abajo de la capa Planeta y la llamamos Shadow. Cogemos la heramienta Elliptical Marquee Tool y hacemos una seleccion como esta mostrado en la foto abajo. La rellenamos con color negro y nos vamos a Filter > Blur > Gaussian Blur con radius – 7px. Nos vamos otra vez a Filter > Blur > Motion Blur, ajustamos el Angle a 0 y Distance a 150 px y lo aplicamos.

Paso 16:

Duplicamos la capa “Shadow”. Pulsamos  Ctrl + T, ajustamos Vertical y Horizontal Scale a 60% y aplicamos. Esto va a crear otra sombra mas oscura donde la esfera toca el fondo.

Paso 17:

Nos vamos a la capa “Planeta”, la duplicamos y la llamamos “Reflection”. Borramos el estilo de Inner Shadow. Nos vamos a Edit > Transform > Flip Vertical para reflecar la imagen. Movemos la capa “Reflection” debajo de la capa “Planeta” y la posicionamos como esta mostrado en la foto abajo.

Paso 18:

Añadimos Layer Mask a la capa “Reflection”. Cogemos Gradient Tool – ajustamos los colores a blanco y negro. Ponemos el degradado a la mascara de la capa como esta enseñado abajo.

Paso 19:

Pinchamos en el Thumbnail de la capa “Reflection”. Nos vamos a Filter > Blur > Gaussian Blur, Radius – 2 pixels. Ajustamos la opacidad de la capa a 75%.

Como ultimo ponemos un fondo al documento en degradado con colores – azul claro y blanco.

Descargar los archivos PSD del Tutorial

1. Crear un campo de texto dinámico con nombre de instancia hora_txt

2. Insertar el siguiente código en un fotograma en la misma línea del tiempo donde se encuentra el texto dinámico:

var hoy_date:Date = new Date();

dia = hoy_date.getDate();
if (dia < 10){
dia = “0″ + dia;
}

mes = hoy_date.getMonth()+1;
if (mes < 10){
mes = “0″ + mes;
}

ano = hoy_date.getFullYear();

hora = hoy_date.getHours();
if (hora < 10){
hora = “0″ + hora;
}

minuto = hoy_date.getMinutes();
if (minuto < 10){
minuto = “0″ + minuto;
}

hora_txt.text = dia + “/” + mes + “/” + ano + “    ” + hora + “:” + minuto;