Hoy completamos la serie de tutoriales para localizar páginas web en HTML con la tercera y última entrega, en la que te enseñamos cómo editar fotos con Photoshop.
Si te acabas de unir a esta serie, no te pierdas las dos primeras publicaciones en las que tratábamos la estructura de carpetas y el texto traducible. Junto con la localización de imágenes, conocer el funcionamiento de las carpetas y saber reconocer el texto traducible es imprescindible para localizar por completo una página web en HTML.
Por qué debería aprender cómo editar fotos
En un sector eminentemente visual es cuestión de tiempo que, como traductores, nos encarguen la localización de una página web al completo, lo que incluye tanto sus elementos textuales como las imágenes que la componen. Muchas de estas imágenes tendrán texto incrustado y, lógicamente, saber cómo editar fotos será necesario para traducir estos textos y conseguir una localización integral.
¿Qué necesito para empezar?
Nosotros recomendamos trabajar con Photoshop. Si bien es cierto que no es un programa gratuito, la diferencia en los resultados y la forma de trabajar merece la inversión. En cualquier caso, te animamos a descargar la versión de prueba de Photoshop de la página de Adobe y decidir tú mismo. Si prefieres una opción sin costes, puedes conseguir un resultado similar con GIMP, un programa libre de edición de imágenes que se presenta como la principal alternativa gratuita a la herramienta de Adobe.
Cómo editar fotos con texto incrustado
Para este tutorial tomamos como ejemplo el tipo de edición que presenta más dificultades, pero no por ello menos común; el de imágenes con texto incrustado y fondo complejo, y en el que el cliente no dispone de los archivos originales de la composición.
Cuando aprendamos a resolver esta situación, sabremos cómo editar fotos en cualquier otro caso:
- Si recibimos el archivo de la composición en PSD tan solo tendremos que editar la capa o capas de texto.
- Si recibimos un archivo de imagen con texto, pero este está incrustado sobre un fondo simple, podremos editar el texto sin utilizar el Tampón de clonar, eje del tutorial que nos ocupa.
Tras estas consideraciones previas, aquí tenemos la imagen con texto incrustado y fondo complejo que vamos a localizar y los pasos que debemos seguir:
1) Organización de las capas de trabajo
Una vez hayamos abierto el archivo de imagen en Photoshop, iremos al panel Capas y haremos clic con el botón secundario en la capa Fondo para duplicarla.
Esta copia será sobre la que trabajaremos, por lo que tenemos que asegurarnos de tenerla seleccionada siempre. Esta forma de trabajar es más segura y nos sirve para no perder la referencia de la posición original del texto.
2) La herramienta Tampón de clonar
Una vez tengamos una copia de la imagen en forma de nueva capa, es hora de entrar en materia. Lo primero es borrar el texto de la imagen sin afectar al fondo que habría detrás. Para ello utilizaremos la herramienta Tampón de clonar de Photoshop.
Tendremos que marcar el área que queremos replicar con la tecla Alt y utilizar el pincel para reproducirla en otras zonas.
Aquí vemos la herramienta Tampón de clonar en acción y algunas de las opciones que podemos ajustar, como el tamaño del pincel o el área que replicar
Este proceso tiene que llevarse a cabo con cuidado y de un modo casi artesanal; si cuando ya te sientes cómodo con la herramienta notas que estás marcando constantemente el área para replicar, vas por buen camino. Cuando borremos por completo el texto, deberíamos tener una imagen limpia como la siguiente:
3) Cómo insertar el texto traducido
Ahora en Photoshop deberíamos tener dos capas: la capa Fondo con la imagen original y la copia de esta con la imagen limpia. Si es así, el paso siguiente será insertar un cuadro de texto en la misma posición que el texto original. Esto se consigue mostrando de forma temporal la capa Fondo y situando el nuevo cuadro de texto encima del texto anterior.
A continuación, según si el cliente nos ha proporcionado la tipografía original o no, tenemos dos opciones:
- Si disponemos de la fuente, tan solo tenemos que instalarla en nuestro PC con el archivo OTF o TTF, y usarla en el nuevo cuadro de texto creado en Photoshop.
- Si no disponemos de la fuente original y no sabemos cuál es, la mejor solución es buscar fuentes similares y ofrecer al cliente varias alternativas. Esto es lo más acertado siempre y cuando se mantenga la comunicación con el cliente y sea imposible recuperar la fuente original. En nuestro caso, hemos utilizado Google Fonts para buscar otras fuentes en la sección de Handwriting, y hemos preparado varias alternativas parecidas a la foto original. Esto no te llevará mucho tiempo porque la imagen ya está limpia y solo tendremos que hacer tantas copias del cuadro de texto como queramos, en función de las fuentes que vayamos a usar.
Cuando sepas cómo editar fotos, solo te faltará renombrar los archivos respetando la estructura de carpetas original para no romper ningún enlace y habrás conseguido una localización integral de una página web en HTML.
