Con motivo de su lanzamiento oficial de  (el pasado 24 de Marzo) , BaseKit ha organizado una competición en colaboración con istockphoto entre diseñadores y los ganadores se llevarán:

iPads y créditos istock!.

La mecánica es muy sencilla: Diseñar un sitio web utilizando imágenes iStockphoto.com y construirlo en BaseKit.

Tienes tiempo de mandar tu diseño hasta el 2 de mayo de 2010.

1er Lugar:

Apple IPAD Wi-Fi de 32 GB o 4 de tableta Wacom Intuos (grande)

500 créditos iStockphoto

5 cuentas Plus para BaseKit, gratuito para 2010

2do Lugar:

Apple IPAD Wi-Fi de 16 GB o 4 de tableta Wacom Intuos (medio)

400 créditos de iStockphoto

3 cuentas Plus para  BaseKit, gratuito para 2010

3er Lugar:

Apple IPAD Wi-Fi de 16 GB o 4 de tableta Wacom Intuos (medio)

300 créditos iStockphoto

2 cuentas para para BaseKit, gratuito para 2010

4 º Lugar al 10 Lugar:

cada uno gana un iPod Shuffle y créditos iStockphoto 50 y 1 Además de suscripción de la cuenta de BaseKit, gratuito para el año 2010.

Si estas interesado en suscribirte puedes hacerlo en este link:

http://www.basekit.com/istockphoto-website-design-challenge

Aquí les dejo una lista de 10 sets de vectores gratuitos y de iconos como conejos de Pascua, huevos, cestas y texturas para usar en sus proyectos comerciales o no comerciales para la próxima celebración.

Espero que les guste.

Grafica en vectores Felices Pascuas

http://dryicons.com/free-graphics/preview/happy-easter/

Grafica en vectores Felices Pascuas 2

http://dryicons.com/free-graphics/

Iconos Gratuitos de Pascua

http://garcya.us/happy-easter-free-icons/

Patrones gratuitos para Pascua

http://www.patternhead.com/freebies/free-vector-and-pixel-repeat-patterns-easter-theme-set-1

31 texturas para Pascua en Alta Resolucion

http://thinkdesignblog.com/free-textures-31-high-quality-plastic-easter-egg-textures.htm

Conejo de Pascua; Ilustracion en Vectores

http://www.verysimpledesigns.com/vector-illustrations/vector-illustration-easter-bunny.html

Icono Gratuito Conejo de Pascua

http://icondock.com/free/easter-bunny-icons

Huevos de Pascua

Huevos de Pascua 2

http://www.vectorilla.com/2010/03/vector-easter-eggs/

Conejo de Pascua

http://all-free-download.com/graphic/vector-file/vector-cartool/cute_bunny_brings_easter_egg_21867.html

Twitte con actitud

En esta nueva seccion, enlistaremos los twittes mas interesantes y con mejores recursos recibidos en la semana.

En esta lista encontraras desde iconos hasta tutoriales muy extensos. Vienen con su link a pagina web y el autor del twitte.

La mayoria de estos links son de paginas en Ingles, pero con recursos muy valiosos.

Texturas del martes #11 http://bit.ly/9izdJE

via : @evocowire

Como optimizar adsense para que tu blog sea mas rapidor http://bit.ly/cXPQHg

via @catswhocode

Generadores de graficos http://bit.ly/cia6OB

via @freelancefolder

+180 Massive Minimalistic Icon set http://bit.ly/aanNcp

via @inspiredmag

66 Manipulaciones increibles de fotos http://bit.ly/dc6Lyy #art #graphic #design #photoshop

via @artistech

44 ejemplos de fotografia de reflejo: http://j.mp/alyDS2

via @petapixel

Claves para obtener tu primer cliente de paginas web http://bit.ly/98EqIc

via @evocowire

Creative Photography publica esta semana un catalogo fotografico de Rankin.  Fotógrafo, editor y director de cine, Rankin estableció su reputación cuando lanzó Dazed & Confused con su socio de negocios Jefferson Hack, en 1991.

Él volvió a ser noticia con su campaña de Dove muestra mujeres que difería de la palanca habitual estereotipo de la publicidad delgada. Él también ha disparado las campañas de caridad prominentes de Amnistía Internacional, Everyman, Olimpiadas Especiales, Oxfam, Teenage Cancer Trust, refugio, el Premio de Enseñanza, Women’s Aid, voto femenino, el de Cáncer de Mama y de la Juventud Música.

