Como desarrolladores web, diseñadores o creativos, en algunas ocasiones nos podemos quedar cortos de ideas o sin inspiración alguna. Con el objetivo de superar este problema, en la edición de este mes encontraremos ideas y recursos de toda clase.
Aquí os dejamos con iconos, fuentes, elementos en SVG para descargar, diseños en PSD y mucho más para hacer nuestro trabajo más fácil.
Ampliamos la lista de sitios web desde donde es posible obtener iconos gratuitos, y lo hacemos con iconstore.co, una web desde donde es posible navegar por categorías de todo tipo en busca de iconos desarrollados por profesionales del diseño, autores que han publicado el contenido de forma gratuita pidiendo, en algunos casos, una donación voluntaria.
Esta recopilación de iconos ha estado entre las primeras posiciones durante los últimos días en producthunt, donde hay una lista de webs semejantes ideales para quien busca iconos de buena calidad y disponibles sin coste. Dicha lista está disponible en este enlace.
Los iconos de iconstore están disponibles en formato vectorial, con extensión PSD, SVG, PNG.. depende de la colección seleccionada y del autor que haya publicado el contenido.
Hoy tenemos una nueva colección con algunos de los mejores recursos que hemos encontrado recientemente en todos los rincones de la Web. Estás a punto de sumergirte en docenas de fuentes, iconos, plugins, herramientas de diseño y mucho más. Lo mejor: ¡todo gratis! Así que adelante, disfruta y deja que tus colegas también lo hagan compartiendo esta serie.
Para todo tipo proyectos, particulamente, los que se realizan para la web, hace falta disponer de buenos catálogos gráficos de alta calidad. Por tal motivo, hoy compartimos algunos de los más interesantes buscadores de iconos gratuitos y de libre uso que son recomendados por los profesionales de ElegantThemes, y que se pueden usar de inmediato gracias a su disponibilidad también online:
Alrededor de 70.000 iconos vectoriales gratuitos, en formatos SVG, EPS, PSD y PNG, con la posibilidad de obtenerlos tanto en descarga directa como directamente en Photoshop, Illustrator y After Effects (a través de una extensión). Por si fuera poco, pueden usarse hasta como fuentes web.
PNG y SVG son los formatos que contempla esta colección de elegantes iconos en calidad vectorial, más de 2.000, organizados por categorías rápidas. Puedes descargarlos y usarlos en proyectos personales y comerciales, incluso sin enlaces de atribución, pero antes debes revisar algunas condiciones dadas en su licencia.
Aunque hay varias restricciones para varias de las elegantes colecciones de coloridos iconos que en dicho buscador se encuentran (atribuciones, licencias Creative Commons, prohibición de uso comercial en algunas pocas, etc.), en general, el material disponible puede ser ocupado en proyectos personales y profesionales de todo tipo sin mayor impedimento.
Un referente en el sector con ya casi medio millón de iconos indexados y alrededor de 7.000 colecciones de ellos. Aunque se cuentan los iconos de pago con los gratuitos, de este último tipo hay por montones y se puede acceder rápidamente a ellos a través de los útiles filtros (incluyendo uno por licencias) que se presentan junto a la sección de resultados. Una interesante característica es que con solo un botón se puede elegir a gusto su color de fondo (blanco, negro, gris o transparente).
Finalmente tenemos a freepik, un servicio online que entre otros recursos gráficos (imágenes vectoriales, archivos PSD y fotos) presenta con cada búsqueda un buen manojo de iconos listos para su descarga y uso. Son más de 40.000 iconos gratuitos y de cada uno se comparte su debida licencia, además, se muestra una organización también por categorías: Clima, transporte, medicina, señales, herramientas, etc.
Disponible para bajar de forma gratuita en boxerapp.com, hace posible ejecutar juegos DOS sin complicarse la vida con configuraciones complejas. Solo tenemos que arrastrar el juego en el emulador y empezar a jugar inmediatamente.
Es posible decorar los juegos con iconos especialmente diseñados por Boxer (de hecho la empresa responsable, 40watt, es especialista en la creación de iconos), así como crear una colección de juegos personalizando su apariencia.
Boxer usa DOSBox, por lo que es compatible con prácticamente cualquier juego DOS que tengáis en el disco duro.
En su última versión nos permite guardar capturas de pantalla usando atajos de teclado, adelantar las introducciones de los juegos, copiar y pegar texto desde OS X a cualquier programa DOS, usar un disco externo y permitir que se recuerde la unidad usada… trabajan constantemente para solucionar problemas y añadir funcionalidades, por lo que parece ua gran apuesta.
Se trata de urlauncher.com, solución bastante conocida, con más de 1 millón de instalaciones, que ofrece en la barra lateral un acceso para todas las aplicaciones recientes, así como una barra de búsqueda para encontrar todo lo que necesitamos. Esta solución también es conocida por su catálogo de temas y fondos de pantalla interactivos en HD y 3D, lista que han ampliado hace pocos días.
En el buscador solo tenemos que escribir una letra y obtener los resultados de lo que más usamos, ya sean aplicaciones, contactos o resultados web. Han incluido una sección de «Ajustes inteligentes» para optimizar cada mood, siendo posible ajustar wifi, bluetooth, vibrador, entre otros para que cada tema tenga unas funciones u otras activadas.
Además de los fondos, también tienen iconos personalizados, por si os cansa ver siempre los mismos en vuestro teléfono.
Si estamos trabajando en un proyecto sobre el que hemos pensado incluir sencillos iconos que dispongan de sombreados planos, FlattyShadow es un interesante editor de iconos que nos ofrece miles de iconos a escoger y usar de manera gratuita. Una vez tengamos los iconos sobre los que queremos trabajar, podemos modificar sus colores y sus intensidades en lo que respecta a los fondos, sombras y los propios iconos, seleccionar entre los tres tipos de formas y realizar modificaciones, así como variar la profundidad y ángulo de las sombras, pudiendo además modificar la posición de los propios iconos. Además, también podemos seleccionar los tamaños para los fondos como para los propios iconos de entre la relación de tamaños que tenemos a nuestra disposición.
Debemos tener en cuenta que podemos seleccionar y deseleccionar los iconos escogidos, de modo que los cambios que realicemos sobre cada una de las propiedades, se aplicarán simultáneamente sobre aquellos iconos que tengamos seleccionados para trabajar.
Una vez hayamos finalizado la edición de los iconos, como diseñadores podemos descargar las imágenes para aplicar a nuestros proyectos, aunque en caso de que seamos desarrolladores web, podemos optar por descargar el código fuente resultante, obteniendo los archivos JS y CSS correspondientes. En ambos casos, nos bajaremos los archivos en un archivo comprimido .zip.
FlattyShadow está disponible para su uso de manera gratuita y sin necesidad de realizar registros de usuario.
Aquí tenéis hoy 1500 iconos llenos de color y estilizados de acuerdo al ya famoso (aunque aún muy reciente) diseño ‘Material’ impuesto por Google. Este concepto se caracteriza por tener marcadas similitudes al estilo ‘flat’, al menos a simple vista, pero viéndolo mas a detalle veremos ciertas especificaciones que le dan a esta iniciativa una identidad propia, lo cual se hará más evidente una vez analices los iconos.
Se encuentran disponibles en tres formatos diferentes (SVG, AI y PNG, siempre en forma vectorial para los dos primeros) y pueden ser utilizados para una gran variedad de proyectos, gracias a la inmensa cantidad de elementos, 1500, lo cual le otorga a esta colección una versatilidad envidiable.
He aquí algunas características de esta compilación:
– Estilo ‘Material’ de Google. – Disponibles en tres formatos para diferentes usos en proyectos (SVG, AI y PNG). – Llenos de color y vida, utilizando la paleta de colores estipulada por Google. – 1500 elementos disponibles. – Acorde a todas las especificaciones técnicas dadas por la compañía del buscador. – Perfecto para acostumbrarse a esta nueva idea en diseño, las capas en los archivos de Illustrator pueden ser de gran ayuda.
Hoy traemos un paquete gigante de recursos que te ayudarán en cualquier proyecto que emprendas, ya sea en el campo del diseño o el del desarrollo web. Cabe la posibilidad de que te insteresen ambos, ¡así que mucho mejor! Aquí encontrarás todo tipo de elementos: desde archivos PSD, pasando por íconos, temas de WordPress, fuentes, artículos sobre CSS, librerías de JavaScript… en fin. Una cantidad enorme de herramientas para facilitarte la vida y poner un par de trucos extra bajo tu manga.
Hay muchas aplicaciones creadas para facilitar la generación de un favicon para web, pequeño icono que aparece al lado de la url en el navegador. Solo hay que subir la imagen, editarla y salvarla como favicon.ico antes de subirla a la raíz del sitio.
De entre todas las opciones, vemos ahora una nueva alternativa que permite también crear iconos para dispositivos móviles y para Windows 8: realfavicongenerator.net, un generador de iconos adaptado al mundo móvil.
Se trata de una aplicación que, sin necesidad de registro, permite que subamos una imagen y seleccionemos el tipo de trabajo que vamos a realizar. En caso de editarlo para favicon, obtendremos el código HTML y las imágenes necesarias para incluirlo en nuestra web, trabajos que se verán de forma diferente en función del dispositivo desde donde estemos consultando la página.
Así es, la mayoría de los generadores de iconos solo crean un archivo que se ve bien desde el navegador de escritorio, pero no piensa en lo que ocurrirá cuando se visualice desde otras plataformas.
Este es un ejemplo de lo que ocurre cuando se usa otra opción y cuando se usa realfavicongenerator:
Como veis, el código que obtenemos permite que el resultado se vea bien desde cualquier sitio (columna derecha), algo que no ocurre cuando generamos el favicon de forma tradicional.
Hay muchas aplicaciones creadas para facilitar la generación de un favicon para web, pequeño icono que aparece al lado de la url en el navegador. Solo hay que subir la imagen, editarla y salvarla como favicon.ico antes de subirla a la raíz del sitio.