Dos colecciones de iconos gratuitos que vale la pena conocer

Desde que WWWhatsnew.com nació, hace ya casi 8 años, nos hemos preocupado mucho en divulgar recursos gratuitos para la comunidad de diseñadores web. Herramientas pare recibir feedback, aplicaciones para transformar archivos de un formato a otro, sistemas para diseñar mockups y, por supuesto, iconos gratuitos.

Son tantas las veces que hemos comentado este tipo de sitios que ahora recibimos decenas de emails cada semana con recomendaciones de todo tipo relacionadas con los iconos disponibles en la web, y los dos que comentamos hoy valen la pena ser mencionados.

El primero es de elegantthemes.com, una colección donde el color es el protagonista, con 44 obras de arte en 64px, 128px y 256px, en formato PNG y con su fuente en photoshop (PSD).

iconos

La segunda colección es más discreta, disponible en ionicons.com y divulgada recientemente en webresourcesdepot.com, 400 iconos en blanco y negro pensados inicialmente para ilustrar los trabajos realizados con el framework ionic, para desarrollar aplicaciones móviles en HTML5. Se trata de una fuente de iconos, ideal para la programación de sitios web.

fuente de iconos

Por supuesto, podéis navegar entre más recursos de este tipo dentro de la categorí­a de «Utilidades para diseño«, donde seguiremos divulgando todo lo que sea de utilidad para esta cada vez más respetada categorí­a profesional.

Typecast ofrece versión gratuita para usar tipografí­a de Google Fonts

TypeCast

Seguramente los que trabajáis con diseño web ya habéis oí­do hablar de Typecast (typecast.com), la herramienta, adquirida hace un año por Monotype, que nos permite usar varios tipos de letra en un entorno web que nos ayuda a tomar la decisión antes de implantarla en nuestro sitio.

TypeCast no es una plataforma gratuita, es compatible con varios directorios de fuentes y permite de esa forma comparar cada tipografí­a y realizar pruebas de todo tipo, pero hay que pagar después de la etapa de pruebas.

El caso es que se han asociado con Google para permitir el uso de la herramienta siempre que queramos usar las fuentes de Google Fonts. Solo tenemos que abrir la tipografí­a deseada en www.google.com/fonts, elegir una de ellas y pulsar en el enlace «Probar con TypeCast», accediendo así­ a un panel de demostración gratuito que no requiere registro para ser usado.

Desde allí­ podemos utilizar controles para experimentar el tamaño de la fuente, la medida, la lí­nea de altura, diferentes tipos de letra lado a lado en el editor, rellenos, márgenes, sombras, fondos, bordes… son decenas de herramientas disponibles para «jugar» con la letra en busca de la ideal para nuestro proyecto.

Podemos generar un PNG del diseño creado para compartirlo con otros, generar el CSS y HTML necesario para incluirlo en nuestra web, todo sin pagar ni identificarse.

Visually: Nueva versión de su mercado de infografí­as, presentaciones y trabajos creativos

En visual.ly tenemos la posibilidad de navegar por cientos de infografí­as de los más diversos temas, trabajos realizados por miles de diseñadores que ya trabajan con esta plataforma que ha conseguido crecer de forma impresionante en los últimos dos años.

Además de ofrecer infografí­as para su consulta pública, tienen un market que permite a las marcas solicitar trabajos creativos y recibir propuestas de los profesionales que trabajan en Visually, existiendo la posibilidad de que cualquier diseñador de cualquier parte del mundo forme parte de dicho grupo.

Las marcas solicitan los trabajos aquí­, solicitando tanto infografí­as como ví­deos, presentaciones o animaciones interactivas, con precios que varí­an en función de la complejidad de lo solicitado, aunque nunca es menor de 1000 dólares.

Ahora anuncian un nuevo diseño de la plataforma, permitiendo que sea más sencillo solicitar trabajos ví­a web y trabajar ofreciendo el feedback de cada diseño recibido.

visually

Comentan en la presentación que ha han repartido más de 2 millones de dólares entre los diseñadores que trabajan con ellos, con clientes de la talla de Nissan, Nike, Twitter, NBC, P&G, UNESCO, y un largo etcétera, mostrando como este sistema puede funcionar tanto para pequeños como para enormes clientes de todo el mundo.

Para los diseñadores no deja de ser una buena oportunidad para trabajar en grandes proyectos, aunque siempre existe el riesgo de trabajar en una propuesta y perder el tiempo al no verla aprobada.

Para añadir en tu sitio ví­deos de Youtube que adaptan su tamaño automáticamente

