jQuery para diseñadores

video2brain-jquery

Una de las cosas en las que más empeño pongo es intentar no quedarme demasiado desactualizado. Lo considero algo vital en un mundillo en el que hay que mantener un ritmo constante de aprendizaje a menos que tengamos las cosas bien resueltas el resto de nuestra vida profesional o no veamos cómo ha cambiado el panorama laboral durante estos últimos años.

Me encantaría ponerme con más cosas (sigo teniendo Cinema4D como asignatura pendiente) pero se me hace casi imposible actualmente. Prefiero centrarme en cosas que sé que me van a aportar una mejoría directa en lo que suelo toquetear habitualmente. Y peleando con tanto proyecto web uno de los palos a tocar fue, cómo no, jQuery.

Me animé a preparar un curso de introducción a jQuery con la misma idea en mente que la que me motivó a hacer el de WordPress: abrirle la puerta a los novatos en la materia, dar los primeros pasos con ellos y generar la suficiente curiosidad como para que ellos sólos siguieran investigando. Como he hecho yo. Curiosamente y tras más de dos años, ese curso sigue siendo uno de los más exitosos y es una enorme alegría el saber que funcionara tan bien.

Mi objetivo con este curso de introducción a jQuery para diseñadores ha sido crear un buen acompañante durante los primeros pasos del usuario. Está enfocado de una manera muy sencilla, con ejemplos que creo que son muy fáciles y perfectamente entendibles para los neófitos en la materia.

Es un curso corto, de casi 2 horas en total para empezar a perder el miedo y de paso descubrir unos cuantos plugins bien majos para vitaminar nuestros proyectos.

Si os pica el gusanillo, el linkito para ver los cursos disponibles y más información sobre mis cursos:

Formación online video2brain

PD: La guinda del pastel es “jQuery Trickshots [en]“, un ebook bien majo y barato sobre técnicas y trucos con jQuery.

CreateJS – librerías javascript para hacer un poquito de todo

Create JS

Aunque confieso que no sé determinar si son la mejor opción a día de hoy, me topé con CreateJS y me pareció un buen recurso a destacar para la creación de contenido interactivo y web apps mediante HTML5. De hecho hay unos vídeos en la web de Adobe mostrando la combinación de trabajo de su toolkit con esta suite JS.

CreateJS se compone de diferentes librerías especializadas para trabajar con efectos de movimiento o tweens, precarga, exportación de contenido en formato swf, etc… La verdad es que tiene buena pinta. Si alguno lo ha llegado a probar, agradecería que nos comentara la experiencia 🙂

CreateJS [en]

Turn.js, Efecto pageflip ahora en HTML5

Turn.js

Y llegó. El famoso efecto de paso de página del que tanto se ha hablado por aquí ya es una realidad empleando HTML5. Se lo he visto al amiguete de Elad y aunque confieso que apenas lo he mirado, parece que tiene muy buena pinta para los que usamos la pezuña y no la cabeza para meternos con código.

Turn.js [en]

PD: Como guinda del pastel también tenéis disponible en formato jQuery un completo efecto pageflip que además es responsive, por lo que se adaptará a diferentes dispositivos. A un precio bien majo 🙂 Pageflip responsive con jQuery

Learning jQuery in 30 days

Colgaba en Facebook un enlace que me había pasado qmarcos y en el que se nos ofrecía a todos la posibilidad de aprender jQuery en 30 días.

Cada día, una nueva lección en formato vídeo. Tras 30 días prometen el milagro 😉 Supongo que la idea es muy similar a lo que ofrecen en Codeacademy [en] y la idea es muy golosa para aquellos que nos gusta meter la pezuña un poco en el código.

Aunque el día 1 de Enero ya quedó atrás, aún no es tarde para iniciar un nuevo propósito para el 2012, ¿no?

Learning jQuery in 30 days [en]

DropKick – a jQuery plugin for beautiful dropdowns

DropKick

Preguntaba hace no mucho en Twitter por alguna librería javascript para “tunear” elementos de formulario como los dropdowns. Hasta el momento ya conocía alguna como Uniform [en] pero no ofrecía el grado de personalización necesaria.

