Mostrando entradas con la etiqueta diseño gráfico. Mostrar todas las entradas
Mostrando entradas con la etiqueta diseño gráfico. Mostrar todas las entradas

domingo, 1 de febrero de 2015

Escalar una imagen con Gimp y prepararla para la web

En este tutorial vamos a escalar una imagen para la web usando el programa de retoque de imagen Gimp. Gimp es un programa de software libre que podéis descargar desde


La alumna Miriam, estudiante del curso de Diseño Web de la Casa de la Cultura de Torrejón del año pasado, me pidió que le diseñase la página web de su empresa. Este es el diseño que le hice:


Su intención era que los conocimientos adquiridos durante el curso le permitiesen mantener la página de forma autónoma.

Me pide que le haga un pequeño tutorial para preparar las imágenes que toman durante la realización de sus proyectos para poder subirlas más adelante a la página web.


viernes, 28 de noviembre de 2014

10 mandamientos de la tipografía

Durante las primeras clases de creación de blogs, y al comenzar a trabajar los contenidos, me he dado cuenta de las carencias de conocimientos de diseño gráficos de los alumnos. Estos no son cursos de diseño gráfico, pero al diseñar un blog si tenemos claros algunos conceptos podremos mejorar la apariencia de nuestros blogs.

No se trata de ganar un premio de diseño, pero no nos vendrán mal alguna ayuda. Voy a rescatar algunas entradas del curso de diseño gráfico sobre software libre del año pasado en la casa de la Cultura de Torrejón de Ardoz y las agruparé bajo la etiqueta de Diseño gráfico y les echáis un vistazo de vez en cuando.

No os vendrá mal ;)


tipografia

  1. Conocer las familias de fuentes
  2. Combinar una fuente sans-serif con una fuente con serif
  3. Combinar una fuente serif con una fuente sans-serif
  4. No es buena idea combinar dos fuentes parecidas
  5. El contraste es la clave
  6. Trabajar con 2 fuentes. Sólo trabajar con 3 si no hay más remedio (pero mejor, no)
  7. No mezcles estilos o tendencias diferentes
  8. Podemos mezclar estilos o tendencias complementarias y modas temporales similares
  9. Usar diferentes pesos entre fuentes de la misma familia
  10. Evitar fuentes como...

viernes, 22 de agosto de 2014

CURSO DE DISEÑO GRÁFICO Y WEB EN TORREJÓN DE ARDOZ

Hemos programado un curso de iniciación al diseño gráfico y diseño web en la Casa de la Cultura de Torrejón de Ardoz

Tanto en la Casa de la Cultura de Torrejón de Ardoz como en el Centro Cultural de Sanchinarro, doy cursos de iniciación al diseño web y diseño gráfico.

Sin embargo, este curso 2014-2015 en la Casa de la Cultura de Torrejón de Ardoz tenemos uno que trata conjuntamente el diseño gráfico y el diseño web.

Es la primera vez que unimos en un curso los temarios web y gráfico (evidentemente ambos están reducidos respecto al curso de diseño web y al curso de diseño gráfico).

La razón es que hoy en día el diseño gráfico para dispositivos y web es el pan de cada día.

Por ello, en este curso trabajaremos conjuntamente, grafismo y web.

Os pongo un ejemplo práctico.

No hace mucho diseñé la página web y la imagen corporativa del estudio de arquitectura



Cuando trabajo, casi siempre me comunico con los clientes creando una pequeña web donde van viendo los avances del diseño de su imagen corporativa, de forma que no tengo que estar continuamente quedando con ellos en sus oficinas.

En en caso de este projecto, esta fue la web que subí para ir mostrando la IC





Este será el enfoque del curso: iremos aprendiendo diseño gráfico al mismo tiempo que aprendemos a aplicar nuestro trabajo en la web.

Y este caso que os he mostrado será uno de los ejercicios tipo de este curso.

Un saludo.



miércoles, 13 de agosto de 2014

curso de diseño web y diseño gráfico

Curso de diseño web y diseño gráfico en la Casa de la Cultura de Torrejón de Ardoz y el Centro Cultural Sanchinarro

Mi consejo es que un alumno que se matricula en uno de mis cursos de diseño web, diseño de blogs, redes sociales e internet, community manager o ecommerce, debería matricularse también en el curso de diseño gráfico, pues ambos se complementan.

Vamos a verlo con la...



historia de un proyecto:


Miriam, una alumna del curso de diseño web de la Casa de la Cultura de Torrejón de Ardoz, es junto con su marido una pareja de emprendedores, jóvenes empresarios que tienen una empresa de automatismos en Torrejón de Ardoz. Miriam se matriculó para tener su web y mantenerla.



martes, 12 de agosto de 2014

