Tutorial: Que NO hacer en un icono
Que hacer y que NO hacer en un icono
Este tutorial va a estar centrado en los pasos básicos para hacer un icono. Empezaremos viendo como se reduce correctamente una imagen, hasta como utilizar una fuente con anti-alias, pasando por el enfoque o el encuadre. Decir que está todo exagerado para que se vea bien. Espero que os ayude.
Vamos a empezar con esta imagen promocional de Matthew Fox (500x621 px)
Lo primero que vamos a hacer con ella es cambiarle el tamaño para que se adapte a los 100x100 px de nuestro futuro icono. Podéis ponerla el tamaño que queráis. Cuando la tengáis, creáis un nuevo documento de 100x100 y 72 px de resolución y copiáis y pegáis la imagen en vuestra base.
Ahora veremos lo que NO debeis hacer a partir de ahora.
+ Al Cambiar de tamaño a una imagen:
Bien
Mal
+ Al fijar el encuadre: Aqui podeis jugar con vuestra imaginación y crear vuestro propio estilo, pero es muy importante que el foco de atención no esté en el centro, por favor.
Bien
Mal
+ Al enfocar una imagen: Es importante enfocar una imagen por que sino puede dar un aspecto distorsionado y poco claro al icono.
Bien
Mal
+ Al alisar una imagen: Esto se hace (en PS 7) con la herramienta del dedo a una intensidad no mayor a 20%.
Bien
Mal
+ Al contrastar una imagen: Para eso teneis que ir a Capa > Nueva capa de ajuste > Brillo/Contraste y alli jugar con el contraste.
Bien
Mal
+ Al Saturar/Desaturar Lo importante aqui, no es si desaturas la imagen. El problema viene cuando queremos saturarla o sólo saturar un color. Vamos a ver si queremos por ejemplo destacar el color verde de su camisa. Para eso teneis que ir a Capa > Nueva capa de ajuste > Tono/Saturación y alli jugar con la saturación de cada color. En este caso el verde.
Bien
Mal
Decir que hay una forma mucho más efectiva para hacer combinada con esto. Pero ya haré otro tutorial explicandolo.
+ Al poner texto: Aqui hay 4 cosas clave: El tamaño SI importa, el anti-alias, color y colocación
El tamaño de la letra importa ¿Por qué? Por que hay letras que soportan solo determinados tipos de tamaños, si no, quedan muy pixeladas. Pongamos el ejemplo de la Century Gothic.
Bien
Mal
El anti alias es una opción que se debe de poner en TODAS las fuentes que no sean pixeladas. Un ejemplo de fuente pixelada aqui..
Bien
Mal
El color es un tema importante. Se ven iconos en los que en color de la fuente no forma parte del icono, para esto, lo mejor es coger el selector de color y pasearlo por el icono hasta en contrar el color que mejor se adapte.
Bien
Mal
La colocación del texto es algo tan importante como la colocación de la imagen. Normalmente el texto sirve para compensar la imagen y sus espacios en blanco y asi crear efecto de estabilidad.
Bien
Mal
Bueno mas o menos ese sería la base del icono. Luego le podeis añadir gradientes, brushes, patterns y ¡todo lo qeu querais! la creatividad ya es cosa de cada uno. El mio queda asi:
Cualquier duda, sugerencia o proposición de matrimonio puede ir en un comment o a xxmiraclexx@gmail.com.
Este tutorial va a estar centrado en los pasos básicos para hacer un icono. Empezaremos viendo como se reduce correctamente una imagen, hasta como utilizar una fuente con anti-alias, pasando por el enfoque o el encuadre. Decir que está todo exagerado para que se vea bien. Espero que os ayude.
Vamos a empezar con esta imagen promocional de Matthew Fox (500x621 px)
Lo primero que vamos a hacer con ella es cambiarle el tamaño para que se adapte a los 100x100 px de nuestro futuro icono. Podéis ponerla el tamaño que queráis. Cuando la tengáis, creáis un nuevo documento de 100x100 y 72 px de resolución y copiáis y pegáis la imagen en vuestra base.
Ahora veremos lo que NO debeis hacer a partir de ahora.
+ Al Cambiar de tamaño a una imagen:
Bien
Mal
+ Al fijar el encuadre: Aqui podeis jugar con vuestra imaginación y crear vuestro propio estilo, pero es muy importante que el foco de atención no esté en el centro, por favor.
Bien
Mal
+ Al enfocar una imagen: Es importante enfocar una imagen por que sino puede dar un aspecto distorsionado y poco claro al icono.
Bien
Mal
+ Al alisar una imagen: Esto se hace (en PS 7) con la herramienta del dedo a una intensidad no mayor a 20%.
Bien
Mal
+ Al contrastar una imagen: Para eso teneis que ir a Capa > Nueva capa de ajuste > Brillo/Contraste y alli jugar con el contraste.
Bien
Mal
+ Al Saturar/Desaturar Lo importante aqui, no es si desaturas la imagen. El problema viene cuando queremos saturarla o sólo saturar un color. Vamos a ver si queremos por ejemplo destacar el color verde de su camisa. Para eso teneis que ir a Capa > Nueva capa de ajuste > Tono/Saturación y alli jugar con la saturación de cada color. En este caso el verde.
Bien
Mal
Decir que hay una forma mucho más efectiva para hacer combinada con esto. Pero ya haré otro tutorial explicandolo.
+ Al poner texto: Aqui hay 4 cosas clave: El tamaño SI importa, el anti-alias, color y colocación
El tamaño de la letra importa ¿Por qué? Por que hay letras que soportan solo determinados tipos de tamaños, si no, quedan muy pixeladas. Pongamos el ejemplo de la Century Gothic.
Bien
Mal
El anti alias es una opción que se debe de poner en TODAS las fuentes que no sean pixeladas. Un ejemplo de fuente pixelada aqui..
Bien
Mal
El color es un tema importante. Se ven iconos en los que en color de la fuente no forma parte del icono, para esto, lo mejor es coger el selector de color y pasearlo por el icono hasta en contrar el color que mejor se adapte.
Bien
Mal
La colocación del texto es algo tan importante como la colocación de la imagen. Normalmente el texto sirve para compensar la imagen y sus espacios en blanco y asi crear efecto de estabilidad.
Bien
Mal
Bueno mas o menos ese sería la base del icono. Luego le podeis añadir gradientes, brushes, patterns y ¡todo lo qeu querais! la creatividad ya es cosa de cada uno. El mio queda asi:
Cualquier duda, sugerencia o proposición de matrimonio puede ir en un comment o a xxmiraclexx@gmail.com.