A principios de 2009, se embarcó en su proyecto más grande y ambicioso hasta la fecha; Rankin Live! Con base en la cervecería de Truman, en Londres, Rankin combinado un museo con una retrospectiva de escala que abarca desde su carrera de 22 años.

En octubre de 2009 publicó los libros ‘Heidilicious’ y ‘Rankin Cheeky’. ‘Heidilicious’ es una celebración de la modelo, Heidi Klum, y la relación de fotografía Rankin en los últimos 7 años.

Rankin vive en Londres con su esposa Tuuli, y trece años, hijo, Lyle.

El catalogo lo pueden ver en su totalidad en:

http://crephoto.com/photography-by-rankin/

Media Militia tiene un paquete con 50 pinceles diferentes para crear efectos de luces en photoshop y lo mejor de todo GRATUITOS. Esta disponible en dos formatos diferentes, Photoshop Brushes e imágenes JPEG.

Lo genial acerca de los pinceles es que tienen un fondo transparente. Puedes elegir el formato de descarga o de ambos.

A continuacion pongo una traduccion del tutorial para uso de los pinceles:

Mini Tutorial – Cómo añadir color a las imágenes

1. Abra una de las imágenes en Photoshop.
2. Crear una nueva capa y la rellenamos con un gradiente de colores.
3. Cambiar el modo de fusión de capas de superposición.

Mini Tutorial – obtener la máxima Glow con Pinceles PS

1. Elija un cepillo de nuestra Efectos de luz Brush Pack
2. Crear una nueva capa y seleccione un color muy vibrante.
3. Haga clic una vez para fijar los píxeles de la brocha efecto de iluminación.
3. Duplicar la capa y añadir una superposición de color de blanco.
A continuación, puede añadir un Tono / Saturación capa de ajuste para jugar con los colores.

Aqui les dejo el link para acceder al sitio de descarga de los pinceles y una muestra.

DESCARGAR

En este tutorial veremos como convertir un templete hecho en photoshop a una pagina web xhtml con CSS directamente desde photoshop.

Este metodo es recomendable para diseñadores que no conocen mucho de codigo. Es una manera muy sencilla de empezar y poder jugar con el codigo para aprender a modificarlo.

Empezamos con un templete basico para pagina web.  Te recomiendo veas el articulo: partes de un blog, para tener una idea de cómo debe de ser tu diseño y que partes debe de contener.

Lo primero que haremos sera determinar las diferentes partes de nuestra pagina como el banner, botones, sidebar, etc. Todas estas partes las señalamos con guias.

Seleccionamos la herramienta slice tool (herramienta de corte)

Con esta herramienta seleccionamos las partes marcadas con las guias.

Una vez que hemos realizado todos los cortes seleccionamos la herramienta slice select tool (herramienta seleccionar corte)

Con el boton derecho o con ctrl. Clic seleccionamos cada uno de los cortes.

En el menu de las opciones del corte procedemos a ponerle un nombre en particular, como por ejemplo banner.

Asi hacemos con cada uno de los cortes.

Una vez que tengas todos los nombres vas al menu file/save for web and devices (archivo/salvar para web)

Haces clic en salvar

En el menu que aparece a continuación seleccionas en formato HTML e imágenes, y en  settigs/other

A continuación te aparecera un menu donde especificaras la opciones para guardar como pagina web.

En la primer ventana seleccionas la opcion xhtml y das siguiente

Ahora selecciona generar CSS y By ID

En la siguiente ventana podras escoger el color de fondo o incluso una imagen

Por ultimo le damos ok y salvar.

El resultado sera un archivo HTML con una carpeta con imágenes.

Si abrimos el archivo HTML en la seccion superior se encuentra el codigo CSS

En la parte inferior HTML

Con unos pequeños cambios en el codigo podemos agregar texto a las secciones que determinamos para esto. Primero agrego el texto en la division correspondiente

Luego modifico la regla CSS para determinar el tipo de letra, color, color de fondo, etc.

Listo, tenemos una pagina muy basica hecha con photoshop. Esto te ayudara mucho para hacer templetes rapidos con los que luego puedas modificar a mas profundidad el codigo.

