Adobe tuvo hoy el evento Create the Web, donde anunció un compromiso total por HTML5, CSS3 y el nuevo Javascript. Adobe está trabajando en CSS Shaders (animaciones complejas 2D/3D en CSS) y en una suite de herramientas llamada Adobe Edge Tools & Services.
Editores de código, sistemas visuales para generar Responsive Design, fuentes abiertas para la web, suites de animación CSS3/JS y compiladores de código web a apps nativas para móviles. Esta es la respuesta de Adobe y está muy interesante.
Edge Animate
Adobe Edge Animate es un sistema de animación con el nivel de complejidad y detalle de Flash y exportación directa a CSS3. La interfaz está completamente basada en Webkit y hecha en HTML5 (como casi todo de Adobe). Las herramientas vectoriales no son tan poderosas como en Flash, pero la idea es usar Adobe Illustrator u otras herramientas externas para crear los assets que dentro de Edge Animate serán animados.
Adobe Edge Animate precarga jQuery 1.7 además de múltiples librerías de animación de jQuery. Aunque la mayoría de animaciones se hacen a través de propiedades de CSS3, asumo que se usa jQuery como fallback para que sea compatible con navegadores viejos. Esto es un ejemplo del CSS3 que genera Animate:
Código :
-webkit-transform-origin: 50% 50%; -webkit-transform: translate(318.44999999999993px, 200px) translateZ(0px) rotate(0deg) skewY(0deg) scale(1, 1);
Edge Reflow
Esta fue una sorpresa. Adobe Edge Reflow es una herramienta visual para crear sitios web basados en grillas que se autoadapten a cualquier resolución. Sí, una app para hacer Responsive Design o Diseño Adaptable. Una idea interesante, aunque no he podido ver qué tan limpio es el código que genera.
La idea de Edge Reflow no es ser el centro de trabajo de un diseño web, sino el lugar donde testeamos la adaptabilidad de los diseños antes de pasarlo a Dreamweaver, Edge Code, Sublime Text o a lo que sea.
Edge Code y Brackets
Adobe, creo, entendió la caída fuerte de popularidad en Dreamweaver y decidió crear una herramienta con el poder y versatilidad del lider de mercado: Sublime Text 2. Adobe Edge Code está basado en el proyecto open source Brackets y es un muy interesante editor de código. 100% hecho en HTML5/JS, permite editar código en tu disco duro o en «la nube«, correr desde un laptop o un iPad y soporta todas las tecnologías web.
Aún le falta mucho para competir contra Sublime (Python, Ruby, Java, plugins…) pero tiene ideas muy interesantes. Si, por ejemplo, estás en un .html que hace una llamada a una función en JS, Edge Code es capaz de encontrar esa función en el .js y mostrartela ahí mismo, en el contexto, editable inmediatamente. Lo mismo aplica a CSS y otros momentos de código distribuido entre archivos. Además tiene una función para conectarse con Chrome y editar en tiempo real, pero por lo menos usando la beta de Chrome en Mac no pude hacerlo correr.
Edge Inspect
Edge Inspect es simple: Es el mismo conocido, amado y poderodo Web Inspector de Chrome, pero con la capacidad de ser multiplataforma y revisar cambios a los elementos de diseño y CSS de un HTML en tablets, teléfonos y desktops. Muy útil y derivado del proyecto Adobe Shadow.
Es en mi experiencia, un poco lento al inicio, pero una herramienta que vale mucho la pena para evitar el F5, CTRL+R y click a refresh típico del desarrollo multiplataforma.
Edge Webfonts y el nuevo Typekit
Otra sorpresa es Adobe entrando al mundo de las fuentes Open Source. Adobe historicamente ha recibido muucho dinero por sus fuentes (Myriad Pro, Helvetica Neue, etc), pero ahora ha decidido crear fuentes gratuitas y abiertas para usarlas con font-face de CSS3. Compitiendo contra proyectos como Google Web Fonts.
También anunciaron las fuentes «Source Sans Pro» para ver texto en pantallas y «Source Code Pro» para editar código. +1 para Adobe
Phonegap Build
Mi anuncio favorito. Adobe Cordova pasa a ser oficialmente Adobe Phonegap Build. Un proyecto que nos permite convertir apps HTML5 en apps nativas para iPhone, iPad, Android y casi cualquier plataforma tanto móvil como desktop. Con Adobe Phonegap están construídas muchas de las apps presentadas hoy. Phonegap Build además es un servicio en la nube para compilar en un sólo click tus apps HTML5 a todas las plataformas. Te generará los .ipa, .apk y .app necesarios para enviarlo a las App Stores. También te enviará screenshots y permitirá probar remotamente en multiples dispositivos
¿Qué tal todos estos anuncios? Adobe ha decidido dar todo por HTML5 y no puedo estar más contento.
Si se encuentran en Madrid, indicarles que disponen de nuevos cursos adobe edge en madrid, impartidos por el equipo a través de la consultora Formadores IT.