, ,

Localizando imágenes con Adobe Photoshop

¡Hola a todos! Hoy os traigo algo nuevo. Ya llevo un tiempo diseñando páginas web y sé que para un traductor hay ciertos aspectos que cuesta mucho trabajo perfilar correctamente. Uno de ellos es la localización de imágenes, pues es una tarea que requiere tener ciertos conocimientos de programas de edición de imágenes y gráficos.

Básicamente, localizar una imagen consiste en modificar y adaptar los textos o información que esta contenga sin que quede afectado el contenido y el diseño de la misma. Hay muchos programas con los que se puede llevar a cabo esta tarea. En mis entradas de software os he hablado de varios editores como Gimp, Inkscape o Photoshop. Yo tengo la suerte de disponer de Photoshop, que es el que utilizo normalmente y el que me saca de todos los aprietos.

Antes de nada, sea cual sea el encargo (traducción de una página web, de un programa/software, de un videojuego, etc.) recomiendo que hagáis una copia de los archivos que os envíen. De este modo podréis trabajar sobre los archivos ya copiados sin riesgo de perder los archivos originales. Puede sonar a perogrullada para los más experimentados, pero seguro que más de uno ha metido la pata en este sentido.

A la hora de localizar una imagen, principalmente se suelen dar estas dos situaciones:

  • Que el cliente tenga la imagen original en un archivo editable  (el formato dependerá del programa, normalmente en Photoshop es en formato .psd).
  • Que no tenga un archivo editable y te envíe una imagen en mapa de bits que tengas que editar manualmente (.jpg, .gif, .png, etc.).

En el primer caso la edición es muy sencilla. Simplemente abriremos la imagen en Photoshop y seleccionaremos el cuadro de texto correspondiente para editar su contenido.

photoshop1

photoshop2

photoshop3

Una vez finalizado el proceso de edición tendremos que guardar la imagen con el mismo nombre y en la misma carpeta. El procedimiento en otros programas como Gimp o Inkscape sería prácticamente el mismo, simplemente habría que localizar la herramienta para insertar o editar texto y hacer lo propio.

En el caso de que recibamos una imagen en mapa de bits, el proceso se complicará un poco, aunque con algo de habilidad y destreza se podrá llevar a cabo sin ningún problema.

Por ejemplo, imaginad que os encargan que traduzcáis un documento sobre el funcionamiento de un Scrum que incluye la siguiente imagen:

Scrum

Al no poder editar los textos utilizando el procedimiento anterior, tendremos que tirar de inventiva. Lo primero que tenemos que hacer es analizar la imagen. Observamos que tenemos dos textos sobre fondo blanco y cuatro que están introducidos en un bocadillo que tiene como fondo un degradado. Evidentemente, los textos más complicados serán estos últimos.

  • Para el primer tipo de texto el proceso será bien sencillo: una vez abierta la imagen en Photoshop, insertaremos un rectángulo blanco o utilizaremos la goma de borrar para eliminar los textos. A la hora de seleccionar el color, es recomendable utilizar la herramienta “Cuentagotas”, pues nos permitirá darle al rectángulo exactamente el mismo tono de color para borrar la imagen, de forma que no quedará ninguna marca. Para ello, una vez se abra el cuadro de diálogo para seleccionar el color, haremos clic en el fondo de la imagen para que el programa detecte y aplique automáticamente el color. Posteriormente, insertaremos el rectángulo sobre el texto. El siguiente paso será insertar el texto manualmente. Para ello seleccionaremos la herramienta “Texto Horizontal”. Es importante intentar buscar un tipo de letra que sea lo más parecido posible al original. En caso de no tenerlo claro, utilizaremos algún formato de letra estándar como Arial, Calibri o Times New Roman, que al ser los más utilizados le darán en cualquier caso un toque profesional. También habrá que probar con diferentes tamaños y una vez elegido el tamaño ideal, mantenerlo con el resto de textos para mantener un cierto rigor.

photoshop4

photoshop5

  • En el caso de los textos de los bocadillos, el procedimiento será similar. Aunque pueda parecer complicado, lo único que tenemos que hacer es borrar los textos insertando un degradado que sea lo más parecido posible al de la imagen original. No es necesario borrar los bocadillos y dibujarlos de nuevo, ni las flechas, ni nada por el estilo. Para crear un degradado igual tendremos que sacar partido de nuevo a la herramienta “Cuentagotas”, que se activa automáticamente cuando se abre el cuadro de diálogo para elegir el color deseado.

