Diseño

7 Reglas para entender el diseño y a los diseñadores

por

Si eres diseñador tal vez te interese saber que hay personas preocupadas por la manera que te ve un cliente, la admiración y el valor de tu trabajo, es por eso que Jordi Soro de Ateneupopular, se tomo el trabajo de traducir y convertir a pdf una obra de los señores de harmonie-interieure, encargados de hacer excelentes «diseños murales», y así poder darle el propósito de inculcar las «7 Reglas para entender el diseño y a los diseñadores», algo que como dice Jordi, quedaría muy bien en tu oficina o escritorio.

Enlace para descargar el PDF [MU].

Visto en: www.frogx3.com.

Fuente oficial: Ateneupopular.

Copia A: Corto de Trexel Animation

por

Trexel es un estudio que se encarga a producir increíbles elementos audiovisuales en 3D, con base en Buenos Aires, Argentina hace mas de cinco años.

Copia A es el segundo de sus cortos, creado de forma independiente durante el tiempo libre que quedaba entre los proyectos comerciales de la empresa y emitido en innumerables ocasiones que abarcan el Concurso Caloi en su Tinta (Argentina), 12º BAFICI (Argentina), Loop 2009 (Colombia) y Manlleu Short Film Festival (España), entre otras.

La historia nos muestra a Demódoco, un simpático hombre que sin querer descubre algo maravilloso pero que en su intento por generarlo en exceso, se acerca a un final de consecuencias no tan agradables.

Tanto la imagen, como la animación y la música que lo acompaña son increíbles. Si les gusta y quieren conocer mas sobre la historia y la forma en la que fue creado, el estudio tiene un blog dedicado especialmente a éste corto.

WebPutty, excelente editor CSS en tiempo real

por


WebPutty es una gran herramienta para los diseñadores, ya que se trata de un editor CSS en tiempo real que nos permite editar cualquier código CSS e ir viendo los cambios a medida que los vamos haciendo.

Su simplicidad de uso es lo que me gustó, ya que a medida que hacemos los cambios se van reflejando en la vista previa, además tiene la función de autoguardado, así que no perderemos los cambios si pasa algo malo.

Como si todo esto fuera poco, el sitio también ofrece el servicio de hosting del archivo CSS, con lo cual agregando una simple etiqueta en el head de nuestro sitio estaremos «llamando» a la hoja de estilos cada vez que el sitio cargue, pero lo hará desde los servidores de WebPutty. La ventaja de esto es que el CSS estará comprimido, cargará más rápido y nos ahorrará recursos en nuestro servidor.

Si no les gusta eso de tener el CSS alojado en servidores de terceros no hay problema, sólo tienen que descargar el CSS normal y subirlo a sus sitios como lo harían normalmente.

Este servicio es totalmente gratuito ya que está hecho por diseñadores para diseñadores, así que aprovechen. Mientras tanto les dejo un video demo de la herramienta.

Enlace: WebPutty

Completísima herramienta online para generar texto aleatorio

por

RandomText es una herramienta en línea que nos permitirá de manera sencilla crear textos de todos los sabores que ocupemos, es decir, podremos elegir el número de párrafos, el número de palabras en cada línea, si deseamos crear listas, encabezados… Etc.

A diferencia de otros sitios, RandomText maneja textos un poco más reales, dejando de lado el clásico Lorem Ipsum, aunque si lo deseas, también cuenta con él. Para crear párramos basta con manipular el control que se encuentra en la parte derecha de la pantalla, para finalmente dar click en «Generate», y por último copiar en nuestro proyecto el texto que se ha creado.

Si queremos, podemos acceder a los textos mediante una dirección web que añadiremos a lo que estemos desarrollando, por ejemplo:

http://www.randomtext.me/lorem/ul-7/3-8

En este ejemplo se generará una lista con siete elementos, teniendo cada uno entre 3 y 8 palabras. Para cada cosa que nos ofrece RandomText hay manera de insertarlo mediante una URL, cosa que pueden consultar con más detalle en el sitio.

Web del sitio: RandomText

Visto en: wwwhatsnew

Prefixr hace compatible tu CSS con todos los navegadores

por

Prefixr es en resumen: Una herramienta que nos permitirá hacer compatibles nuestras hojas de estilo con cualquier navegador, sin tener que recordar con detalle las propiedades para cada uno de ellos. Por ejemplo, si quieres añadir la propiedad de transition, pero no recuerdas como se maneja en Opera, no te preocupes, tu sólo sigue las recomendaciones de la W3C y listo, Prefixr se encargará de hacerla útil no sólo para Opera, sino para todos los demás navegadores.

