A veces necesitamos personalizar nuestros diseños, hacer que todos los elementos estén acordes entre sí o sencillamente queremos experimentar, para ello las brushes son una buena forma de aplicar patrones y manejarlos fácilmente en Photoshop. Hacerlas es realmente sencillo y nos permite gran versatilidad a la hora de componer.
1. Hacer el motivo.
Para comenzar se debe dibujar el motivo que queremos que se convierta en nuestra brush, la ventaja es que no sólo tiene que ser un dibujo, puede ser algo escaneado como una textura, una fotografía o cualquier imagen, en éste sentido no hay límite. Para éste ejemplo usaremos una sencilla flor.
2. Definir el Pincel
El siguiente paso es definir el pincel, para ello vamos a la opción Edición > Definir valor de pincel…
3. Darle nombre al pincel
Luego le damos nombre al pincel para diferenciarlo al seleccionar la herramienta.
4. Utilizar el Pincel
Finalmente el pincel está listo para ser utilizado. Si queremos hacer un set de varios pinceles sólo hay que crear la cantidad que necesitamos y luego vamos a la opción Pincel > Guardar Pinceles.
El Color en el Diseño Web (Parte I)
Posteado por Zarzamora en Diseño, Tutoriales
September 1st, 2008
Uno de los aspectos más importantes a tener en cuenta al momento de diseñar es saber utilizar un elemento de comunicación visual como es el color. Los colores son el vehículo a través del cual podemos enviar un mensaje al usuario y con el que podemos comunicar de forma efectiva el mensaje que vamos a transmitir con nuestro diseño.
La escogencia del color se puede hacer a través de diversos métodos, uno de los más comunes es hacer ésta elección de acuerdo a colores corporativos ya existentes, pero generalmente esto nos plantea retos más difíciles de alcanzar, sobre todo porque una cosa es un logo o imagen empresarial y otra un diseño completo para Internet. En éste caso muchas veces se piensa que se deben usar todos los colores del logotipo o imagen en la misma proporción y las mismas tonalidades que allí se encuentran sin tener en cuenta que son dos elementos que deben ser complementos más no deben ser idénticos. Por otro lado tenemos la escogencia del color de acuerdo a la temática de la Web, en éste caso puede ser más fácil si tenemos en cuenta que cada color comunica un mensaje diferente y estamos entrenados a asociar colores con diversos conceptos, el rojo es calor, pasión, amor mientras que el azul es frío, serenidad, sobriedad y así cada uno tiene unas características especiales que se pueden asociar a ellos.
Otra de las cosas que se debe tener en cuenta a la hora de escoger un color adecuado, es si vamos a usar uno sólo o si lo vamos a combinar, en éste último caso es importante tener en cuenta que debe existir un color predominante y otro u otros subordinados y en éste caso las proporciones son importantes. Muchas veces se tienden a usar dos colores y en numerosas ocasiones se cae en el error de usar las paletas como si se fueran a usar para métodos impresos u otras formas de diseño y por ello hay casos en que vemos dos colores complementarios que están en la misma proporción lo cual si no se sabe hacer bien afectará todo el diseño, por ello cuando no se tiene mucha experiencia en éste campo es mejor ir a lo seguro y usar colores neutros que den un porcentaje mínimo de error.
Un color para cada cosa.
Cada color transmite una emoción diferente e incluso cada tonalidad del mismo puede comunicar algo distinto, obviamente es diferente el color cuando lo usamos en un afiche, una revista, una tarjeta de presentación, una ilustración, una obra de arte, en accesorios, en la ropa y por supuesto en la web, por ello daré una pequeña referencia de qué puede comunicar cada uno de ellos cuando se hace un diseño para Internet.
Colores primarios
Existen 3 colores básicos de los cuales se derivan los demás y que pueden servir como base para combinar los demás, cada uno de ellos posee características diferentes.
Amarillo
Es un color que imprime vitalidad en cualquier diseño por su calidez aunque en muchas ocasiones es difícil de combinar con otros colores. Dependiendo de su tonalidad y su brillo puede usarse para uno u otro fin; el primer amarillo que se acerca al marrón se puede usar para sitios relacionados con la naturaleza, montañismo, productos de origen natural (sobre todo aquellos sacados directamente de la tierra), también se puede usar para temas relacionados con indígenas o artesanías. El segundo amarillo es el más difícil de usar precisamente por su brillo, pero puede servir cuando se usa en temáticas relacionadas con viajes, con la playa o todo lo relacionado con la vitalidad, así mismo es un color que puede ser combinado en pequeñas proporciones para resaltar aspectos de una web. El tercer amarillo es mucho más claro que los anteriores y se puede usar para temas femeninos, delicados o relacionados con bebés, también se puede usar para sitios relacionados con flores, adornos e insumos de decoración.
Azul
Es el color corporativo por excelencia y el que se puede usar con mayor facilidad por ser neutro. Por supuesto que dependiendo del brillo y el tono se pueden crear diferentes efectos frente al usuario; el primer azul comunica seriedad y sobriedad por lo tanto se puede usar para diseños que requieran de éstas características como por ejemplo un banco, joyerías prestigiosas, temas relacionados con dinero, tecnología de alto nivel y comercialización de artículos suntuosos. El segundo azul da una excelente tonalidad y brillo para usarlo en temas que requieran vitalidad y frescura, puede usarse para diseños juveniles, relacionados con deportes extremos, diversión, entretenimiento y cualquier temática que hable de movimiento. Por último tenemos el tercer azul que se usa ampliamente debido a que es fácil combinarlo y puede abarcar muchas temáticas, generalmente se usa para artículos de belleza, temas relacionados con salud, con tecnología, viajes, deportes marinos y aéreos, aerolíneas y en general se usa para espacios de comunicación en Internet por su neutralidad, de hecho sin nos fijamos podemos darnos cuenta de que un altísimo porcentaje de diseños están hechos en un azul de ésta tonalidad.
Rojo
Uno de los colores más difíciles de manejar en la web por ser tan llamativo y porque es complicado combinarlo con otros exitosamente. Dependiendo del brillo y la tonalidad se puede usar para diferentes propósitos; el primer rojo es elegante, se puede usar para sitios relacionados con accesorios, ropa formal y es muy común como color corporativo en aerolíneas, bancos, bebidas por lo que la diferencia se logra con los colores que acompañen el diseño. El segundo rojo es más vibrante pero a la vez es más complicado de usar por lo que muchas veces es mejor dejarlo como color secundario, de todas formas sirve para sitios corporativos, institucionales o para otros temas relacionados con amor, romance, vitalidad, diversión y todo dependerá del color que lo acompañe. Finalmente el tercer rojo que es prácticamente el rosado se usa ampliamente en sitios femeninos, delicados o florales pero al igual que las anteriores versiones del rojo todo dependerá de cuál sea el color que complemente la composición.
Mostrar diferentes categorías en WordPress
Posteado por Zarzamora en Diseño, Tutoriales
August 31st, 2008
Cuando tenemos blogs especializados y queremos que la portada sea personalizada y se adecue a nuestras necesidades, podemos optar por mostrar por ejemplo el último post de cada categoría por separado y podemos además darle a cada uno un aspecto diferente. Para ello necesitamos definir cuál será la categoría principal que mostraremos.
Con éste sencillo código lo que hacemos es mostrar únicamente los post de ésta categoría en la portada, para ello se escribe el número de la categoría y adicionalmente podemos decidir cuántos post se verán. Éste número será independiente del número que coloquemos en nuestro Panel de Control de WordPress en el apartado de Lectura (Options > Reading > Blog Pages)
Código :
< ?php query_posts('cat=5&showposts=1'); ?>
Éste código se tiene que poner antes de todo el Loop que genera WordPress y su aspecto estará definido por el aspecto general que exista para los post.
Ahora que tenemos ésto podemos adicionalmente mostrar con otro estilo diferente el último post de las categorías que escojamos o necesitemos. Para ello primero mostramos la categoría elegida y el número de post con el siguiente código.
Código :
< ?php $my_query = new WP_Query('category_name=nombre&showposts=1'); ?>
< ?php while ($my_query->have_posts()) : $my_query->the_post(); $do_not_duplicate = $post->ID; ?>
Luego hacemos que se muestre el título y se haga el link al post.
Código :
<a href="< ?php the_permalink() ?>” rel=”bookmark” title=”Permanent Link to < ?php the_title(); ?>“>
< ?php the_title(); ?>
Después mostramos sólo una fracción del post con el excerpt que genera WordPress y finalizamos todo el llamado.
Código :
< ?php the_excerpt(''); ?>
< ?php endwhile; ?>
Lo que daría como resultado algo así.
Código :
< ?php $my_query = new WP_Query('category_name=nombre&showposts=1'); ?>
< ?php while ($my_query->have_posts()) : $my_query->the_post(); $do_not_duplicate = $post->ID; ?>
<a href="< ?php the_permalink() ?>” rel=”bookmark” title=”Permanent Link to < ?php the_title(); ?>“>
< ?php the_title(); ?>
< ?php the_excerpt(”); ?>
< ?php endwhile; ?>
Ésta forma de llamar a los post por categoría puede ser muy útil porque nos permite darle el aspecto que queramos el cual será independiente de la forma que mostremos los post generales. Se podría generar gráficamente algo así.
Para finalizar hay algo muy importante a tener en cuenta y es que si usamos ésta forma de llamar los post en el index.php, necesitaremos utilizar plantillas para los post sencillos, las páginas, las categorías, los tags y demás utilidades de WordPress.
Muchas veces necesitamos que nuestras páginas en WordPress se vean diferentes unas de otras, por ejemplo queremos una página especial para mostrar los resultados de las búsquedas en la cual no se vea el sidebar o una donde queremos ubicar una nube de tags, para que ésto suceda debemos usar plantillas específicas o templates dentro de los cuales definiremos las características especiales que necesitamos.
WordPress toma por defecto algunos nombres específicos para ciertos usos, es así como si hacemos una plantilla y la nombramos search.php cada vez que hagamos una búsqueda ésta será la página que se presentará en los resultados. A continuación presentaré los nombres predeterminados y los usos de algunas plantilla útiles.
- 404.php: Ésta plantilla se mostrará como página de error cada vez que no se encuentre un contenido dentro del blog.
- single.php: Muestra como se vería un post individualmente.
- page.php: Es la plantilla por defecto para los contenidos de las páginas individuales de Wordpress.
- category.php: Muestra todos los post de una categoría, también se puede hacer una pequeña variación y mostrar por ejemplo cada categoría de manera diferente, para ello se le agrega el número de la categoría así: category-9.php
- archive.php: Ésta será la plantilla que mostrará el archivo del blog.
- tag.php: En ésta plantilla se mostrarán todos los post correspondientes a un tag específico, funciona muy similar a la plantilla category y también se puede diferenciar una de otra añadiendo el slug del tag correspondiente así: tag-nombredelslug.php
- search.php: Con ésta plantilla se muestran los resultados de las búsquedas realizadas.
- autor.php: Es la plantilla utilizada por defecto para mostrar la información del autor.
Por otro lado también se pueden crear plantilla específicas fuera de las que Wordpress tiene como predeterminadas, para ello debemos insertar el siguiente código al principio de la página.
Código :
< ?php
/*
Template Name: Nombre
*/
?>
Después vamos al panel de administración de WordPress, creamos una página común y corriente: Escribir > Página (Write > Page). Una vez allí en la barra lateral se mostrará la opción de Plantilla de Página (Page Template) en dónde seleccionaremos la que corresponda al Nombre que anteriormente utilizamos en el código anterior.
Las plantillas son muy útiles cuando queremos hacer themes más complejos y personalizados ya que nos permiten mostrar el contenido de forma diferente y de manera especializada, así que espero que éste pequeño resumen de lo que se puede hacer les haya sido de utilidad.