Espero les sea de utilidad.

Ninja!!!!!

Que hay mas asombroso que un ninja!!!!

Abduzeedo publica el dia de hoy una lista con ilustraciones de Ninjas.

Es una lista interesante de ilustraciones con buena tecnica. Aqui les dejo una muestra y si quieren ver el post completo lo pueden ver en :

http://abduzeedo.com/awesomeness-ninjas

Quien acuñó originalmente  el término “diseño gráfico” parece estar en disputa. Se ha atribuido a Richard Guyatt, el diseñador británico y académico, pero otra fuente sugiere William Addison Dwiggins, un diseñador de libros de América en el siglo 20

1900 el encuadernador TJ Cobden-Sanderson se asocia con Emery Walker para el establecimiento de la imprenta palomas en Hammersmith. Se preocupaba de atacar el problema de la tipografía pura argumentando que el deber global de la tipografía es comunicar a la imaginación, por cierto, y sin pérdida, el pensamiento o la imagen que el autor trata de transmitir

1910 – AEG (General Electric alemán), Peter Behrens, denuncia el Art Nouveau de un neoclasicismo de repuesto, productos, aparatos de alumbrado, ventiladores, la publicidad, los gráficos y de imagen en general “corporativa de la empresa».

1919 – Bauhaus – la escuela de diseño, arte y arquitectura fundada en 1919 por Walter Gropius en Weimar (Alemania) y clausurada por las autoridades prusianas (en manos del partido nazi) en 1933.

1920 constructivismo soviético aplica “la producción intelectual en las diferentes esferas de la producción. El movimiento de arte individualista, vio como inútiles en la Rusia revolucionaria y por lo tanto se dirigió hacia la creación de objetos con fines utilitarios. Ellos diseñaron los edificios, conjuntos de teatro, carteles, telas, ropa, muebles, logotipos, menús, etc

1928 Jan Tschichold incorpora los principios de la tipografía moderna en su libro, Nueva tipografía

1929 – la sociedad consumista americana emerge: artista comercial, la publicidad, ilustradores

1932 
 Stanley Morison supervisa el diseño de la fuente Times New Roman, encargado por el Times de Londres.

1937 La emigración de la escuela de la Bauhaus alemana de diseño a Chicago trae un ” minimalismo  producido en masa” a Estados Unidos

1940 Primer número de la revista Print Magazine

1948 Hermann Zapf diseñó dos tipografías hoy omnipresentes Palatino (1948) y Optima (1952).

1950 – MOMA, promover el buen diseño, los refugiados Gropius, Mies, Breuer, Nueva Bauhaus, Chicago, ID-IIT, la Universidad de Yale: Alvin Eisenman, Paul Rand, Herbert Matter, Norman Ives,

1951 el arquitecto y escultor suizo Max Bill, siguiendo las líneas originales de la Bauhaus, fundada en Ulm (Alemania) Hochschule für Gestaltung (Escuela Superior de Diseño), que rápidamente se recupera el nombre de la Bauhaus y para diferenciarla de la inicial, Neues Bauhaus (Nueva Bauhaus)

1956 
 Paul Rand crea los diseños de logotipo de IBM

1957 
 Max Miedinger diseña: Neue Haas Grotesk fuente, más tarde llamada Helvética.

1959 Primer número de Communication Arts printed.

1973 Milton Glaser diseñó la inconfundible campaña I Love NY

1968 – Post-modernismo: Wolfgang Weingart, Steff Geissbuhler, Odermatt y Tissi

1968. Diseño para olimpiadas de Mexico

1969 
 Douglas Engelbart desarrolla el mouse de la computadora sentando las bases para el futuro de la herramienta de diseño gráfico.

1970 En los primeros años 70, los miembros de la Bund Deutscher Grafik-Designer (Asociación alemana de diseñadores gráficos), dio a conocer varias características de su identidad profesional, como en el caso de Anton Stankowski y otros

1970 – los gráficos de las empresas: Olivetti, CBS, CIBA, IBM, Chase, Mobil

1984 
 Apple lanza primera computadora Macintosh, con gráficos de mapa de bits.

