A veces tenemos un buen diseño en nuestra mente y no tenemos ni idea por donde empezar, o simplemente no nos hacemos la idea sobre el tamaño adecuado para aplicar en el diseño. Aquí es cuando entran en nuestra vida profesional las plantillas. He echo una recopilación de algunas plantillas que seguro que os serán de mucha utilidad. La mayoría de estos archivos estan en Formatos PSD o AI.
Sigue leyendo…

Nuestra amiga @raymicha ya tiene lista la quinta parte titulada “Gotitas de Javascript” de la serie  “Cómo convertir PSD de Photoshop a CSS y XHTML”, en esta parte veran dos plugins de jquery que permitirán hacer cambios en las fuentes y darle funcionabilidad a nuestro slide.

Sigue leyendo…

La cuarta y quinta parte “Cómo convertir PSD de Photoshop a CSS y XHTML” de la serie de vídeo tutoriales de la diseñadora y desarrolladora web, @raymicha, desde cristalab.com.

Capítulo 4: Concepto de Modelo de Bloque (The Box Model Concept), concepto muy importante de entender antes de que podamos empezar a darle formar a nuestro Layout.
Sigue leyendo…

La tercera parte “Cómo convertir PSD de Photoshop a CSS y XHTML” de la serie de vídeo tutoriales de la diseñadora y desarrolladora web, @raymicha, desde cristalab.com.

Capítulo 3: La estructura en XHTML. Revisaremos primero la parte visual de nuestra plantilla en Photoshop y, en base a esta, armaremos el XHTML.
Sigue leyendo…

Desde cristalab.com, @raymicha, nos presenta una interesante serie de vídeo tutoriales llamada “Así las armamos en español” para enseñarte a convertir los archivos de Photoshop (.PSD) a CSS y XHTML. Verdaderamente son geniales y de gran calidad de aprendizaje para un diseñador web. Gracias @raymicha.

Los vídeos después del salto…
Sigue leyendo…

Normalmente cuando queremos optimizar una imagen nos ceñimos a los parámetros que nos ofrecen los editores de imagenes más populares (Ej: Adobe Photoshop) en el cual podemos comprimir la imagen según nuestro criterio, añadir o quitar colores en la paleta, tramar la imagen, etc. También hay algún que otro software que nos permite mejorar la optimización de la imagen automáticamente…
En Smashing Magazine publican un interesante artículo sobre las técnicas de optimización inteligente JPG.
Nos explican una forma diferente para optimizar las imágenes y como almacenan las bases de datos en diferentes formatos y modos de imagen.

En castellano: Técnicas de optimización inteligente JPEG
En ingles: Clever JPEG Optimization Techniques

¿Buscas pinceles para Adobe Photoshop?… Qbrushes es un verdadero paraiso donde encontraras infinidad de pinceles de todo tipo para Adobe Photoshop. Una web a tener en cuenta para los diseñadores e ilustradores gráficos.
Sigue leyendo…

Cuando un diseñador gráfico empieza a hacer sus pinitos hay normas básicas ha tener en cuenta. Una de esas normas básicas es la optimización de las imágenes importadas en sus maquetaciones o diseños gráficos. Estas imágenes siempre nos tenemos que acostumbrar a dejarlas lo más optimizadas posibles a referente al tamaño, resolución y modo de imagen. En este videotutorial os explico como.
Sigue leyendo…

Es una cosa curiosa, pero hace poco que descubrí como hacer un gif animado en phoshop CS3. Desde la versión de CS2 de Photoshop que Image Ready viene integrado en el mismo Photoshop y no es un software aparte como venia en las anteriores versiones. Aquí os dejo este vídeo tutorial bastante básico para que os hagáis una idea.
Sigue leyendo…