Logo de BHR – Así lo hice

Estas publicaciones especiales pertenecen a un reto que llamamos: Así lo hice. Puedes ver el "Así lo Hice" de MLMM en "Leer Mas en las Entradas"

Esto está dedicado a Mica de Vocación Literaria

***

La verdad es que el logo de BHR no es la gran cosa, antes de quedar como lo ven hoy en día paso por varios procesos que fueron mejorándolo y no duden que seguirá cambiando en el mejor de los casos para bien.



El proceso creativo

Llamemos así al momento en que se está creando en el logo en la cabeza, cuando va saliendo de la mente a un papel en forma de boceto. Describirlo como tal me es algo difícil, pues cada vez que quiero hacer un “diseño” siempre comienzo con una hoja de papel cualquiera, y una pluma que esté haciendo rayones a lo tonto, mientras me visualizo que es lo que quiero, en el caso de BHR me iba haciendo unas cuantas preguntas como

  • ¿Quiero un dibujo o solo letras? 
  • ¿El dibujo de que será?
  • ¿Qué me gusta? ¿Animal u objeto?
  • ¿Qué letras llevara?¿Las iniciales o todo el nombre?
  • ¿Qué tipo de letra?¿Las letras formaran parte del dibujo?

Intente sacar un dibujo pero no me ocurrió nada, como que fue algo espontaneo la decisión rápida: serán letras, entre rayones y divagaciones fui dándole forma a las letras que serían el logo de BHR. Por lo mismo de que fueron letras esto se ve súper sencillo.

Basado en Hechos Reales

Basado en Hechos Reales


Una vez que el boceto estaba listo, ahora falta pasarlo del papel a lo digital. Aquí quiero aclarar que yo lo hice de la siguiente manera a causa de mis pocos conocimientos en diseño gráfico y con las pocas o muchas herramientas que tengo a mi disposición: Un PC básico, Bocinas, Monitor, Photoshop y muchas ganas de ver cómo quedaría terminado ya este diseñito.


El proceso “Industrial”

Antes, cuando tenía a disposición mía un Scanner, lo que hacía era pasar el boceto en papel por el scanner para hacerlo digital, de ahí empezar a trabajar sobre de él, afinando detalles y eliminando algunos otros, pero como no es el caso, pues lo que hago es comenzar desde cero y así ir formando el “diseño a mi modo y gusto”, claro está ya con un modelo establecido por el boceto.

Para quienes no sepan que es Photoshop, imaginen que es como un Paint pero con muchísimas más opciones de edición, en Photoshop podemos trabajar sobre capas, que podrían ser como hojas, poniendo un ejemplo de cómo se usan: puedes dibujar algo sobre una hoja azul, pero si le pones encima una amarilla pues solo veras la hoja amarilla, si quieres ver el dibujo que hiciste en la hoja azul pero con la hoja amarilla tienes dos opciones: quitar la hoja amarilla y pintar la de azul, o recortar la hoja amarilla de tal forma que te quede un hueco para que se vea el dibujo sin nada de la hoja azul; también se puede trabajar con hojas transparentes (como las opalinas), hacer una letra en cada hoja y así formar una palabra, si necesitas quitar una letra solo eliminas la hoja, si necesitas poner otra letra puedes copiar una hoja o hacer otra. Mmm, ¿no sé si me explique con esta metáfora del Photoshop?

Bueno, pues ya estando en Photoshop, todo listo para hacer el pequeño diseño que representaría a BHR este 2016, hice lo siguiente.

Photoshop


Comencé con un archivo nuevo colocando una base transparente, esto para poder guardar la imagen final en un archivo PNG y pueda conservar el fondo transparente, ya que si lo guardo en un archivo de tipo JPGE, el fondo transparente se transforma en blanco y ocuparlo así lo hace más tedioso.

Para realizar mi tipografía de las tres letras de BHR, ocupe la herramienta llamada Pluma, esta al dar click en cualquier parte de la capa crea un punto, al dar click en cualquier otro lado se crea otro punto que se enlaza con una línea al punto anterior a este, y así tantas veces sea necesario. A cada punto que creemos le saldrán dos líneas en dirección opuesta, estas servirán como palancas, estas se manipulan con un click sostenido en cada punta, para poder darle curva o recta, longitud y tamaño a la línea creada entre el punto en el que estemos y el punto anterior a este.


