feed

html5

Lion con CSS3 y HTML5, simula OS X desde tu propio navegador

10 comentarios

Lion con HTML5 Y CSS3
Si querías la prueba de que HTML 5 es el futuro y que su combinación con CSS 3 nos permitirá hacer todo aquello que queramos hacer, bajo la única limitación de nuestra propia imaginación, esta página de Alessio Atzeni es una clara muestra de ello. Viendo lo que ha conseguido en esta página podemos apuntalar un poco más los argumentos que esgrimía Steve Jobs en los últimos años a este respecto.

Conseguir el “Look & feel” del sistema operativo de la manzana, con sus ventanas (y la posibilidad de desplazarlas a nuestro gusto), los menús desplegables, la pantalla de identificación de usuario (con su manzana de carga y posterior difuminado) deja más o menos claro todo lo que nos permitirá la conjunción de estos dos lenguajes de programación.

Evidentemente todo esto no va mas allá de una mera anécdota, pero la verdad es que su autor consigue llamar la atención sobre su trabajo. Sigue el enlace que te proporciono más abajo y descubre los recovecos de esta página, eso sí, no te equivoques e intentes abrir iTunes para poner música.

Vía | Beautiful Pixels
Alessio Atzeni | Lion con CSS3 Y HTML5

Anunciate aquí
Anunciate aquí

MotionComposer, creación de animaciones y contenidos interactivos basados en HTML5 compatibles con iBooks Author

10 comentarios

MotionComposer

La próxima versión de MotionComposer, una aplicación diseñada para crear animaciones y contenidos web interactivos basados en HTML5, incluirá soporte completo para iBooks Author, la nueva herramienta de creación de libros interactivos de Apple, permitiendo ampliar sus posibilidades sin necesidad de escribir una sola línea de código.

Esta actualización, que llegará en “una o dos semanas” (según sus creadores), contará con una nueva opción para exportar nuestras animaciones creando widgets de Dashboard, el formato escogido por Apple para insertar código HTML en iBooks Author a través del widget HTML como ya comenté en mi análisis en profundidad.

“Los widgets de Dashboard es el modo que ha escogido Apple para integrar HTML5 en iBooks Author. Las posibilidades son incontables, desde mapas interactivos a secuencias animadas que impulsaran la interactividad en estos nuevos libros electrónicos”

MotionComposer tiene un precio de 149 dólares y permite crear animaciones complejas con poco esfuerzo totalmente compatibles con cualquier ordenador, smartphone o tablet incluyendo el iPhone o iPad. La aplicación también es capaz de generar contenido en Flash, reproduciendo automáticamente la versión en HTML5 en caso de encontrar un navegador que no soporte la tecnología de Adobe. Os dejo con un par de ejemplos…

Leer más

Anunciate aquí

Adobe lanza la beta pública de Muse, una aplicación para crear webs en HTML5 sin esfuerzo

39 comentarios

Adobe ha lanzado hoy una versión preliminar pública de Muse, una aplicación destinada a los diseñadores que quieren crear páginas web en HTML5 sin esfuerzo ni conceptos del código. Se podría decir que es “el iWeb de Adobe”, pero más adaptado a los tiempo que corren.

Supimos de Muse a principios de este año, cuando empezaron a surgir las primeras pistas de la sexta versión del paquete Creative Suite de Adobe. El programa acentúa más ese salto que está dando la compañía hacia HTML5 juntamente con Edge, una alternativa a Flash que crea animaciones complejas usando el nuevo estándar web que apareció hace dos semanas. Según Adobe, el objetivo es ofrecer una herramienta de calidad a todos aquellos profesionales que diseñan páginas web y no quieren tocar ni una línea de HTML, CSS o Javascript. Definitivamente, Muse no será el programa favorito de los que prefieren usar el código web para ir generando el contenido.

Adobe Muse es gratuito al ser una versión Beta (cuando se lance oficialmente pasará a tener un precio que aún desconocemos), y es compatible con Mac OS X. Para instalarlo necesitaremos tener también la plataforma Adobe AIR instalada.

Vía | Genbeta > CNET
Sitio oficial y descarga | Adobe Muse

Adobe Edge, la nueva aplicación para crear animaciones web en HTML5, CSS y Javascript

29 comentarios

edge, plataforma para crear animaciones en HTML5, CSS y Javascript
La tecnología Flash ha sido desde siempre una de las principales prioridades de Adobe. Con una defensa a capa y espada (sobre todo contra Apple y sus declaraciones hacía dicha tecnología)Adobe no ha dejado de apostar por ella, al fin y al cabo ya no sólo es por “adornar” la web sino que es, aunque esto va cambiando, complemento imprescindible para la visualización de vídeos en internet.

Pero viendo el panoráma y como las tendencias cambian está claro que Adobe se ha tenido que replantear el tema y sin abandonarlo a su suerte apuesta por nuevas formas de enriquecer la web. Por ello ha presentado Adobe Edge.