embedPublicar un ví­deo de Youtube en un sitio web (sea blog, portal, sitio corporativo o cualquier otro medio) es algo tan sencillo como copiar y pegar el código que se muestra en la parte «Compartir» existente en la sección inferior de cada uno. Podemos elegir el tamaño del mismo para que se adapte al diseño de nuestro sitio, pero… ¿qué pasa cuando nos consultan desde un móvil? ¿o desde un monitor gigante?.

webdesignerwall.com comenta una solución, solución que vimos más tarde en seetio.com. Se trata de una solución que podemos usar alterando la hoja de estilos (.css) de nuestro blog, algo tan sencillo como añadir las siguientes lineas: Continúa leyendo «Para añadir en tu sitio ví­deos de Youtube que adaptan su tamaño automáticamente»

Flowboard, excelente opción para crear presentaciones multimedia desde el iPad

Ya sea que necesitemos realizar una presentación para el trabajo, crear un portafolio creativo en pocos minutos o simplemente buscar una manera divertida de realizar una galerí­a de fotos para los pequeños de la casa, Flowboard es una opción que podemos tener en cuenta.

flowboard

Es una aplicación con una interfaz muy atractiva e intuitiva, que con unos pocos movimientos nos dejará obtener los resultados esperados. Para comenzar, podemos desplegar toda nuestra creatividad comenzando desde cero o podemos escoger algunas de las plantillas que nos presenta la aplicación para crear catálogos, presentaciones, galerí­as, entre otros.

A nuestro proyecto podemos integrar imágenes, enlaces web, videos, texto con opciones para organizarlos o redimensionarlos. Podemos integrar contenido desde diferentes fuentes como por ejemplo, Google, nuestra cuenta en Dropbox, Facebook, Box, Instagram, SkyDrive.

Cada una de las opciones para integrar contenido a nuestra presentación cuenta con diferentes modos de personalización. Por ejemplo, podemos determinar que fuente utilizar en nuestro texto, recortar las imágenes que deseamos subir, obtener una vista previa de los videos para escoger el adecuado, entre otros.

Desde el editor podremos corregir o cambiar cualquier detalle según nuestro criterio o guardar en borrador para una edición posterior. También tenemos opciones para compartir directamente en Twitter, Facebook, correo electrónico o mediante un link que nos proveerá la aplicación.

Flaticon, galerí­a gratuita de más de 14.000 iconos para usar en nuestros trabajos

flaticon

Webmasters, diseñadores, app developers… os recomendamos hoy Flaticon, una amplia (muy amplia) galerí­a de iconos que podremos descargar para utilizar en nuestros proyectos, todos ellos creados por diseñadores profesionales y con iconos también de Freepik, un motor de búsqueda para recursos creativos.

Los iconos no serán en 3D o coloreados en este caso, y la galerí­a se ciñe fuertemente a la estética minimalista ofreciendo dichos iconos en blanco y negro y con un diseño sencillo, como está de moda en la web 2.0. El sitio web nos permitirá buscar los iconos de forma detallada, cosa a agradecer en una galerí­a con más de 14.000 elementos, y podremos buscar los iconos según popularidad, por categorí­as (animales, edificios, flechas, arte, controles, comercio, educación, y unas cuentas más) e incluso por packs según diseño, menú que nos especifica el nombre del diseñador o developer responsable de dichos iconos. Por supuesto, también podemos utilizar el buscador integrado en el sitio web para buscar motivos o sí­mbolos muy concretos.

Adicionalmente, y algo digno de mención, Flaticon ofrece ahora un plugin gratuito para Photoshop para buscar los iconos directamente desde el editor de imágenes, para insertarlos directamente en el lienzo, cosa que nos ahorra tiempo.

Todos los iconos son descargables de manera gratuita, y seleccionando múltiples objetos en la galerí­a podremos hacer clic en el «download» de la parte superior derecha para bajarlos todos a la vez.

Plantilla web en HTML5 gratuita imitando las tarjetas de Google Now

plantilla

Iván Barcia nos presenta una plantilla realizada por él mismo en HTML5 y CSS3 que, imitando el estilo de las tarjetas de Google Now para Android, está disponible de forma gratuita en su web para que podamos bajarla y usarla en nuestros proyectos.

Se trata de un documento que comenzó como un proyecto personal para realizar documentos (manuales), aunque fue tomando forma para un uso general y se decidió desarrollar un manual para ofrecerlo de forma gratuita bajo licencia Creative Commons Attribution 3.0 Unported.