LOS EJERCICIOS DEL CURSO

¿Cómo son los ejercicios de los cursos?


En la medida de lo posible, vamos a intentar que las clases sean 100% prácticas. Intentaré que los conceptos teóricos los revisen los alumnos en sus casas con los materiales que les facilitaré.

Pero en las clases trabajaremos su aplicación práctica.

Me esfuerzo siempre en que los ejercicios y prácticas tengan una fuerte contemporaneidad. Quiero que los alumnos veáis que lo que estudias y practicáis se encuentra en la calle, a unos metros de la puerta del centro.

Vamos a ver un ejemplo:

diseño gráfico

Diseño por necesidad es un proyecto del estudio Grantipo que me gustó mucho cuando tuve noticia de su existencia. Por ello, en los cursos de diseño gráfico y diseño web de Casa de la Cultura de Torrejón de Ardoz y Centro Cultural Sanchinarro usaremos este proyecto para un ejercicio de diseño urbano.

Y así, además, difundimos el proyecto.

Más información:


sábado, 9 de agosto de 2014

RECURSOS PARA LAS CLASES DE DISEÑO

Recursos para los cursos de diseño gráfico y diseño web



En la medida de lo posible facilitaré los elementos necesarios para los ejercicios de los alumnos, links, imágenes, referencias, tipografías, programas... 

Y siempre serán recursos gratuitos de distribución libre. En la Casa de la Cultura de Torrejón de Ardoz usaremos software libre sobre Linux, mientras que en Centro Cultural de Sanchinarro trabajaremos sobre Mac con Licencias Adobe. 

 Por ejemplo, las tipografías que usaremos en los ejercicios de diseño gráfico, diseño web, diseño de blogs, eCommerce, etc... serán de distribución libre. un ejemplo podría ser la tipografía Lousiane diseñada pos Juanjo Rivas para Neo2.



Normalmente facilito a los alumnos el enlace para la descarga del recurso:

martes, 5 de agosto de 2014

CURSO DISEÑO GRÁFICO - CARTELES

En el curso de diseño gráfico 2014-2015, tanto en la Casa de la Cultura de Torrejón de Ardoz como en el Centro Cultural de Sanchinarro, intentaremos que además de conceptos teóricos, los ejercicios cubran la totalidad de los problemas que un diseñador puede encontrarse en la vida real.

Hoy en día la mayor parte del trabajo de las ofertas de diseño gráfico, en el mercado laboral, están relacionadas con la web, videojuegos, dispositivos, libros electrónicos, tics, o autoedición dentro de la empresa, etc...

En mi caso, es posible que en los últimos 6 ó 7 meses, lo único que haya hecho para imprimir en imprenta hayan sido las tarjetas de visita de las imágenes corporativas que me han encargdo. Todo lo demás han sido encargos para la web, dispositivos, TIC, autodición, pdfs online...

Vamos a ver un ejercicio en el que mezclo diversas técnicas que pueden servirnos tanto para el diseño gráfico impreso como para la autoedición o los dispositivos electrónicos o la web.

En las clases partimos de las fuentes (fotos, tipografías, etc) que facilito a los alumnos. En este caso, como es un avance del curso, sólo muestro el tutorial.

Este tutorial está en GIMP, ya que en la Casa de la Cultura de Torrejón de Ardoz trabajamos con software libre. En el Centro Cultural de Sanchinarro trabajamos con programas de la suite Adobe.

Este es uno de los ejercicios que propongo aproximadamente a finales del primer trimestre de clases... Recordar que todas las técnicas son similares en los programas Adobe.

Como vemos en la entrada del blog sobre los tamaños DIN


y sobre las resoluciones


vamos a trabajar un tarjetón vertical A6 148x105 mm 

Partiendo de:


Queremos:

sábado, 26 de julio de 2014

TRABAJAR CON GRIDS EN DISEÑO GRÁFICO

La retícula (Grid en inglés), es una herramienta muy útil que nos puede asegurar mayor equilibrio en nuestra composición al momento de diseñar.
Es una estructura en dos dimensiones hecha de líneas verticales y horizontales utilizada para estructurar el contenido, sirve como una armazón para organizar textos, imágenes o vídeos de una forma racional y fácil de visualizar.