Edge es una plataforma que permite crear animaciones web usando HTML5, CSS y Javascript. La nueva aplicación se puede descargar de forma gratuita desde la web para probarla y ver su potencial. De momento, parece ser que la idea es que coexista junto a Flash pero como apuntan en Genbeta mas bien parece una evolución de Flash a largo plazo. Y es que, pese al soporte de Flash por parte de algunos sistemas operativos móviles como Android, lo cierto es que para esos pequeños gadgets es una tecnología poco eficiente.

¡Gracias a Andrés por avisar también de dicho lanzamiento!

Vía | Genbeta
Más información | Adobe Edge
En Applesfera | Adobe lanza una herramienta de conversión de Flash a HTML5

Novedades en la versión de Safari Mobile incluida en la beta de iOS 5: mejor soporte en HTML5

46 comentarios

Safari Mobile iOS 5
Con cada gran actualización de iOS siempre llegan numerosos cambios, algunos visibles a simple vista por la mayoría de usuarios y otros más sutiles sólo apreciables por quienes los buscan. La última versión de Safari mejora el soporte de HTML5, versión actualmente incluida en la beta de iOS 5, novedades interesante para desarrolladores web.

Entre todos los cambios algunos buenos y otros no tan buenos destacan la posibilidad de usar position:fixed, overflow:scroll, nuevos tipos de entrada (intervalos de fechas, hora o mes), mejoras en uso de JavaScript,... Lo negativo, no podemos acceder a nuestras fotos o vídeos para subirlos desde el propio navegador. Algo que sería muy útil y echa en falta cualquiera que haya pretendido publicar en su blog desde el iPad, por ejemplo.

De todas formas no está todo dicho. Al ser una versión incluida en la beta del sistema no se descarta que pueda haber más cambios con respecto a la versión final que tendremos con el lanzamiento de iOS 5 en otoño, tanto para bien como para mal pues podrían modificarse o suprimirse algunas cosas. Para los que gustan de test y puntuaciones, iOS 4.3.3 obtiene un resultado de 206 mientras que iOS 5 suma 267 en la realización del test de HTML5.

Más información | davidbcalhoun

Hype, crea animaciones en HTML5 de forma rápida y sencilla

26 comentarios

Hype, animaciones en HTML5 fácilmente

Con la imposibilidad de reproducir cualquier tipo de contenido o animación que haga uso de Flash en los dispositivos iOS así como las mejoras de otras opciones como CSS3 y HTML uno ha dejado de ver la tecnología de Adobe como la única opción para dotar de “vida” una web.

Como he dicho, actualmente el uso de CSS3, HTML5 y un poco de Javascript podemos conseguir resultados realmente asombrosos. La parte negativa es que como todo en esta vida necesita de su aprendizaje si queremos conseguir resultados decentes. Afortunadamente, existen aplicaciones que (en mayor o menor medida) nos facilitan algunas tareas. Una de ellas es Hype, aplicación para crear animaciones en HTML5 fácilmente.

La aplicación cuenta con una interfaz bastante sencilla, basada en una línea temporal en la que iremos realizando los cambios de los elementos usados para darle el movimiento y/o efectos deseados para crear la animación. Todo muy visual, flexible y perfecto para pequeños sitios personales, sencillas web informativas o proyectos de no mucha envergadura.

Hype tiene un precio de 23,99 euros, disponible para su descarga desde la Mac App Store. Así que, si queréis liberar vuestra web de elementos que usen Flash permitiendo una mejora y correcto visionado desde dispositivos iOS sin tener que complicaros la vida con lineas de código Hype es vuestra opción. Ideal para usuarios poco experimentados en el diseño y programación web.

Actualización: En la entrada extendida tenéis un vídeo en el que poder ver el funcionamiento de Hype.

Leer más

Apple aprueba dos juegos hechos en Javascript que no necesitan el navegador para ejecutarse

11 comentarios

IMPACT JAVASCRIPT

Apple ha aprobado un par de juegos en la App Store que representan un importante paso adelante en cuanto a lo que pueden usar los desarrolladores para poder crear juegos en la plataforma iOS. Los títulos son Drop y Biolab Disaster, y son especiales por dos cosas: estar basados enteramente en HTML y Javascript y no necesitar instancias de ningún navegador para poder funcionar en iOS.

Hasta ahora, todo juego que estaba hecho en Javascript y en un entorno web con HTML necesitaba de Safari para funcionar en iOS, pero el gracias a los motores JavaScriptCore, OpenGL para los gráficos y OpenAL para el sonido Drop y Biolab disaster pueden funcionar como una aplicación independiente, sin rastro de cualquier navegador.

¿Qué beneficios tiene esto? Pues que podemos crear juegos de forma flexible sin tener que hacernos expertos en Cocoa. Si sabemos JavaScript y HTML, con el motor Impact podemos crear juegos para iOS sin problemas. Se pueden jugar vía web (es decir, podemos acceder a una web donde se ejecuta el juego) a través de Safari Mobile o simplemente podemos descargar las aplicaciones gratuitas desde la App Store. La diferencia es mínima: en la imagen superior podéis ver el aspecto del juego a través del navegador Safari del iPhone. La aplicación nativa simplemente elimina las barras del navegador.

