55 diseños web en azul para mejorar tu inspiración

El azul es uno de los colores más infravalorados del diseño web y un color sobre el que vamos a aprender un poquito más hoy:

El color azul es una de las seis sensaciones cromáticas básicas de la visión humana normal. Su opuesto es el naranja en las artes plásticas y es complementario al amarillo en la luz, ya que para formar amarillo se necesita mezclar rojo y verde al 100% de intensidad, y nada de azul. La luz azul tiene una longitud de onda de alrededor de 470-450 nm.

Como podéis observar se trata de un absolutamente básico, por lo que tampoco se escapa a las múltiples curiosidades que persiguen a los colores:

• En la tradición antigua este color es el color de la pureza y la virginidad. Por ello, a la Virgen María se la representa tocada con un manto azul.


• El azul es asociado con la inteligencia y el conocimiento en ciertos aspectos. Así mismo, la Filosofía es representada con este color.


• El azul se suele asociar con el frío, en contraposición con el rojo que se asocia con el calor.


• El azul (kallfü) para el pueblo mapuche tiene relación con el mundo espiritual y lo sagrado con sus ancestros


• En los países anglosajones se asocia al azul con la tristeza y la melancolía. De ahí proviene el nombre de la música blues.

Tras el salto os dejo los 55 sitios web en azul que os servirán de inspiración para vuestros trabajos, o eso espero.

Fuente WebDesignLedger

20 fuentes con serifa de calidad

Aprender es algo que no debe pasar jamás de moda, así que hoy es turno para la serifa en las fuentes:

Las gracias, serifas, remates o terminales son pequeños adornos ubicados generalmente en los extremos de las líneas de los caracteres tipográficos. También son conocidas por el término inglés como serif. Las tipografías Times, Georgia, Garamond y Courier son ejemplos de estilos de letra con esta clase de remate.

La industria de la impresión se refiere a las tipografías sin serifas como sans-serif (del Francés sans: “sin”), o como grotesque (o, en alemán, grotesk), en todo caso estos términos no son comúnmente utilizados salvo en la jerga tipográfica.

Supongo que muchos ya lo sabíais, pero nunca está de más aprender que es una serifa y porqué se aplica en las fuentes de carácter más serio. Tras el salto quedan 20 fuentes con serifa listas para mejorar vuestros diseños.

Fuente ourTuts

Otro interesante slider para jQuery: Coin Slider

Al final va a resultar totalmente cierto que estamos rodeados de sliders de jQuery, ya que cada día salen novedades de este tipo de añadidos para la famosa librería de Javascript que tanto se está usando en el desarrollo web de hoy día.

Quizás dónde más destaca Coin Slider es en el aspecto visual y en las transiciones entre las distintas imágenes, ya que aplica unos efectos propios realmente bonitos y que yo al menos no había visto en ningún otro plugin de este tipo.

Es compatible con la mayoría de navegadores, Internet Explorer 6 incluído.

Fuente WebResourcesDepot

10 reglas para perder a un cliente

Si eres diseñador freelance o te estás planteando dejar la empresa para la que trabajas y empezar a trabajar por tu cuenta, este post te interesará mucho.

Lo principal para poder dedicarte a diseñar por tu cuenta, es tener una cartera de clientes a los que poder ofrecer tu trabajo y con los que sacarte un sueldo “decente” para poder subsistir.

El trato con los clientes, todos sabemos que es difícil muchas veces, unas porque ellos no saben explicarnos bien lo que quieren y otras porque no entienden lo que nosotros queremos decirles, pero, si quieres que tu negocio prospere, debes intentar conservarlos y tenerlos contentos para que vuelvan a contratar tus servicios de diseño.

En el post de la fuente, os dejo 10 formas o 10 claves para perder a un cliente…es decir, 10 actitudes y formas de trabajo que puede que nos seas perjudiciales a la hora de conservar a los clientes y tenerlos contentos y también algunos malos hábitos que nos hacen menos productivos.