Photoshop


Cada punto también se puede mover y desplazar a donde queramos, así podemos crear el diseño que queramos sin problemas. Al terminar de formar el diseño con estas líneas y puntos, solo tenemos que dar click derecho sobre alguna línea y seleccionar “Contonerar” con esto la línea toma grosor y color (el grosor y color que nosotros queramos, yo siempre lo dejo en negro, sin embargo el color se le puede cambiar en cualquier momento). Los puntos y líneas que anteriormente nos sirvieron son guías, por lo tanto hay que borrarlas solo oprimiendo la tecla ESC de nuestro teclado.

Si como en mi caso las líneas formaron una figura, estas se pueden rellenar para que la figura sea sólida, con estas figuras solidas forme las letras de BHR, cada una en una capa diferente, por aquello de las modificaciones que posterior se me ocurriesen hacerle.


Basado en hechos reales
Forma inicial de la "B"

Basado en hechos reales
Forma inicial de la "H"

Basado en hechos reales
Forma inicial de la "R"

Basado en hechos reales
Forma final de la "B"

Basado en hechos reales
Forma final de la "H"

Basado en hechos reales
Forma final de la "R"


Mostrando todas las capas el resultado queda así:

Basado en Hechos Reales


En negro se ve bien, pero tenía que darle un poquito de vida, escoger un color para que te represente es difícil, confieso que el color que tiene hoy día es de prueba, para ver cómo es aceptado y por lo visto no le ha ido tan mal. 

Todo lo anterior lo guarde en un archivo editable de Photoshop, por si quiero modificar algo, además guarde una copa en un archivo PNG para poderlo ocupar en otros lados. Tal como lo hice para aplicarle color y el fondo de Alicia Atreves del Espejo:


basado en hechos reales


Para esto abrí otro archivo nuevo con el fondo transparente, en una capa arrastre el archivo de las letras de BHR en PNG, a esta capa le di click derecho y escogí la opción de “Opciones de Fusión”, se abre una ventana llamada “Estilo de Capa” en la cual nos ofrecen varias opciones para editar, como poner sombra, resplandor, trama y en mi caso ocupado: Trazo. El Trazo nos va a remarcar el contorno de lo que sea que tengamos en la capa seleccionada, dándonos la oportunidad de seleccionar grosor, opacidad y color del mismo contorno, quedándome a mí así:


Basado en hechos reales


Como se ve un poco darks, le cambie el color al relleno.

Basado en hechos reales


A partir de aquí ya todo es más sencillo de explicar, pues no hice gran cosa, solo agregue texto con la herramienta del mismo nombre, que también nos permite seleccionar el tipo de letra, tamaño, color, alineado, entre otras opciones más.

Basado en hechos reales


Como se veía muy simple, busque entre las imágenes que colecciona alguna que estuviera en formato PNG con fondo transparente, algo que algunos conocen como imágenes en vector o en renders, encontré la de Alicia en el País de las Maravillas, aunque la historia se me haga un poco fumada, tiene cierta similitud con la vida: todo y nada es posible, y claro, ¿quién me niega que no esté basada en hechos reales? Todas las escenas son metaforas de ciertas vivencias de cualquier persona. Así que la coloque debajo de las capas anteriores, además la opacidad de la misma la deje en un 70%, todo esto para que pudiera difuminarse en cualquier lugar en el que fuera puesto el logo ya terminado:

Basado en hechos reales


Al finalizar siempre guardo el trabajo en un archivo editable de Photoshop y otro en imagen PNG listo para ser ocupado.

Así fue como hice el logo del blog, algo sencillo y de proceso también sencillo, al menos el “industrial” porque el creativo si cuesta a veces un poco de trabajo.

Espero no haya decepcionado a nadie, si alguna parte no la detalle cómo les hubiera gustado, comenten, para pulir esa parte y no se queden con ninguna duda. Recuerden que esto es parte de un reto, así que si quieren saber sobre el “¿Cómo lo hice?” de algo que hayan visto en el blog a lo largo de la vida de este, hablen ahora que serán complacidos en “Así lo Hice


así lo hice

Helena Sanz

En un principio, uno escribe para sí mismo, luego, cuando me entere de que vos me leía, entonces empecé a escribir para ti. Puedes seguirme si gusta en mis redes sociales, también, puedes compartirme ;3