Prefixr es fácil de utilizar, entras a su sitio, copias tu código, das Ctrl + Enter o Prefixize, y listo, tu CSS se ha filtrado y adecuado para, como lo menciono, hacerse compatible con todos los navegadores. Además, puedes seleccionar en cual sí o en cual no, así como pedir que se genere una versión comprimida.

Bastante interesante esta herramienta. Sólo hay que señalar que funciona para las propiedades de CSS3, y que existe una API para utilizarlo desde tu editor de código. Eso y más información lo pueden consultar en el sitio oficial.

Sitio web: prefixr

Visto en: Net.Tuts+

Design Friday: Brushes, texturas y themes

por

Viernes de diseño y Design Friday con los recursos que fueron saliendo esta semana y que pueden ayudarlos en nuevos proyectos.

  • En I Can Be Creative nos muestran themes de WordPress gratuitos que se caracterizan por su originalidad.
  • Noupe publicó mas de 50 generadores CSS ideales para ahorrar tiempo.
  • Por su parte, Premium Pixels ofrece 10 texturas de madera de gran calidad.
  • Blog GoDown recopiló 75 set de iconos sociales variados.
  • Por último, en Brush King podremos descargar 12 pinceles con swirls.

¡Que los disfruten!

Guía de referencia para hacer modificaciones en el tema TwentyEleven

por


TwentyEleven es el nuevo tema por defecto que trae WordPress, y hay que reconocer que es un tema muy flexible y bien realizado, yo lo uso en varios sitios y es muy liviano, consume pocos recursos y carga extremadamente rápido.

A continuación quiero compartir con ustedes una excelente guía de referencia para hacer modificaciones a TwentyEleven, entre las cuales encontramos:

  • Cambiar el tamaño y estilo del título del blog
  • Eliminar espacios en blanco innecesarios
  • Cambiar el estilo de las tipografías del tema
  • Cambiar el tamaño de la imagen del header
  • Cambiar el color de la navegación
  • Cambiar el tamaño del sidebar
  • Cambiar el estilo de los h2 del sidebar
  • Y muchísimas cosas más

Lo bueno de esta guía es que está destinada a los que tengan pocos conocimientos de diseño, ya que nos indica claramente dónde hay que editar el CSS para hacer las distintas ediciones.

Enlace: Modificaciones para TwentyEleven

Big Bang Big Boom: Simplemente una excelente animación

por

Hoy les traigo una excelente animación llamada Big Bang Boom, esta muy bien lograda animación que dura alrededor de 10 minutos, nos trasporta a través de la historia, desde el Big Bang, hasta lo que se podría llamar una muy particular pero realista forma de mandarnos para el carajo a todos:

 

Los encargados de crear esta ingeniosa animación son los artistas de BLU,y logran mediante la mezcla de stop-motion, objetos callejeros, algunas construcciones y dibujos pintados, dar un excelente expresión del inicio y final de nuestros días.

Visto en: Geektual.

Bridge: Corto animado de Ting Chian Tey

por

Tin Tey se dedica hace tiempo al mundo de la animación, especialmente en 3D. Dentro de su currículum nos encontraremos con que trabajo en Sony para Arthur Christmas, película que llegará a Argentina en diciembre de este año.

Bridge es el corto que presentó como tesis en la Universidad y que muestra la historia de cuatro simpáticos personajes que intentan cruzar el mismo tiempo encontrándose con el problema de que solo hay espacio para uno.

Comprobar cómo se ve nuestro sitio en una computadora, tablet, smartphone y TV

por

Lograr que un sitio se vea correctamente en todo tipo de dispositivos es algo realmente complicado, por eso quiero recomendarles una herramienta llamada Screenfly, que nos permite visualizar cómo se vería nuestro sitio web en diferentes tipos de dispotitivos.

Con esta herramienta lo único que tenemos que hacer es ingresar la dirección del sitio que queremos visualizar y se abrirá un nuevo popup con el sitio cargado.

A la izquierda tienen todas las opciones de dispositivos disponibles, entre los cuales encontramos una computadora con Safari en distinta resoluciones, diferentes modelos de tablets, smarthphones de varias marcas y sistemas operativos, y por último una TV en diferentes resoluciones.

Enlace: Screenfly

Visto en WebResourcesDepot