Leedlas atentamente y curaros en salud! ;-)

Fuente 10 reglas para perder a un cliente

Elementos piratas en vectores

A raíz de una consulta por correo es que me dije: “como puede ser que no haya nada en el blog sobre piratas?”. En verdad es un tema que siempre viene bien tener recursos y que a todos atrapa por igual.

Ya sea para diseños infantiles o de solteros (todos hemos sido piratas alguna vez), esta es una colección de cinco archivos EPS con muchos elementos piratas y de variados estilos.

Descarga Elementos Piratas

Llamativo efecto de texto en Photoshop

Hay efectos de texto que dada su simpleza y resultado final merecen la pena ser difundidos. Este es el caso del efecto “Wooden Type” que creó la gente de Wegraphics.

En este tutorial se puede ver como con algunos estilos de capa y fusiones lograremos crear un llamativo texto de madera con tornillos en sus uniones.

Enlace Create a Funny Wooden Type Treatment in Photoshop

55 diseños web en azul para inspirarte

Decidir el color principal de nuestra web o blog es una tarea complicada ya que tenemos que tener en cuenta nuestros gustos, porque escribir en un blog que no nos gusta se hará un trabajo complicado y tediosos, también tenemos que tener en cuenta la temática o temáticas que vamos a tratar y sobre todo, hay que tener cuidado con la estética, que el color de fondo convine con el resto de colores que vamos a utilizar.

Bien, para que os podáis inspirar, si vuestra decisión es el color azul, os traigo 55 diseños de webs y blogs donde el color azul el el principal. En estos ejemplos podéis ver cómo han distribuido los distintos elementos, qué otros colores han usado y así podréis decidir los últimos detalles de vuestra web azul.

Fuente 55 diseños web en azul para inspirarse

15 packs de iconos sobre formas de pago para webs con carros de compra

Cada día son más personas las que emprenden negocios en internet, ya sea con una gran plataforma o simplemente ofreciendo sus productos a un público más reducido.

Sea como sea seguro que si tienes una página web con un carrito de compra estos 15 packs de iconos gratuitos te resultarán interesantes.

Si pretendes vender tus productos en tu web con carrito de compra, debes señalizar muy bien las formas de pago que admites y donde se debe clicar o entrar para pagar con los diferentes métodos que ofrezcas. Estos iconos te serán de utilidad para hacer esa señalización de forma visual para que tus clientes las encuentren más fácilmente.

Fuente 15 packs de iconos sobre formas de pago para webs con carros de compra

35 packs de vectores

Seguimos dándole caña a los vectores, y es que ya os dije que no nos podemos olvidar de algo tan importante como esto, y ya puestos vamos a aprender un poco sobre la definición técnica de los vectores:

Una imagen vectorial es una imagen digital formada por objetos geométricos independientes (segmentos, polígonos, arcos, etc.), cada uno de ellos definido por distintos atributos matemáticos de forma, de posición, de color, etc. Por ejemplo un círculo de color rojo quedaría definido por la posición de su centro, su radio, el grosor de línea y su color.

Hablando de forma sencilla, ¿qué demonios significa esto? Significa que el trazado no se distorsiona jamás trabajemos en la resolución que trabajemos, y por eso los vectores son básicos en el diseño de hoy día.

Tras el salto quedan los packs, cortesía de Designm.ag

Recopilación de oficinas curiosas

Pocas veces os he hablado de esto, pero el lugar dónde trabajas es básico. Una buena ambientación, la decoración correcta, un orden apropiado en los alrededores y la sensación de armonía son algo clave para poder ser creativos.

Tras el salto os dejo unas cuantas oficinas realmente increíbles, aunque hay que reconocer que no son para nada típicas y que de hecho son más de cara a la galería que unas oficinas al uso, pero existir… existen.

Por cierto, la que encabeza esta entrada está en… Madrid.

Fuente HongKiat

25 logotipos basados en su tipografía