El bueno de Marcio Barrios sugirió una solución que a priori tiene muy buena pinta: DropKick. Este plugin jQuery permite modificar la apariencia al completo, con lo que el grado de “tuneo” es mayor que Uniform. Y como quizá alguno llegue a necesitar algo parecido, aquí va el linkito:

DropKick [en]

Olvídate del Powerpoint definitivamente gracias a Impress.js, Speaker Deck,Scrollorama o Scrolldeck

Speaker Deck

Como llevo unos días pululando por Slide Share me picó la curiosidad por ver cómo estaba el “mercado” de servicios destinados a mejorar la presentación y creación de… presentaciones (valga la redundancia).

Speaker Deck [en] era un servicio ya conocido por un servidor y se nota que los que la usan por lo general se toman su trabajo en serio. Basta ver que visualmente las presentaciones son bastante atractivas. Si pasáis el ratón por encima de las miniaturas veréis que podéis acceder rápidamente a una diapositiva en concreto.

Pero ha sido Nano Trías quien me ha descubierto nuevos ejemplos que añadir a la lista, con el extra de que las presentaciones se basan puramente en código HTML y efectos javascript en el navegador. Es el caso de Scrolldeck [en] o impress.js [en] por citar las que más me han gustado. Aunque también está Scrollorama que se podría aplicar perfectamente.

Evidentemente su uso al principio no sería tan sencillo como abrir el Keynote o el Powerpoint pero le añade un extra de “awesomidad” a la presentación, ¿verdad? Ale, a trastear con ello!

jQuery Masonry

El otro día estaba en el estudio buscando cosillas y llegué de casualidad hasta jQuery Masonry:

Masonry is a dynamic grid layout plugin for jQuery. Think of it as the flip-side of CSS floats. Whereas floating arranges elements horizontally then vertically, Masonry arranges elements vertically, positioning each element in the next open spot in the grid. The result minimizes vertical gaps between elements of varying height, just like a mason fitting stones in a wall.

Como una imagen vale más que mil palabras echadle un ojo a un ejemplo [en] y probad a redimensionar la ventana. Todo un recurso de gran utilidad que va para la saca. Y ojo con su creador, David DeSandro [en] porque tiene otros proyectos que también vale la pena explorar.

jQuery Mansonry [en]

The Hello Bar – una barra de avisos para tu web

Hello Bar

Hace un tiempo estuve probando un nuevo servicio web que aparecía aquí como una pequeña barra en la zona superior (o un pequeño tirador con una flecha). El servicio se llamaba The Hello Bar y te permite crear notificaciones de una manera super sencilla y, lo más interesante, comprobar la efectividad del servicio mediante su sistema de tracking.

El servicio viene en diferentes sabores en función del pago mensual. La versión de prueba te deja emplear el sistema durante un par de semanas, tiempo más que suficiente para ver si te merece la pena emplearlo profesionalmente.

Si no recuerdo mal creo que se puede registrar cualquiera o al menos solicitar una invitación. Si os pica la curiosidad tengo unas cuantas invitaciones directas por lo que sólo tendréis que pedirlo 🙂

The Hello Bar [en]

CatsWhoCode

CatsWhoCode

CatsWhoCode no es una web de diseño sino que se enfoca claramente a la parte de desarrollo y código. La pongo porque la leo desde hace bastante y me parece bastante útil a pesar de que sea de esas webs que parece que sólo saben hacer recopilatorios…

Encontraréis artículos bastante potables (en función de vuestro conocimiento claro) como 10 super useful PHP snippets [en] o los chorrocientos que dedica a WordPress.

CatsWhoCode [en]

Scriptographer

Scriptographer

Nos contaba Cristóbal hace poco que había descubierto un añadido para Illustrator llamado Scriptographer. Yo estoy bastante pez en el programa. Sé utilizarlo y lo empleo correctamente pero estoy seguro que tiene muchísimas más posibilidades de las que yo utilizo. Y este tipo de añadidos es una de esas cosas que hacen que te des cuenta de ello.

Scriptographer te permite generar nuevos efectos a partir de objetos ya creados o mismamente desde un lienzo en blanco, empleando Javascript. No parece complicado de usar si nos limitamos a lo que la comunidad nos ofrece en forma de scripts porque yo de JS ni idea.

He visto algunos efectos bastante interesantes y os paso el linkito por si no lo conocíais.

Scriptographer [en]