Category: Herramientas

Categories
Google Herramientas

Google+ lanza su esperada API

Hoy Google lanzó lo que muchos desarrolladores estaban esperando con ansias,
por fin tenemos el API de Google+.

Después del lanzamiento de Google+ y la avalancha de curiosos que quisieron probarlo, la red social ha tenido un bajón grande en estos últimos meses. Esto se debe mas que nada a la monotonía de publicar "manualmente", y la falta de integración de productos como Google Reader.

Lo único que hizo que Google+ no se caiga totalmente fue la introducción de los juegos que en un primer momento también tuvo un gran revuelo, sin embargo, hoy también parece relegado.

Hoy después de mucha espera y espectativas tenemos una primera versión de la API que sirve para mostrar información publica de usuarios registrados.

Por ejemplo para ver la información de cierto perfil, sólo se hace una simple petición via GET

CODE:

GET https://www.googleapis.com/plus/v1/people/107447198372749768472?pp=1&key={YOUR_API_KEY}

y obtenemos datos en JSON:

JAVASCRIPT:

{
 "kind": "plus#person",
 "id": "107447198372749768472",
 "displayName": "Braulio Soncco",
 "tagline": "Misio pero feliz :)",
 "gender": "male",
 "aboutMe": "Super mormón :)",
 "url": "https://plus.google.com/107447198372749768472",
 "image": {
  "url": "https://lh5.googleusercontent.com/-5JLDS7_WVoU/AAAAAAAAAAI/AAAAAAAAANc/SQqkX0081z4/photo.jpg"
 }
}
 

Para hacer estas peticiones, necesitamos un API Key.

Por ahora son funciones básicas, pero ya es un avance para estar construyendo aplicaciones simples.

Y a tí ¿Qué se te ocurre hacer con la API?

Enlaces: Lanzamiento del Google+ API | Documentación de la API | Invitaciones a Google+

Categories
CSS3 Herramientas html5 JavaScript

Adobe mata a Flash y lanza Adobe Edge, su plataforma de animaciones HTML5, Javascript y CSS3

No he podido creer la noticia, después de haber invertido millones de dólares en el desarrollo de Flash, de haber escrito y reescrito ActionScript; Adobe se "echa" ante lo nuevo y reemplaza a Flash por HTML5, JavaScript y CSS3.

Lo hace mediante Edge, la herramienta por ahora gratuita que genera animaciones e interaccion del usuario.

Adobe Edge

La herramienta la puedes usar gratis por sólo 152 días desde su instalación.

Probando un poco he visto que para las animaciones usan jQuery y otras herramientas propias de Adobe. La interfaz recuerda a Lightroom pero el uso del timeline es igual a Flash. El código resultante es limpio y fácil de editar. Personalmente le veo mucho futuro.

HTML:

<script type="text/javascript" src="edge_includes/jquery-1.4.2.min.js"></script>
    <script type="text/javascript" src="edge_includes/jquery.easing.1.3.js"></script>
    <script type="text/javascript" src="edge_includes/edge.0.1.1.min.js"></script>
    <script type="text/javascript" src="edge_includes/edge.symbol.0.1.1.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="Untitled-1_edge.js"></script>
    <link rel="stylesheet" href="Untitled-1_edge.css"/>
 

Javascript que se usa en un ejemplo

Las características que más me llaman la atención las pongo en negrita:

  • Crea nuevas composiciones con las herramientas de dibujo y texto.
  • Importa los tipos de imágenes SVG, PNG, JPG or GIF files.
  • Crea animaciones con un editor de línea de tiempo. Anima posición, tamaño, color, fondo, rotación y más.
  • Añade archivos HTML existentes con animación, mientras se preserva la integridad de los layouts.
  • Copia y pega transiciones, las invierte y se puede escoger entre más de 25 efectos existentes.

Otras características se añadirán poco a poco, si quieres estar informado puedes seguir la página en Facebook o la cuenta en Twitter.

Enlace: Adobe Edge Preview

Categories
Herramientas JavaScript

jQuery Boilerplate: empieza a escribir tus propios plugins de jQuery

Boilerplate constructor de plugins jQuery

Si estás interesado en construir plugins jQuery, Boilerplate te da una plantilla lista para empezar.

El código está comentado de tal manera que peudas empezar fácilmente. No sólo servirá para construir un plugin, sino también sirve para entender el comportamiento de otros ya existentes.

Enlace: jQuery BoilerPlate

Fuente: Kabytes

Categories
Diseño Herramientas

Screenfly: una herramienta para ver tu sitio en diferentes dispositivos

Ver tu sitio web en diferentes dispositivos

Para los diseñadores y preocupados de que su sitio se vea bien, Screenfly es una herramienta gratuita que permite ver tu sitio web en diferentes dispositivos con las siguientes opciones:

  • Desktop en diferentes resoluciones
  • Tablets (ViewPad, Galaxy, Ipad)
  • Celulares (Blackberry, Iphone, Nexus)
  • Televisión

Si te interesa también ver tu sitio en diferentes navegadores o sistemas operativos puedes usar Browsershots.

Visto en Webresourcesdepot.

Categories
Google Herramientas html5 JavaScript Webkit

Convertir SWF a HTML5 con Swiffy

Mientras todos están muriendo por una invitación a Google+, te invito a poner atención a una herramienta interesante también de Google.

Swiffy permite convertir archivos SWF a HTML5 online. permitiendo usar estos en archivos en dispositivos que no soportan Flash como iPods o iPads.

Por ahora Swiffy no soporta ActionScript 3 ni escenas. El resultado final es un archivo html, que contiene código JSON y que al final es formateado y puede ser visto en cualquier navegador que soporte Webkit.

Mientras esperas tu invitación, te puedes distraer convirtiendo algunos archivos o simplemente revisando los ejemplos 🙂