Construct 2: Crea juegos HTML5 sin saber programar

Si te has pasado la vida culpándote por no haber prestado atención en aquellas clases de programación, cierra la válvula de escape de tu opresión y ponte ya mismo en proceso de creación. El rap del desarrollador de videojuegos culposo está de nuevo para presentarte Construct 2, una herramienta de Scirra para crear juegos HTML5 sin saber programar nada de nada. Sólo tienes que tener la suficiente inteligencia para arrastrar cosas y darles parámetros de movimiento, el resto es sólo imaginación. Y la necesitarás, pues si tu juego es muy bueno, Scirra da posibilidades de venderlo.

Construct 2: Crea juegos HTML5 sin saber programar
Ver articulo completo: Construct 2: Crea juegos HTML5 sin saber programar

Cookies.js es una pequeña biblioteca JavaScript para la manipulación de cookies de forma sencilla. Como virtud de la biblioteca podemos destacar que parsea automáticamente las cadenas en formato JSON, algo que otras alternativas similares no hacen y que resulta sumamente útil a la hora de interactuar con otros sistemas.

La biblioteca es extremadamente liviana, apenas 1 KB en su versión simplificada y comprimida con gzip. Además esta testeada en los navegadores más utilizados del mercado, en la documentación oficial podemos encontrar soporte para: Chrome, Firefox 3+, Safari 4+, Opera 10+ e Internet Explorer 6+.

Para los navegadores más modernos la biblioteca no tiene dependencias, no obstante para las versiones más antiguas necesita de dos funciones para la correcta interpretación de JSON: JSON.parse y JSON.stringify.

Ejemplo de uso:

// Setting values of various data types
Cookies.set('string', 'value');
Cookies.set('number', 123);
Cookies.set('array', [1, 2, 3]);
Cookies.set('object', { hello: 'world' });

// Chaining sets together
Cookies.set('string', 'value').set('number', 123);

// Setting cookies with additional options
Cookies.set('string', 'value', { domain: 'www.example.com', secure: true });

// Setting cookies with expiration values
Cookies.set('string', 'value', { expires: 600 }); // Expires in 10 minutes
Cookies.set('string', 'value', { expires: '01-01-2012' });
Cookies.set('string', 'value', { expires: new Date(2012, 0, 1) });

// Using the alias
Cookies('array', [1, 2, 3], { secure: true });

Cookies.js es una biblioteca genial para facilitarnos la manipulación de Cookies del lado del cliente, algo que no es tan sencillo de forma nativa utilizando solo JavaScript.

Alternativa: Gestión de Cookies con jQuery

Muchas veces vemos cuentas regresivas en sitios que están a punto de lanzar nuevas versiones, o bien cuando estamos a punto de presenciar un gran evento. Crear estas cuentas regresivas no es nada complicado con JavaScript, no obstante si lo que buscamos es una cuenta regresiva animada y que sea atractiva visualmente, entonces jQuery Countdown puede ser lo que estamos buscando.

jQuery Countdown es un plugin jQuery, gratuito, que nos permite instalar una cuenta regresiva con apenas unas lineas de código. Y que a diferencia de otras cuentas regresivas cuenta con un diseño de lo más atractivo.

La cuenta regresiva se visualiza de la siguiente manera:

cuenta regresiva animada con jQuery

Pueden ver una demostración online directamente desde el sitio oficial del proyecto dentro de Google Code.

Ejemplo de uso:

  $('#counter').countdown({startTime: "01:12:32:55"});

Ejemplo más avanzado:

  $('#counter').countdown({
    stepTime: 60,
    format: 'hh:mm:ss',
    startTime: "12:32:55",
    digitImages: 6,
    digitWidth: 53,
    digitHeight: 77,
    timerEnd: function() { alert('end!!'); },
    image: "digits.png"
  });

Para los más preocupados por el rendimiento, el plugin solo tiene como dependencia el framework jQuery, luego la biblioteca completa tiene un peso despreciable de apenas unos 1.7 KB.

El proyecto se encuentra liberado bajo licencia Apache 2.0, lo que nos da un muy buen nivel de libertad para su uso :D

Web: jQuery Countdown ~ Via: Webappers

