por Omar Benyakhlef | Diseño de páginas web
Acciones para Photoshop
Este blog de diseño web, está lleno de enlaces con utilidades para Photoshop. Podéis encontrar todo tipo de pinceles, tutoriales o incluso psd para descargar e investigar. Pero faltaba algo, algo que suele ser útil en determinadas ocasiones, las acciones.
No soy muy amigo de usarlas, pero reconozco que en ocasiones ayudan mucho sobre todo a ahorrarnos tiempo. De todos modos lo que es importante es ir controlando lo que hace la acción para adecuar los parámetros al fin que andamos buscando.
En este post podréis encontrar una primera entrega de acciones para hacer todo tipo de efectos sobre vuestros diseños,
- Deviantart como no podía ser de otra forma tiene una inmensa galería de acciones para descargar.
- Turning Turnip nos trae unas acciones realmente útiles, entre ellas cabe destacar el efecto «cubo 3D» .
- Efecto Collage es uno de mis favoritos, divide una fotografía original en varias pequeñas, las corta y las deja colocadas como se de cartas de una baraja se tratase.
- Efecto cuaderno de espiral, otra genial acción de planosFX, parecerá que hemos diseñado un cuaderno.
- Foto Vintage, otra acción más de Deviantart.
- Efecto puzzle, creamos un puzzle a partir de nuestra imagen.
- Efecto Comic, bien divertido siempre y cuando vayas controlando la acción paso a paso.
por Omar Benyakhlef | Ajax, Diseño de páginas web, jQuery, Mootools
cambiar font-size con javascript
En diseño web cada vez encontramos más diseños en los que se combinan distintos tamaños de fuente. Esta práctica tan utilizada en diseño impreso, ahora y quizás debido a los blogs, se ve reflejada en muchos de los mejores diseños que vemos por la red.
Echando un vistazo a CSSTricks he encontrado un interesantísimo artículo en el que nos cuentan como cambiar el tamaño de la fuente de un párrafo en función de la cantidad de letras que contiene.
Chri Coyier, el autor de esta idea, nos cuenta cómo hacerlo usando javascript y nos deja dos ejemplos, uno usando Mootools y el otro usando jQuery.
A continuación os dejo los dos ejemplos, y os recomiendo que echéis un vistazo al post, porque de los comentarios también podréis aprovechar más de una idea que simplifica el código.
(más…)
por Omar Benyakhlef | Diseño de páginas web
Reflejo automático en tus imágenes
En los últimos tiempos y seguramente gracias a la gente de Apple, hemos podido ver cómo el diseño web se llenaba de reflejos, de imágenes que se reflejan en el suelo dando una sensación de profundidad.
Si vamos a hacer un diseño en el que la imagen va a permanecer, cogemos el photoshop y en pocos pasos le crearemos el efecto deseado, pero si se trata de una página dinámica en la que queremos aplicar ese efecto a la imagen que en esos momentos esté apareciendo, lo más cómodo será usar este script.
Como vamos a ver, el uso es verdaderamente sencillo y las ventajas enormes.
(más…)
por Omar Benyakhlef | Diseño de páginas web, Tutoriales
PSDs Gratis para descargar y aprender
Sin duda en diseño web como en cualquier otro tipo de diseño gráfico, Photoshop es absolutamente necesario. Controlar este programa significa poder llegar a crear tus propias imágenes y distinguirte de los demás. En numerosas ocasiones vemos imágenes realizadas por expertos, pero no es lo mismo ver un diseño plano (jpg…) que poder ver las capas en el psd y ver cómo el autor lo ha ido montando.
Gracias a estos psd podrás usar una gran cantidad de «trucos» para tus próximos diseños. Evidentemente se trata de trabajos realizados por expertos, por lo que a pesar de poder descargártelos gratis lo «legal» es ser solidario con estos autores y sus obras y usarlos como modelos para nuestros próximos diseños, no como material listo para usar…
(más…)
por Omar Benyakhlef | Diseño de páginas web, Trucos CSS
Background Image
Cada vez son más numerosas las webs y blogs que flotan sobre una impresionante imagen. Este fondo puede ser una imagen única o una más pequeña que se repite horizontalmente, verticalmente o ambas.
Los fondos consiguen dar mayor peso gráfico a la web, y sobre todo, captar la atención del usuario.
A continuación vamos a ver unos ejemplos de web con backgrounds, cómo insertar el código en la CSS y un par de sitios en los que poder descargar buenos backgrounds.
(más…)
por Omar Benyakhlef | Diseño de páginas web
Pinceles Retro Vintage
El diseño web retro es un estilo único y muy atractivo para cualquier tipo de usuario. Cada vez se ven más diseños tanto en webs diseñadas para empresas, como personales o publicidad impresa.
Una de las mejores ayudas que vamos a tener a la hora de hacer diseños de este estilo son los pinceles, ahí van unas cuentas librerías de pinceles para photoshop que os serán muy útiles.
(más…)