Todo el código HTML y CSS está escrito por mí­, sin partir de ninguna plantilla. Ambos están validados por la W3C. El manual y toda la documentación adjunta está en español, espero poder ofrecerla en mas idiomas pronto.

El diseño puede consultarse desde cualquier dispositivo, ya que se adapta a las diferentes pantallas. Es posible bajarlo desde la web y acceder a una demostración de dicha plantilla directamente desde aquí­.

Esperemos que siga evolucionando y llegue a transformarse en un tema para Wordpress, el diseño lo merece.

Notegraphy, para transformar nuestros textos en obras de arte

Si acostumbráis a escribir textos en las redes sociales y queréis destacar su forma un poco más, os aconsejo echar un vistazo a Notegraphy (notegraphy.com).

Se trata de una aplicación para iOS y web que permite transformar textos en obras de arte, generando estilos de forma automática, como si de filtros de instagram se tratara, para publicar el resultado en redes sociales o en nuestro propio perfil dentro de la aplicación.

notas

Solo tenemos que escribir y seleccionar el formato, eligiendo entre uno de los disponibles. De momento solo se puede ejecutar en iOS y ví­a web, no hay versión Android, pero podemos consultar el resultado de cualquier perfil desde la web, siguiendo y siendo seguidos, de nuevo como en Instagram.

Es por ello que en lifehacker lo llaman «el instagram de los textos», un recurso ideal para quien respeta lo que escribe por encima de todo y quiere dar forma al contenido que muchas veces pierde protagonismo por falta de un poco de «sal» en su presentación. La primera letra de lo que escribimos servirá para diseñar el fondo, el resto podrá mostrarse con diferentes colores y tipografí­as, permitiendo guardar borradores o publicar directamente en nuestro perfil.

Mirad el ví­deo de presentación para que podáis entender mejor sus posibilidades:
Continúa leyendo «Notegraphy, para transformar nuestros textos en obras de arte»

90 iconos, con dos variaciones cada uno, disponibles de forma gratuita en elegantthemes

iconos

Si os encanta navegar en busca de iconos para ilustrar vuestros proyectos, prestad atención a la novedad que acaban de anunciar en elegantthemes.com.

Se trata de una colección gratuita de 90 iconos, cada uno de ellos en color y blanco y negro (180 iconos en total), que ofrecen sin necesidad de registro ni de mencionar al creador de los mismos.

Se distribuyen en formato .ai, .eps, .pdf, y .png (64px y 128px) con licencia GPL, algo común en este sitio, donde no es la primera vez que realizan este tipo de trabajo.

elegantthemes.com es mundialmente conocido por los temas para Wordpress que desarrollan, temas de muy alta calidad que ofrecen con una frecuencia relativamente alta. Es posible pagar una licencia anual como desarrollador y tener acceso a todos los trabajos que han realizado, bajando tanto los temas como las plantillas en photoshop responsables por el diseño.

Minions ipsum, generador de texto en el idioma de los minions de Mi villano favorito

minions ipsum

Lorem ipsum es un estándar de relleno de texto con palabras en latí­n el cual se suele utilizar desde hace cientos de años en las imprentas y en el último siglo en la Internet, siendo posible conseguir varios párrafos de texto de este tipo desde lipsum.com. Pues bien, Minions ipsum funciona de igual manera, ya no en latí­n sino en el idioma de los minions, ese «enriquecido» idioma que suelen usar los protagonistas amarillos de Mi villano favorito. Así­ luce un fragmento del texto generado:

Pepete butt aaaaaah poulet tikka masala. Daa bananaaaa poopayee uuuhhh jiji uuuhhh pepete daa tank yuuu! Bappleees. Potatoooo poulet tikka masala po kass underweaaar BEE DO BEE DO BEE DO poulet tikka masala bappleees hahaha tulaliloo chasy.

Al igual que en lipsum.com, la idea es generar un determinado número de párrafos aleatorios según se necesiten. Para esto basta con seleccionar tal número con el botón «Paragraphs», y luego pulsar en «Bananaaa!!!» o en «Gimme latin» (combinación de latí­n con idioma minion) para que se genere en la caja de texto de la parte derecha. Restará copiarlo y pegarlo en el lugar que se requiera.

En fin, luego del excelente Quijotipsum, un generador de texto tipo lorem ipsum citando fragmentos de don Quijote de la Mancha, muy interesante por estar en español, aparece en la red este curioso pero útil recurso que servirá a diseñadores y programadores para rellenar las secciones de texto de sus bocetos.

Enlace: Minions ipsum