Parece que últimamente están gustando bastante las recopilaciones de logotipos que estamos posteando por aquí, y si algo os mola vamos a seguir poniendo recursos que nos mejoren la inspiración y nos permitan ser más creativos.

Tras el salto quedan 25 logotipos que si se distinguen del resto por algo es porque están basados en su tipografía, ya que marca las directrices del logo y le da un aspecto realmente especial, quitándole la necesidad de basarse en algún objeto o diseño extra.

Por cierto, igualmente son inventados y no son de empresas reales, avisados quedáis. Están tras el salto.

Fuente Designm.ag

Más de 250 pinceles de líneas para Photoshop

Se que muchos pensaréis que 250 pinceles no son necesarios si las líneas se pueden hacer en Photoshop a mano, y la razón no os la quito… pero con un buen set de pinceles tardas diez veces menos que haciéndolas a mano y puede que el resultado sea incluso hasta mejor.

Tras el salto quedan unos cuantos packs que contienen este tipo de pinceles, algunos realmente interesantes para tener bien guardaditos en nuestra nevera personal del diseño, y es que nunca sabes cuando vas a tener que echar mano de un buen set de pinceles para completar un diseño.

Fuente Designm.ag

Plantillas gratis en PSD

Este es un sitio que promete buen material en lo que se refiere a diseños para sitios web. Free PSD Theme es un sitio relativamente nuevo en donde ofrecen gratuitamente la descarga de diseños de sitios web en formato PSD.

La variedad de diseños es amplia y y de buena calidad y, si no nos conformamos solo con el PSD, podemos encontrar a la venta el diseño listo para aplicarlo a Wordpress o simplemente el HTML/CSS.

Enlace Free PSD Theme
Vía Creattica

80 tutoriales de efectos de texto para Photoshop

De momento los que esperamos con ganas la salida de la suite CS5 de Adobe nos tenemos que seguir aguantando porque hasta mediados de Mayo parece que no saldrán las versiones finales a la luz para su prueba y compra, pero no por ello vamos a dejar de lado la versión actual que tengamos de Photoshop.

En mi caso estos tutoriales me vienen de lujo para practicar un poco y alimentar mi Photoshop CS4, y es que la mayoría están bastante trabajados (aunque en inglés) y nos enseñarán a crear bonitos efectos de texto con menos de lo que imaginas.

Tras el salto, como siempre.

Fuente HongKiat

50 fondos de Twitter para inspirarnos y decidirnos a cambiar el nuestro

Twitter es el servicio de microbloging más utilizado en el mundo actualmente. Ahora mismo más de 100 millones de personas son usuarias de Twitter y 300.000 nuevos usuario se registran diariamente.

Por eso, si tú eres usuari@ de Twitter y quieres que tu perfil destaque y llame la atención para conseguir más seguidores o simplemente estas cansad@ de los fondos que lleva por defecto y quieres diseñar el tuyo propio para hacer la página más personal, te gustará ver lo que te traigo.

El blog ST Webdesigner ha hecho una genial recopilación de 50 fondos de Twitter para que te puedas inspirar si te decides a diseñar el tuyo propio.

Yo cambié el mío hace tiempo, podéis verlo en @gemaberrio, pero estoy pensando en cambiarlo y ya he visto unos cuantos ejemplos de esa lista de 50 fondos para Twitter que seguramente me servirán de inspiración para diseñar mi próximo fondo.

¿Te animas a cambiar el tuyo y dejarnos el enlace en este post para que todos lo veamos?

Fuente 50 fondos de Twitter para inspirarte antes de diseña el tuyo

Tutorial de Photoshop: Diseños en madera

Los trabajos de ebanistería son diseños realizados sobre madera en los que se obtienen bonitos dibujos sacando relieves de la pieza de madera, pero desgraciadamente pocas personas son capaces de realizar estos trabajos con resultados sorprendentes.

Está claro que lo nuestro no es el trabajo sobre la madera, pero si queréis simular estos trabajos con Photoshop, aquí os dejo un tutorial muy sencillo de seguir ya que está hecho para aquellos que estén empezando a utilizar este programa.