Estos días estoy diseñando un catálogo que he de incrustar en una pagina web que he diseñado recientemente, y que también se imprimirá en papel
Es un trabajo que tiene diseño web (el diseño parte de la página web y habremos de incrustarlo en ella... Por lo que estas técnicas las explicaremos y practicaremos a lo largo del curso 2014-2015 en los cursos de diseño gráfico y diseño web del Centro Cutural de Sanchinarro y la Casa de la Cultura de Torrejón de Ardoz.

En las capturas de pantalla os muestro 2 páginas maquetadas y los grids en los que se apoyan





Una vez finalizado el diseño, alojaremos el catálogo virtual en los repositorios Issuu, Slideshare y Scribd

Y desde allí los incrustaremos en la web. También usaremos sus herramientas de etiquetado para ayudar en el SEO de la web y apoyarnos en las redes sociales para generar trafico en la página.

Por ello, también este proceso lo estudiaremos y pracricaremos en el curso de Community Manager.

La única diferencia es que en el Centro Cultural Sanchinarro lo haremos con Indesign y en la Casa de la Cultura de Torrejón de Ardoz usaremos Scribus. La técnica es la misma en ambos casos y podemos estudiarlo en Scribus en Casa de la Cultura y aplicarlo en casa en Indesign si lo tenemos instalado en casa.

Cursos en los que estudiaremos estas técnicas: Diseño gráfico, Diseño Web y Community Manager.

Saludos :)




sábado, 19 de julio de 2014

¿CÓMO SON MIS TUTORIALES?

A través del mail de contacto formacion@rpa-project.com me llegan algunas consultas acerca del tipo de tutoriales, documentación de los cursos, etc..

No nos dan documentación a los formadores, por lo que tenemos que "literalmente" buscarnos la vida :)

En mi caso, como estoy cogiendo encargos de diseño web, gráfico, 3d, redes, CM... al mismo tiempo que doy las clases, me gusta incorporar los encargos como casos prácticos.

Otras veces enlazo a tutoriales de internet, pero a medida que avanza el curso me voy adaptando al recorrido de los alumnos y me divierte hacer yo los tutoriales.

Voy a mostrar un ejemplo de tutorial, realizado para los alumnos de diseño web y diseño gráfico de la Casa de la Cultura de Torrejón de Ardoz.

Como en este centro trabajamos sobre Linux y todo es software libre, el tutorial corre sobre GIMP (en el Centro Cultural de Sanchinarro, esto mismo lo explicaré sobre Photoshop).

Para el tutorial uso de guía un trabajo profesional que fue la realización y programación de la web de



Normalmente diseño yo los trabajos, pero en este caso el diseño de la imagen corporativa, web y dirección de arte fue de Javier Garrido director de arte en El Laboratorio, yo sólo realicé la maquetación y la programación ;)

Este trabajo me sirve para introducir a los alumnos de diseño web y de diséño gráfico en el uso de grids

Normalmente dejo así los tutoriales a los alumnos en sus áreas privadas del blog, pero es posible que este curso 2014-2015 haga algunos en vídeo porque me lo han pedido algunos alumnos... Ya veremos :)

EL TUTORIAL TIPO QUE CREO PARA ALUMNOS ES:

(recordad que está basado en un encargo profesional real, ya que procuro que lo que os enseño tenga aplicación práctica... y que es GIMP ya que estos alumnos en Torrejón pilotan software libre, los de Sanchinarro pilotan Adobe...  )

Nota: el diseño original de Javier Garrido es el que aparece en la web de MakeMyDayInMadrid enlazada. Los cambios que aparecen en el tutorial son porque hay cosas que quiero que veáis -alguna herramienta, alguna técnica- y me facilita la tarea  el hacer algún cambio, pero sólo a efectos docentes).

Vamos a trabajar el diseño gráfico para la web hasta este punto:


viernes, 18 de julio de 2014

CURSOS - WEB vs GRÁFICO

Todos los años, en la Casa de la Cultura de Torrejon y en el Centro Cultural de Sanchinarro recomiendo a los alumnos de los cursos de Diseño Web, de Diseño Gráfico y de Redes o CM que se matriculen en los 3 cursos.

Hoy todo está tan unido que que es necesario. En estas entradas que voy a subir antes del comienzo de los cursos y talleres, en octubre, voy a subir y comentar algunos ejemplos de casos recientes que me he encontrado en los encargos que me han surgido durante el curso pasado.

Arquicad es un estudio de arquitectura establecido en Don Benito, Badajoz, que me encargó su imagen corporativa, diseño de página web y promoción en la red.


Evidentemente si yo estoy dando clases en Madrid y el cliente se encuentra a más de 300 km de distancia del estudio tengo que poder comunicarme con ellos y poder enseñarles el los avances.

En mi caso lo que hago es montar una página web que alojo en una carpeta de mi servidor, de forma que tengo una carpeta por proyecto, a ellas remito a mis clientes.

Este es un ejemplo: la carpeta de Arquicad:



Y esta la página web diseñada para Arquicad


Por otro lado, podéis ver que existe unos enlaces a redes sociales Facebook y Twitter. Ya que he de darles unas charlas en septiembre para usar las redes en la promoción y potenciación de la marca de su estudio.