1984 La revista de arte ÉMIGRÉ dirigida por neolandés Rudy Vander Lans utiliza fuentes diseñadas por su esposa, nacida en Checoslovaquia Zuzana, EMIGRE fue una de las primeras publicaciones en utilizar los ordenadores Macintosh y tuvo una gran influencia en los diseñadores gráficos en movimiento en la autoedición (DTP ). Su variedad de diseños, la utilización de los diseñadores invitados, y los artículos tuvo un efecto sobre las publicaciones de diseño.

1985 
 Aldus, formado por Paul Brainerd, desarrolla software PageMaker. En el mismo año, Nueva York, Manhattan, empresa de diseño crea el logotipo de MTV.

1990 
 Surge la primer versión de Photoshop

1990 El físico Tim Berners-Lee desarrolla la World Wide Web, junto con HTML y el concepto de direcciones de sitios web.

Cuando estudie la carrera de diseño grafico en el año de 1990 el uso de computadoras era casi nulo y dependiamos de nuestra habilidad para bocetar y convertir esos dibujos en propuestas o dummies para el cliente usando medios materiales mas tradicionales como el paste up, dibujo etc. Realmente el proceso llegaba a ser artesanal. La mayoría de las veces estos diseños eran usados para medios impresos; revistas; brochure; etc.

En este año 1990 fue lanzada la primer versión de photoshop, y Tim Berners-Lee desarollo el world wide web, junto con el  HTML y el concepto de las direcciones de paginas web.

Por lo tanto muchas de las materias que cursamos estaban enfocadas al dibujo a mano alzada: figura humana, como bocetar, etc. y alguna material perdida de pagemaker.

Estabamos acostumbrados a un ritmo diferente en el proceso creativo donde la parte del bocetado tenia una gran importancia pues es donde se desarrollaba todo el concepto e idea de los graficos. Una vez aprobada la idea o concepto trabajabamos en darle forma.

La revolucion con las computadoras y el desktop publishing a sido maravillosa, como diseñadores hoy podemos hacer cosas que hace 20 años no hubieramos siquiera pensado. Las computadoras y el software de diseño son herramientas que nos han permitido crecer como profesionistas.

Sin embargo hoy mas que antes el boceto debe de tener una gran importancia, pues nos permite jugar y analizar una idea, desarrollar un concepto y sus aplicaciones antes de traducirlo a la computadora. Interactuar con nuestros clientes y plantear la estructura y forma del diseño.

Tristemente la mayoria de los diseñadores (y me incluyo) no siempre bocetamos y pasamos directamente al trabajo sobre el monitor. Empezamos a hacer variaciones sin limite y tambien permitimos que el cliente haga variaciones sin limite sin aterrizar una idea concreta y desarrollar la mejor solucion grafica.

Los mejores diseños que he realizado siempre empiezan con un claro boceto, y un determinado tiempo empleado en desarrollar la mejor solución grafica, variaciones en papel que me permiten interactuar con mi cliente hasta lograr comunicar el mensaje de su producto o servicio.

Por lo tanto nuestro proceso de diseño siempre debería de ser el siguiente:

1. Entrevista con el cliente, recopilación de información: este punto es vital para entender el producto o servicio de nuestro cliente.
2. Elaboración de brief
3. Bocetaje: en este proceso haremos toda la lluvia de ideas que queramos en papel, es donde soñamos
4. Retroalimentación con el cliente: Escogeremos las mejores ideas o bocetos y los revisaremos con el cliente
5. Revisión del boceto: Con las observaciones de nuestro cliente refinaremos nuestro boceto.
6. Traducción a medios digitales: En este paso convertiremos nuestro boceto a un diseño usando las herramientas requeridas según el caso.

Este proceso tiene la ventaja de que podremos entender a la perfección el mensaje que desea comunicar nuestro cliente, nos permite jugar en papel, retroalimentarnos y  aterrizar una idea clara.

Este post es el primero de una serie de como bocetar, analizaremos casos específicos:

Como bocetar para un logo y como bocetar para una pagina web.

Pasa hasta en las mejores familias.

Por esto es que siempre es muy importante registrar cualquier trabajo que hagamos, por latoso que sea el proceso.

Con el incremento de comunicacion por las redes sociales el plagiar un diseño ya esta rompiendo las fronteras.

Logo Guru nos presenta una lista de 20 logotipos comparando el original contra la copia, muchas veces es dificil saber cual es el original.

Aqui les dejo el link:

http://www.logoguru.co.uk/identical-logo-designs/