Con este tutorial conseguiréis un diseño de ebanistería muy real con el dibujo que queráis y sin tocar la madera!.

Fuente Tutorial para hacer diseños en madera con Photoshop

UH-BOY/Matteo De Longis

Ilustrador italiano de 30 años,magnífico manejo de color, del patrón y el degradado, tiene un estilo de trazo grueso que personalmente me fascina, miren y disfruten.

También conocido con el nick de "UH-BOY" Matteo De Longi es digno de ser conocido, si te gusta su onda rocker-tattoo-femenina debes ver más de sus obras.

Paisaje estilo Avatar en Photoshop

Sin duda la película Avatar ha marcado a mas de uno con sus personajes y paisajes, y si bien ya hemos visto tiempo atrás como crear una isla flotante con Photoshop, este tutorial merece una mención ya que tiene un resultado excelente en cuanto a color e iluminación.

Este es un claro ejemplo en donde queda demostrado que con un poco de técnica, solo resta contar con paciencia para encontrar las imágenes justas para la composición que deseamos realizar. El tiempo que le dediquemos a la búsqueda de fotografías (en el caso de no ser fotógrafo) harán la diferencia en el resultado final.

Enlace Create a Floating Island Scene Similar to James Cameron´s Avatar
Vía Photoshop Lady

Todo naturaleza: Pinceles y texturas

Por aquí se que los recursos de naturaleza son bastante apreciados, asique este pack que contiene recursos de este tipo (pinceles y texturas) nos va a venir genial para aumentar nuestra colección personal.

Tras el salto quedan pinceles (la mayoría con el clásico tamaño de alta resolución: 2500 píxeles) y unas cuantas texturas también con resolución alta, para que ningún trabajo se quede fuera por limitaciones de resolución.

Fuente: Designzzz

30 logos de empresas hechos desde la creatividad

Creatividad:

La creatividad, denominada también inventiva, pensamiento original, imaginación constructiva, pensamiento divergente… pensamiento creativo, es la generación de nuevas ideas o conceptos, o de nuevas asociaciones entre ideas y conceptos conocidos, que habitualmente producen soluciones originales.

Si has leído la definición que encabeza esta entrada y la has comprendido, ahora tendrás claro porqué los logos que os he dejado en esta entrada se ajustan perfectamente a la palabra ‘Creatividad’. Cierto es que siguen siendo sobre empresas inventadas para hacer más sencillo todo, pero no olvidemos que estos logos están creados para la inspiración de todos vosotros, para que si llega el momento de crear uno tengamos claro que hay que innovar y tirar hacia el mundo de la imaginación, eso de ser lineales ya no sirve…

Fuente Designm.ag

Efecto HDR en Photoshop CS5

Puede que el efecto HDR ya este algo trillado… lo reconozco. Pero la atracción que generó con su aparición evidentemente hicieron eco en Adobe, quien incluyó en el menú de ajustes de Photoshop CS5 un “HDR Toning” con el cual abriremos una ventana de parámetros para intentar simular el efecto (mantengo el simular ya que el efecto real se da realiza originalmente con mas de una toma).

En Photoshop Daily podemos ver un breve tutorial sobre esta nueva función de Photoshop y comenzar a saborear las nuevas herramientas de esta versión.

Enlace Create an HDR effect in Photoshop CS5

Adobe Creative Suite CS5 – Descargar versión de prueba

Ayer fue presentada la nueva versión de la suite de Adobe para diseño, la Adobe Creative Suite CS5 y desde entonces podemos descargar la versión de prueba en su página oficial para poder ver y probar las nuevas funcionalidades de sus programas y hasta donde llegan las mejoras de esta nueva versión.

Además también hay versiones de prueba de otros programas de Adobe como Acrobat Reader 9, Photoshop LIghtroom 2 y Photoshop Elements 8.



Para poder descargar la version de prueba puedes acceder a la pagina oficial de Adobe dando click aqui.