Un buen avance no sólo por el motor que lo hace posible, sino también por parte de Apple al permitir este tipo de aplicaciones y dejar de ser tan inflexible alrededor de su plataforma de juegos. Cuantas más posibilidades mejor, y además en este caso particular es una ayuda para “acercar” la experiencia web y nativa.

Vía | TUAW
Descarga | BioLab Disaster y Drop en la App Store
Sitio oficial | ImpactJS

Adobe lanza una herramienta de conversión de Flash a HTML5 para llegar hasta los dispositivos con iOS

51 comentarios

Adobe Flash HTML45

¿Quién lo iba a decir? Adobe ha lanzado una aplicación para Mac y Windows que permite convertir el diseño y las animaciones de un archivo Flash a HTML5 para ayudar a los desarrolladores web a ampliar el alcance de sus contenidos haciéndolos compatibles los dispositivos que no soportan este formato.

Disponible a través de la web de Adobe Labs bajo el nombre clave de Wallaby, la compañía califica a esta herramienta de una “tecnología experimental” apuntando directamente a la familia iOS de Apple formada por el iPhone, iPod touch y iPad como su objetivo más claro. Una vez que convertimos un archivo .fla a HTML, podemos editarlo normalmente con cualquier herramienta como Adobe Dreamweaver (o para los clásicos, Textmate) para darle los últimos retoques. ¿Conseguirá Wallaby que Apple y Adobe entierren el hacha de guerra en su polémico debate sobre la viabilidad de Flash en los dispositivos móviles… de la forma más inesperada posible?

Un loable movimiento que aunque pone en entredicho la confianza de la compañía en su propio formato, al menos sirve para garantizar una relativa compatibilidad que permita a los desarrolladores ofrecer más facilmente versiones alternativas de sus sitios web con Flash. Eso si, al menos de momento esta herramienta no resuelve por completo el problema ya que tal y como señala Adobe, el formato HTML5 no soporta todas las características de Flash Profesional como transformaciones 3D, ActionScript, streaming de sonido o vídeo incrustado, pero como mínimo hay que agradecer este primer paso.

Vía | AppleInsider
y Genbeta
Descarga | Adobe Wallaby Technology Preview

Apple lanza iAd Producer, su aplicación oficial para crear publicidad con HTML5 y CSS

2 comentarios

apple ios iad producer

Sorpresa de última hora la que nos ha dado Apple hoy: sin ningún tipo de aviso ha lanzado iAd Producer, una herramienta oficial que nos permite crear nuestros anuncios para la plataforma iAd de publicidad que llegó junto con iOS 4. A sabiendas que un anuncio para iAd se puede hacer con cualquier editor de código, Apple nos proporciona con iAd una herramienta optimizada para ello que nos facilita el trabajo.

Concretamente, iAd Producer nos ofrece plantillas para anuncios, un editor visual con una librería de componentes semejante a lo que ya están acostumbrados los usuarios del Interface Designer de XCode, animaciones en HTML5 y CSS preparadas, un simulador para probar nuestro anuncio en un iPhone, y por supuesto una herramienta avanzada para edición y resolución de errores con javascript.

La interfaz de la aplicación recuerda ligeramente el diseño del nuevo iPhoto’11. Básicamente, Apple nos ha dado una forma muy visual para poder crear nuestros anuncios sin complicarnos y al mismo tiempo ofrece una herramienta potente para los profesionales que prefieran tocar el código directamente. Podemos conseguir el programa si somos miembros del iOS Developer Program de Apple, y accedemos a la página de descarga introduciendo nuestras credenciales.

Vía | MacStories
Sitio oficial | iAd Producer

Imagen de la semana: la mejor promoción de una aplicación que he visto

20 comentarios

ben the bodyguard app store

Hay aplicaciones de la App Store que han conseguido su relativo éxito en gran parte por la originalidad de su promoción por la red: un trailer bien hecho, una descripción original… hay ya muchos ejemplos en la tienda de aplicaciones de iOS. Pero lo que han hecho con Ben the Bodyguard es algo de una calidad que jamás había visto para una aplicación móvil.

Si nos dirigimos a la web oficial de la aplicación ésta nos explica que Ben es un guardaespaldas al que puedes contratar para que guarde tus datos en caso de que sufras un robo o algo similar en el que los datos personales de tu móvil se vean perjudicados. Pero nos lo explica mientras Ben anda por una calle oscura de un barrio problemático, y a su alrededor podemos ver cómo ocurren los acontecimientos que Ben nos califica de ‘comprometedores’ para nuestros datos. Todo hecho sin una pizca de Flash, a base de mezclar astutamente HTML5 y CSS lo cual significa que la web funciona perfectamente en los dispositivos con iOS.

Lo mejor de todo es que a pesar que no hayamos visto ni siquiera el aspecto y el concepto de la aplicación, sólo con ver la página web y la promoción de Ben the Bodyguard ya hacen que queramos descargarnos la aplicación. No sabemos si al final valdrá la pena, pero como mínimo su página web oficial es para sacarse el sombrero. Pulsad en el enlace y disfrutad mientras esperamos a que el programa se lance el mes que viene.

Sitio oficial | Ben the Bodyguard

Anunciate aquí

Comentarios

WSL Weblogs SL