Tumblr combina un énfasis en la creatividad visual con una extensión de publicación que se ubica entre la brevedad de Twitter y la extensión abierta de una entrada de blog tradicional. Cuando utiliza un tema de Tumblr personalizado que amplía el aspecto de su identidad en línea y fuera de línea, un tumblelog encaja en una estrategia que incluye otras redes sociales y en línea. Los diseñadores web a menudo comienzan a desarrollar temas personalizados en Adobe Photoshop, utilizando el formato de archivo PSD en capas del programa como su espacio de trabajo visual.
Establecer dimensiones
Las guías de reglas y las capacidades de capas de Adobe Photoshop simplifican la tarea de crear la base de un tema de Tumblr, con una cuadrícula de diseño que define las dimensiones de las áreas de contenido. Si configura grupos de capas para cada aspecto de su diseño, incluida su área de contenido principal y la barra lateral, puede colocar todas las guías para cada elemento en una sola capa dentro de cada grupo. Esta disposición le permite hacer que sus guías sean visibles de forma selectiva, en lugar de simplemente mostrarlas y ocultarlas todas con un atajo de teclado de Photoshop o un elemento de menú, y mantiene juntos los elementos de la guía relacionados. Nombra tus grupos y capas para identificar la función de cada parte de tu diseño. Los momentos que invierte en tareas de nomenclatura incrementales se amortizan en el tiempo que no necesita dedicar a activar y desactivar capas para determinar qué contienen. Para encontrar las dimensiones de cualquier elemento de diseño rápidamente, presione "F8" para abrir el panel Información y luego "Ctrl-clic" en la miniatura del panel Capas para cargar una selección basada en los píxeles de esa capa.
Seleccionar colores
Ya sea que use el Selector de color probado a través del tiempo para seleccionar tonos para su tema, cargue opciones de una biblioteca de colores para que coincida con una pieza impresa o logotipo, o confíe en la herramienta Cuentagotas para muestrear tonos de otro archivo o gráfico, Adobe Photoshop ofrece una amplia variedad de formas de seleccionar los colores del tema. Cuando rellena una capa con un color sólido para simular el color de fondo de un tema de Tumblr u otros elementos de su diseño, puede copiar la fórmula de color como texto de la lectura hexadecimal del Selector de color y pegar la identificación del color en el nombre de la capa. para referencia rápida. Los seis caracteres alfanuméricos en un color hexadecimal aparecen en el código de Tumblr, así como en los diseños web para blogs y otros formatos en línea.
Creando Gráficos
El encabezado que identifica un tumblelog puede utilizar un gráfico de mapa de bits como gráfico temático. Puede crear este elemento crítico utilizando una combinación de texto y elementos basados en píxeles o vectores dentro de su archivo PSD. Si el gráfico incluye elementos personalizables que compuso en Photoshop, déjelos como texto en vivo dentro de su archivo de tema basado en PSD y rasterícelos solo en copias del archivo que proporciona a otras personas que no tienen una licencia para los archivos de fuentes requeridos en tu tema. Cuando utilice herramientas vectoriales para dibujar en Photoshop, incluidas las herramientas Pluma y de forma, dibuje utilizando reglas de guía que se alineen con la resolución subyacente de su archivo de plantilla. Esta técnica ayuda a mantener su obra de arte lo más nítida posible cuando guarda o exporta versiones rasterizadas de la misma.
Próximos pasos
Si sabe cómo codificar HTML y CSS, y comprende las variables especializadas que utiliza Tumblr en su estructura de código, puede traducir las dimensiones, especificaciones de color y gráficos que crea en un PSD en un tema de Tumblr personalizado que funcione. Si la codificación web queda fuera de su conjunto de habilidades, puede proporcionar su PSD a un programador para que produzca el tema por usted. Junto con un tratamiento visual, un tema de Tumblr debe incluir variables y bloques. Las variables aceptan valores dinámicos para crear elementos visuales estándar de Tumblr. Los bloques forman fragmentos de código que combinan variables con HTML. Los bloques configuran las publicaciones y los enlaces permanentes que les llegan, enlaces que se mueven entre trozos de material organizado cronológicamente y elementos que se adaptan a las personas a las que les gusta o siguen un tumblelog individual.
Información de versión
La información de este artículo se aplica a Adobe Photoshop CC y Adobe Photoshop CS6. Puede diferir leve o significativamente con otras versiones o productos.