Como los lectores habituales sabrán muy bien, me gustan mucho los experimentos realizados con CSS3. En esta ocasión capto mi atención este fantástico proyecto en donde crearon un reloj analógico totalmente funcional utilizando CSS3 y sin una sola linea de código JavaScript.

Lo increíble del proyecto, y a la vez ingenioso, es que el creador de este reloj analógico animado utilizo solo unas pocas propiedades de CSS3 para desarrollar este reloj que funciona perfectamente, principalmente hizo un uso intensivo de dos propiedades: transform y animation.

El resultado final, un reloj que si bien es muy simple y minimalista desde lo gráfico, funciona perfectamente:

Reloj Analógico CSS3

Demostración online.

Dudo que este reloj tenga una utilidad real, no al menos como recurso web, sin embargo a nivel educativo es muy interesante analizar como el autor con muy pocas propiedades logro evitar el uso de JavaScript, lenguaje que se utiliza de forma histórica para este tipo de desarrollos.

Web: Analog Clock with Pure CSS3

El año pasado, Isabel compartió con ustedes una colección de plantillas de curriculum vitae donde incluía algunos cuantos ejemplos disponibles en ese momento para realizar sus propios CV sin demasiadas complicaciones y logrando un resultado atractivo para presentar en cualquier trabajo potencial.

En este caso y luego de algunas publicaciones individuales de CV que hemos hecho a lo largo de este año, me encuentro nuevamente con una excelente opción gráfica para presentar nuestro trabajo de forma simple y concisa, destacando habilidades y por supuesto intentando siempre atraer la vista de quien lo recibe.

Este diseño se destaca por la efectividad de comunicación de la información, en una sola hoja, podrán colocar todo lo concerniente a su carrera profesional y la experiencia a través de espacios concretos bien diferenciados.

Vista previa de CV con detalles verdes en PSD

Descargar CV Resume Free PSD | FreePSDFiles

También, y como no puede ser de otra manera en esta época, hay un espacio destinado a la inclusión de perfiles en redes sociales variadas, allí verán ustedes cuáles son las que resultan útiles para mostrar su perfil y cuáles no. Con esto me refiero a que si se dedican a la animación, probablemente sea una buena idea incluir su cuenta en Vimeo para que el consultor tenga acceso a él y vea la calidad de su trabajo.

La plantilla se encuentra diseñada en Photoshop, con muy pocos pasos pueden cambiar tipografías y colores, aunque no recomendaría cambiar los espacios ya que se encuentran bien delimitados y desequilibrarían la página. Obviamente, queda a criterio de ustedes y la forma en la que desean presentarse. La única falla que veo es que no posee espacio para una fotografía, algo que suele requerirse en los trabajos. Por lo demás, creo que es un buen recurso para guardar y tener en cuenta.

elFinder es un proyecto open-source para ser utilizado como un gestor de archivos online. Esta escrito en JavaScript usando jQuery UI para el desarrollo de la interface, y su nombre no es casualidad ya que se encuentra inspirado en el Finder de Max OS X.

Los requerimientos de instalación son de lo más sencillos, tan solo necesita un navegador web moderno. Esta completamente testeado en Firefox 10+, IE 8+, Safari 5, Opera 11 y Chrome 15+. Del lado del servidor no hay demasiada ciencia, funciona en cualquier servidor web que tenga instalado una versión de PHP 5.2 o superior.

Así se ve el gestor en todo su esplendor:

administrador de archivos jQuery

Algunas de sus características principales:

  • Funcionan todas las operaciones básicas, incluso en servidores remotos.
  • Permite la creación y extracción de archivos (zip, rar, 7z, tar, gzip, bzip2).
  • Calcula el tamaño no solo de los archivos sino también de los directorios.
  • Menú contextual que brinda funciones básicas y útiles.
  • Miniaturas para imágenes.
  • Interface muy liviana.
  • Atajos de teclado.
  • Vistas con listas e iconos.

Les recomiendo visitar la web del proyecto para recibir más información sobre sus distintas formas de instalación. Inclusive encontraran un apartado en donde se indican distintas metodologías para su instalación en distintos entornos como Ruby on Rails, Django y muchos más.

Web: elFinder

Sígueme en Spotify
(c)2011 Mariano Rico Madrid Corporation copyrights