volver a SuperCSS
SuperCSS

SuperCSS #69

# Newsletter sobre diseño web en español #

Bienvenid@ al número #69 de SuperCSS.

“Deja de escribir código, empieza a dibujarlo” así es como se presenta la nueva herramienta para diseño web Macaw.

Con un diseño intuitivo, imitando un editor de imágenes y una curva de aprendizaje muy sencilla, esta aplicación promete convertirse en la favorita de muchos de nosotros a la hora de crear prototipos de sitios web.

Su principal característica es el código HTML y CSS que genera, en muchos casos mejorando el que crearíamos nosotros mismos, gracias a la “magia” de su motor de diseño en tiempo real llamado Stream.

Personalmente, tiene un pequeño gran defecto y es que no trabaja en “Mobile First” (lo hace en “Desktop First”), pero sus creadores ya han anunciado que en próximas actualizaciones será corregido.

Hasta el próximo número!

Articulos & Tutoriales

 

Como añadir o quitar clases CSS con HTML5 classList API

www.nosolocss.com

Tutorial sobre como añadir, quitar, conmutar, o comprobar si una clase CSS existe usando la API classList de HTML5.

Animaciones CSS3 al fin del ciclo

www.csslab.cl

La propiedad CSS3 animation-fill-mode cumple un papel esencial cuando estamos trabajando con animaciones CSS3. Nos permite indicar cómo debe aplicarse una animación CSS al elemento antes y después que se ejecute.

Cargar solo iframe de Youtube cuando el usuario pinche en la miniatura del vídeo

hoyheaprendido.es

Pequeño truco para evitar tener que cargar un iframe de Youtube y solo hacerlo cuando el usuario haga click en la miniatura del vídeo.

Diseño de Experiencia de Usuario: etapas, actividades, técnicas y herramientas

nosolousabilidad.com

Un repaso a la metodología para afrontar el diseño de experiencia de usuario, integrando conceptos y enfoques de la arquitectura de información y el diseño de interacción.

Guía de Google Webmaster Tools

www.40defiebre.com

Guía para aprovechar al máximo todas las herramientas y funciones de Google Webmaster Tools en tu blog.

 

Inspiración

 
World of SWISS
World of SWISS
Wolf 25
Wolf 25
Kickdrop
Kickdrop
Maria Elena Benetti
Maria Elena Benetti
Superlovers
Superlovers
150 Pixels
150 Pixels
 

Recursos

 
Velositey: prototipos en Photoshop

Velositey: prototipos en Photoshop

Velositey es una extensión gratuita para Photoshop CS6+ que permite crear prototipos de forma muy rápida.

 
Enjoy CSS: Generador de código CSS3 online

Enjoy CSS: Generador de código CSS3 online

Si quieres divertirte y a la vez aprender un poco más sobre CSS3, prueba esta aplicación online que genera el código a través de una interfaz gráfica muy intuitiva. Dispone también de una galería con diferentes ejemplos listos para descargar y usar!

 
Capptivate.co: patrones de animación iOS

Capptivate.co: patrones de animación iOS

Capptivate.co recopila ejemplos de patrones de interacción y animaciones para aplicaciones en iOS.