Los pasos para este proceso son los siguientes:

  1. Seleccionamos de nuevo la herramienta “Forma personalizada”, y elegimos la forma del rectángulo.
  2. Insertamos un rectángulo solapando uno de los bocadillos, pero procurando no salirnos ni tocar los bordes negros.
  3. Una vez insertado el rectángulo, haremos clic en Capa/Estilo de Capa/Opciones de Fusión…
  4. Cuando se abra el cuadro de diálogo, activaremos la función “Superposición de Degradado”.
  5. Una vez activada, hacemos clic en el recuadro donde nos aparece el degradado que se activa por defecto (normalmente será en blanco y negro). Al hacer clic, se abrirá un cuadro de diálogo donde podremos configurar el degradado.
  6. Después, seleccionamos el cuadrito de color ubicado en el lado izquierdo y le asignamos el color deseado. Para aplicar el mismo color al degradado, en el recuadro de la izquierda seleccionaremos el color en uno de los bocadillos, tomando la muestra de color de la parte superior del mismo (lo más cerca posible de la línea negra). En la parte de la derecha, haremos el mismo proceso, pero seleccionando el color de la parte inferior del bocadillo. Para finalizar,  activaremos la función de “Invertir”.
  7. Una vez configurado el degradado, hacemos clic en aceptar y observamos los cambios.

photoshop7

* Es posible que tengamos que modificar el tamaño del rectángulo para que no se quede ninguna marca. Para ello es recomendable ampliar el zoom y apurar los bordes al máximo. Para modificar el tamaño del rectángulo lo haremos haciendo clic en “Edición/Transformación libre”.

Una vez insertado el degradado insertamos el nuevo texto sobre el rectángulo. De nuevo elegiremos el mismo tipo de letra y tamaño que utilizamos para la edición de los textos anteriores, y controlaremos que todo quede lo más parecido posible al original. Repetiremos el proceso con el resto de bocadillos, y el resultado seguro que será muy parecido al que os muestro a continuación:

Scrum_traducida

Como veis, el resultado quizá no es perfecto, pero da bastante el pego. Si no os sale a la primera, tened paciencia, pues al principio es un poco difícil entender bien el funcionamiento del programa. Además, conforme vayais practicando iréis adquiriendo una mayor destreza y precisión con las diferentes herramientas.

Espero que el post os haya sido de utilidad, a mí me llevo mucho tiempo aprender a hacer este tipo de ediciones de manera adecuada. Gracias a ellas he podido localizar mi propia página web sin demasiado esfuerzo y ahorrando mucho tiempo. Si no disponéis de Photoshop, el procedimiento con Gimp e Inkscape es prácticamente igual, lo único que cambia es la ubicación de las herramientas, pero las que habrá que utilizar serán las mismas (rectángulo, edición de texto y degradado).

Os recuerdo que podéis saber más sobre todos estos programas en la sección del proyecto SofTrad e, incluso, si queréis practicar  el proceso, podéis descargar la imagen original de esta entrada y trabajar sobre ella.

Ala, ala, ¡a practicar se ha dicho! ¡Un saludo!

0 0 votes
Valoración
Suscribirse
Notificar de
guest
5 Comentarios
más antiguos
más recientes más votados
Inline Feedbacks
View all comments
Jeffrey Collado
11 años atrás

¡Hola!
Enhorabuena, mola la entrada. 🙂
Yo recuerdo que esto del jugueteo con los programas de edición de imágenes lo hicimos en la carrera también con Don Manuel Mata. En aquella ocasión utilicé Paint Shop Pro, bastante más sencillo que Photoshop y que a mí me hizo el apaño para el proyecto de traducción de una web, así que ahí dejo otra sugerencia.

¡Un saludo!

raflosa
11 años atrás

Hola Jeffrey!
Gracias por tu aportación. En la carrera nosotros hemos utilizado Inkscape y Gimp en las clases de Sergio Alonso (un profesor cojonudo, por cierto). Estos programas son gratuitos y permiten hacer casi de todo.

curribarcelo
curribarcelo
11 años atrás

Yo en este caso lo habría hecho al revés: primero, con la herramienta de copiar (el sello), borraría el texto inglés de cada recuadro y, después, añadiría el cuadro de texto y la traducción. Diría que es más rápido, lo que así sin más no sabría decir si quedará más bonito o no 🙂

raflosa
11 años atrás

Es otra forma de hacerlo. Lo de que quede más o bonito o no depende de la pericia de cada uno con la herramienta o método que utilice. Yo he automatizado esta manera de hacerlo y la verdad es que me resulta muy efectiva, el resultado es bueno y, una vez lo automatizas, tardas muy poco tiempo en hacerlo. El tampón de clonar lo suelo utilizar más para la edición de fotografías, aunque también puede ser una opción muy buena para este tipo de retoques 🙂

trackback
10 años atrás

[…] todos los editores de imágenes. Si os acordáis, vimos algunos de estos procedimientos en una de las entradas anteriores del blog, en la que os explicaba cómo modificar los textos de una imagen en formato de mapa de bits con […]