Contenidos
Imágenes de Google
Este ejemplo utiliza una característica tipográfica llamada ligaduras, que permite la representación de un glifo icono simplemente utilizando su nombre textual. La sustitución la realiza automáticamente el navegador web y proporciona un código más legible que la referencia de caracteres numéricos equivalente.
Encuentre los nombres de los iconos y los puntos de código en la biblioteca de iconos de material seleccionando cualquier icono y abriendo el panel de fuentes de iconos. Cada fuente de iconos tiene un índice de codepuntos en nuestro repositorio git que muestra el conjunto completo de nombres y códigos de caracteres (aquí).
Estos iconos fueron diseñados para seguir las directrices de diseño de materiales y se ven mejor cuando se utilizan los tamaños y colores de iconos recomendados. Los estilos que aparecen a continuación facilitan la aplicación de nuestros tamaños, colores y estados de actividad recomendados.
El uso de la fuente de los iconos permite estilizar fácilmente un icono en cualquier color. De acuerdo con las directrices sobre iconos del Material Design, para los iconos activos recomendamos utilizar el negro con una opacidad del 54% o el blanco con una opacidad del 100% cuando se muestren sobre fondos claros u oscuros, respectivamente. Si un icono está desactivado o inactivo, utilice el negro al 26% o el blanco al 30% para fondos claros y oscuros, respectivamente.
Icono de imagen
¿Busca iconos para animar su presentación de diapositivas? ¿O para su tarjeta de visita? ¿Algún artículo de papelería que necesite ser mejorado con iconos? Estás de suerte porque en Internet no faltan activos de imagen gratuitos. Los necesitas sobre todo si eres diseñador de páginas web o de aplicaciones, o si eres desarrollador.
Sin duda, es una tarea dolorosa diseñar algunos elementos desde cero. Así que puedes considerar aprovechar los enormes recursos disponibles gratuitamente en Internet. A continuación, hemos elaborado una lista con los 20 mejores sitios web para descargar iconos gratis para facilitarte las cosas.
Una advertencia: La mayoría de estos iconos gratuitos que se pueden descargar de los siguientes sitios web requieren la atribución al creador y se distribuyen bajo varios tipos de licencia. Así que asegúrate de comprobarlas primero.1. Flaticon
Flaticon tiene la mayor base de datos de iconos vectoriales gratuitos de Internet, con más de 70.000 iconos en su sitio. Los iconos en Flaticon vienen en formatos SVG, EPS, PSD y PNG en diferentes tamaños de su gusto.
Icono de búsqueda de imágenes de Google
Como herramienta de baja fidelidad, las imágenes grandes pueden ser más lentas de cargar, utilizar más espacio en el disco y aumentar el tamaño de los archivos del proyecto. Las imágenes muy grandes pueden causar problemas de manejo al editarlas. Al añadir imágenes a su proyecto, podemos reducir el tamaño de las imágenes de varias maneras:
Añadir imágenes en la vista de WireframesComo se ha mencionado anteriormente, al arrastrar una imagen desde el ordenador al editor se añadirá al lienzo. Al hacer esto, la imagen se colocará en el wireframe seleccionado y se copiará el archivo de imagen en sus Activos para que pueda reutilizarlo fácilmente en otros wireframes.
Si aún no tienes una imagen lista o quieres usar una imagen de marcador de posición para mantener tu wireframe de baja fidelidad, puedes añadir un control de Imagen de la Biblioteca de la UI y se mostrará como una caja con una ‘X’ a través de ella. Más tarde puede sustituirlo por una imagen utilizando las propiedades de la imagen descritas anteriormente.
Una vez que una imagen ha sido añadida a su proyecto, se mostrará en la biblioteca de la interfaz de usuario para que pueda añadirla fácilmente a cualquier estructura de su proyecto. La categoría “Activos” mostrará todas las imágenes que hayas añadido a tu proyecto.
Búsqueda por símbolos de imagen
Los nuevos iconos indican si la imagen en la que se hace clic lleva a una página con productos a la venta, a una página con recetas o a un contenido de vídeo. Parecen pequeños y discretos a primera vista, pero al pasar el ratón por encima de ellos se muestran las etiquetas al completo, incluso la duración del vídeo. Aunque la incorporación de los iconos no es un gran cambio, podría facilitar la búsqueda entre cientos de resultados y encontrar lo que se busca. Si, por ejemplo, estás haciendo una búsqueda de imágenes para encontrar un producto en particular para comprar, puedes simplemente ver todas las fotos marcadas con la etiqueta del producto.