Por ello recomiendo a los alimnos matricularse de los 3 cursos: diseño web, gráfico y redes o CM, ya que en la vida profesional todo irá unido.




jueves, 17 de julio de 2014

NUEVA WEB - REDISEÑO

Muchas veces lo que explicaremos en los cursos desborda el contenido o programa del mismo. Por ejemplo, hace un año o más diseñé la web de Ireval, y estos días he reestructurado el site map porque se han acabado obras nuevas que he tenido que incluirlas.



El proceso lo explicaremos en los cursos de #diseñoweb, tanto en el Centro Cultural de #Sanchinarro, como en la Casa d la Cultura de #Torrejóndeardoz.

Sin embargo, gran parte de los trabajos realizados pertenecen al campo del curso de #diseñográfico y al de #redes 2.0 o #Communitymanager ya que el tratamiento de fotos y logotipos, vectores, patrones, etc... pertenecen al diseño gráfico.

Esta es la web en el momento actual


Por otro lado, se me ha encargado el catálogo de la firma, impreso y online para su uso como herramienta de marketing del estudio, por lo que gran parte de las acciones que emprenderemos las estudiarán y practicarán los alumnos de los cursos de #redes 2.0 y #communitymanager

El catálogo tiene que estar listo en septiembre, aunque pronto iremos viendo avances en el blog.

martes, 15 de julio de 2014

MOCK UP - DISEÑO WEB - DISEÑO GRÁFICO

Hay muchos tipos de mockups. Podemos usarlos en el diseño gráfico, pero también de apoyo en el diseño web. En este caso quiero mostrar al cliente cómo se vería el diseño de su web en un iPad.

Es preferible mostrar bocetos gráficos al cliente para su aprobación antes de programar la web.

Recurro de nuevo a uno de los últimos trabajos que he hecho, concretamente la imagen corporativa y la página web para Automatismos Kv

Podemos ver la página en:



Partimos de este mockup


Y lo que mostraremos al cliente es


En este caso van de la mano el diseño web y el diseño gráfico. Es buena idea seguir los cursos de diseño web y diseño gráfico que daremos a partir de octubre en La Casa de la Cultura de Torrejón de Ardoz y el Centro Cultural de Sanchinarro.

Podéis matricularos en cualquiera de ellos, pero los dos se complementan.

Saludos


lunes, 14 de julio de 2014

MOCK UPS

Los mock up son maquetas virtuales que los diseñadores usamos para presentar los trabajos, sobre todo en casos de diseño gráfico, imagen corporativa, branding, packaging, diseño web, etc... Como esta pantalla en la que el verano pasado mostraba bocetos de una página web que estaba diseñando para http://www.garriguesasociados.com/





En los cursos de diseño gráfico que daré a partir de octubre en la Casa de la Cultura de Torrejón de Ardoz y en el Centro Cultural de Sanchinarro, aprenderemos a hacerlos y a trabajar con ellos, y en los cursos de diseño web aprenderemos a crear pequeñas webs donde montamos los mock ups para que un cliente pueda verlos on-line

Yo los uso a menudo, y muchas veces lo que hago es colgarlos directamente en una página web que me hago para ese trabajo en concreto, ya que no siempre es posible quedar con el cliente, y lo que hago es montar varios mock ups y subirlos a la web.

Os muestro un ejemplo reciente de la imagen corporativa y página web desarrollada para Arquicad, para quien diseñé la imagen corporativa y la web http://www.arquicad.es/

Como el cliente se encontraba a más de 300 km de Madrid les iba mostrando los avances del trabajo mediante esta web diseñada en mi servidor a la que iba subiendo los mock ups

http://www.rpa-project.com/-gic_arquicad-/index.html



Trabajaremos todo este proceso en los cursos y aprenderemos a crear y presentar mock ups que nos permitan mostrar nuestro trabajo a los clientes.

Un saludo

sábado, 5 de julio de 2014

IMAGEN CORPORATIVA - BRANDING

Este semana tengo que acabar la imagen corporativa y la web de AUTOMATISMOS KV

Este tipo de trabajos los podréis abordar en la vida real profesional con las técnicas que enseño en los #cursos de #diseñográfico y #diseñoweb del #CentroCultural de #Sanchinarro y #CasaDeLaCultura de #TorejonDeArdoz

El logo lo he dibujado en Inkscape, programa de diseño vectorial que usamos en la Casa de la Cultura (donde todos los programas son software libre), pero las tarjetas las he montado en Adobe Ilustrator.

Y la pequeña página web la he hecho con Aptana, el programa que enseño en los cursos de #diseñoweb de Casa de la Cultura de Torrejón de Ardoz y del Centro Cultural de Sanchinarro.