11 comentarios:

  1. Eso es increíble! Jaja Primero que nada, un 10 por la imaginación artística (a mi se me da mejor la inspiración en palabras que en imágenes). Y segundo, parece que te llevo un gran trabajo armar el logo, quizás haya sido más fácil si estás acostumbrada a Photoshop.
    Como ya he mencionado, yo soy muy amateur con las cosas de diseño asique te admiro por el excelente trabajo!
    Gracias por compartir esto y dejarme conocer tu trabajo creativo. Te mando un gran abrazo!!

    ResponderEliminar
    Respuestas
    1. Ya cuando le entiendes a muchas cosas y te acostumbras a ellas, todo se va haciendo mas fácil. Honestamente tenia dudas al principio, pues esto es lo que hago, tampoco soy diseñadora gráfica o experta en algo, pero me gusta esto y el como lo hago, voy mejorando poco a poco y hoy se los comparto, no teneis miedo de nada, que si necesitan ayuda, adelante: Estoy para ayudar :D
      Si teneis alguna otra petición, adelante! :D
      Un abrazo y las mejor de las vibras :3

      Eliminar
  2. Me encanta esta sección, ya yo empiezo a querer un cambio para mi blog pero aún no tengo nada concreto y este tipo de entradas ayudan a inspirarse. Por cierto, la tipografía de tu logo es bella y no tenía ni idea que era de tu autoría.

    ResponderEliminar
    Respuestas
    1. Gracias!!! :3
      Quiero reiterar mi apoyo y ayuda a ustedes mis fieles colaboradores :D No soy tan experta en lo que corresponde a diseños de pagina web, pero cuando me lo propongo lo consigo, y si no, sigo intentando (Tal como me paso con el blog, ha pasado por tantas modificaciones), pues a lo que iba, en lo que gustes, estamos para ayudarles :D
      Un gusto te pases por estos lares Kéllyta... Un gran abrazo!!!

      Eliminar
  3. wow, me encanto esta entrada, y sobre todo la forma en la que vas describiendo tu logotipo.. he de confesar ahora abiertamente al mundo dgital, que a pesar de haber estudiado arquitectura, nunca se me ha dado utilizar el photoshop.. jaja
    Algo que si quiero decir, es que me gusto mucho como diseñaste el BHR, lo hiciste a proporcion, y se ve realmente muy agradable y esteticamente bien.. :D te sacas un diez! :D
    nos leemos Helena !
    saludos!

    ResponderEliminar
    Respuestas
    1. Gracias :3 :D
      Por cierto, ¿que los Arquitectos no usan algo mas similar a Autocad? XD También he jugado con él, pero no mas por curiosidad, el photoshop lo voy aprendiendo conforme lo voy ocupando, no es difícil una vez que le agarras necesidad XD
      Nos leemos infinitamente Pao...!!!

      Eliminar
  4. Wow, excelente tutorial y muy buen trabajo con el logo!
    El photoshop me parece complejo, pero igual me traen los desafíos, jaja.
    Muchas gracias por enseñarnos cosas nuevas :)
    Un beso!

    ResponderEliminar
    Respuestas
    1. si es algo complejo, pero con lo básico nos ha de bastar para hacer nuestros diseñitos :3
      Gracias por pasarte por estos lares Queen ;P
      Nos leemos :D

      Eliminar
  5. ¡Hola Helena!
    Mi blog ha recibido el premio “The versatile blogger award” y el “Liebster awards” y te he nominado tu blog para este último (“Liebster awards”). ¡Enhorabuena ^-^!

    Entra en mi blog (VerdeZona) si quieres saber más detalles y las instrucciones para tus siguientes nominados.

    Un abrazo fuerte.
    Daniel.

    ResponderEliminar
    Respuestas
    1. Valla... me has roto el corazón ¬¬
      Pero esta bien, me paso para ver mis preguntas y resolverlas :D
      Muchas gracias!!!

      Eliminar
    2. o.O por qué te he roto el corazón? no me digas eso que me pongo muy triste T.T

      Eliminar

Gracias por pasarte y leer este Post. Agradecería mucho que me regales tu opinión al respecto en los comentarios (no se borra ninguno por respeto a tu valioso tiempo).