El 14 de septiembre de 2017, publicamos una versión revisada de nuestra Política de privacidad. Tu uso continuado de video2brain.com significa que aceptas este documento revisado, por lo que te recomendamos que dediques unos minutos a leerlo y comprenderlo.

Aprende Experience Design CC

Efectos sobre imágenes en Adobe XD

Prueba ahora LinkedIn Learning sin cargo y sin compromiso.

Prueba gratis Mostrar modalidades de suscripción
A la hora de trabajar con imágenes, podemos aplicar efectos básicos que luego se podrán trasladar a CSS, tales como superponer un color sobre la imagen o aplicar un desenfoque al objeto inferior para resaltar un mensaje.

Transcripción

Si nosotros trabajamos con cualquier imagen podemos aplicar pequeños efectos sobre la misma que nos van a ayudar a posicionar el texto y que harán que sea mucho más sencillo su lectura. Partiendo desde el simple efecto de ponerle un cuadro encima con un color que nosotros definamos, por ejemplo, vamos a trabajar con un color azul, algo oscuro. Bajando la opacidad ya tenemos un efecto que nos va a permitir posicionar muy fácilmente: "HOLA. SOY UN TEXTO BASTANTE LEGIBLE". Entonces, vamos a darle un color blanco que lo veamos mejor y lo vamos a posicionar con una tipografía "Bold", a un tamaño de 80. Aquí podríamos modificar el espaciado, bajarlo a 85, por ejemplo, que es bastante apretado. Entonces quedamos un poquito de espacio. Y vemos cómo rápidamente hemos creado un efecto, si además a esto le añadimos que desenfoque ese fondo y que nos dé opacidad, pues todavía tenemos otro efecto más interesante, aquí podríamos trabajar con un tono más oscuro, con un tono más claro. Entonces, a partir de ahí siempre vamos a poder crear todo tipo de efecto. Si esto lo combinamos y creamos, por ejemplo, un triángulo. Vamos a copiar, "Ctrl+C" o comando "C", "Ctrl+V", vamos a rotar, y coloreamos de otro color, un tono más verdoso. Vamos a traer al frente. Poco a poco podemos ir consiguiendo diferentos efectos creativos que nos den un resultado mucho más interesante. A partir de ahí siempre dependerá del proyecto en el que estamos trabajando y del resultado que queramos conseguir en cada caso. No necesariamente debemos colorear toda la imagen, sino que simplemente nos podemos limitar a hacer parte de esta imagen. Vamos a ver otro ejemplo rápidamente. Vamos a crear... una línea que vaya cruzando.Entonces, queremos que solamente esa línea sea azul. Vamos a crearle una máscara. Para ello, le decimos que nos cree una máscara a la imagen. Y seleccionando ambos buscamos ese punto de intersección, ese punto que coinciden ambas figuras. Y lo coloreamos del color que queremos, que es un color azulado. Entonces a partir de ahí tenemos total libertad para conseguir cualquier efecto sobre la misma imagen. Aqui obviamente podríamos bajarle la opacidad. Y añadirle un texto. Vamos a suprimir esta de aquí, vamos a subir un poquito más. Y que sea algo más oscuro para que no sea tan agresivo, tan invasor. Entonces aquí podríamos poner: "ANTIGUEDAD". Podemos aplicar rotación y un color blanco. Entonces a partir de ahí tenemos todo tipo de posibilidades: utilizando máscaras, utilizando trasparencias o incluso utilizando desenfoques.

Aprende Experience Design CC

Descubre esta novedosa herramienta que pone Adobe a tu disposición, Adobe XD, para trabajar la experiencia de usuario y todo el diseño UX e UI de tus aplicaciones y webs.

52 min (18 Videos)
Actualmente no hay comentarios.
 
Fecha de publicación:2/12/2016

Este curso video2brain está disponible como descarga y para ser visualizado online. ¡Pero no hace falta que decidas entre las dos opciones! Al comprar el curso, disfrutarás de ambas posibilidades.

La descarga te permite ver las lecciones sin estar conectado/a a internet y supone una navegación fácil y ágil entre capítulo y capítulo. Si vas a trabajar en diferentes ordenadores o si no quieres descargarte el curso completo, entra en la web con tus datos de acceso y disfruta directamente de tus vídeos online. Te deseamos que disfrutes de este curso y te resulte de mucha utilidad.

Estamos a tu disposición si tienes cualquier tipo de duda o pregunta.