¡Cuidado con Adobe Edge!
Hace tiempo que un colega me viene hablando del Adobe Edge, el programa de Adobe para hacer dibujos en HTML5 y CSS3. Cuando salió la versión demo para bajar, lo bajé, pero la verdad que nunca lo probé hasta hoy, y si bien lo encuentro una herramienta útil para animaciones (su interfaz gráfica es muy similar a Flash), me parece que tenemos que tener cuidado con su uso y para qué lo queremos.
Me puse a buscar en la web, ejemplos hechos con Adobe Edge, y uno de los primeros que encontré fue este:
Ejemplo de ilustración hecho con Adobe Edge
Lo bueno
Es una linda ilustración (sin animación en este caso), que, a diferencia de una imagen, al hacer zoom in la vamos a ver agrandarse con la misma nitidez que con su tamaño inicial. Algo positivo que noté es que si miramos el código fuente, no vamos a ver markup HTML vacío como en muchas otras demos de CSS3 en la web, Adobe Edge crea todos los elementos a través de javascript.
Lo malo de Adobe Edge
Lo negativo de Edge, es que esta ilustración necesita cargar más de 200 KB en archivos!!
Si, esto se debe a que, por ejemplo, Adobe Edge necesita jQuery, algo que a algunos desarrolladores no les importaría, ya que usan este framework en todos sus proyectos, pero no todos usamos esta librería. Además de jQuery, nos encontramos con otros 4 (si, cuatro) archivos javascript y uno CSS, aumentando así en gran cantidad los http request, incrementando la carga del sitio:
Más de 200 KB y demasiadas http requests
La imagen de la galera de más arriba (el ejemplo en cuestión), es un archivo PNG que pesa… 12 KB, lo cual también implica una sola http request, mucho mejor que 6!
Otro punto negativo: desde el punto de vista del SEO, si usamos Adobe Edge, tendríamos una imagen menos para que los motores de búsqueda indexen.
Las dudas
Después de ver esto me surgieron algunas dudas, siendo la principal: no es mejor hacer este tipo de cosas utilizando SVG o canvas, o mejor aún, un simple PNG si el trabajo no implica animación?
Cuándo me dijeron que Adobe Edge utilizaba HTML5, enseguida imaginé un programa tipo Flash que exportaba a canvas (obviamente con su respectivo código javascript) pero no este «paquete» que sale de Adobe Edge.
La demo está muy buena, pero no me imagino haciendo esto para un sitio de verdad, inyectando así como si nada 200 KB ( y unas cuantas llamadas http) para cargar una simple imagen.
¿Alguien más lo probó?
Bitcoin
Ethereum
Bitcoin cash
Tether
Stellar
Bitcoin!
Si el artículo te resultó útil, no dudes en colaborar con nosotros con Bitcoin. Escanea el código QR o copia la siguiente dirección en tu wallet para enviar Bitcoin
Ethereum!
Si el artículo te resultó útil, no dudes en colaborar con nosotros con Ethereum. Escanea el código QR o copia la siguiente dirección en tu wallet para enviar Ethereum
Bitcoin cash!
Si el artículo te resultó útil, no dudes en colaborar con nosotros con Bitcoin cash. Escanea el código QR o copia la siguiente dirección en tu wallet para enviar Bitcoin cash
Tether!
Si el artículo te resultó útil, no dudes en colaborar con nosotros con Tether. Escanea el código QR o copia la siguiente dirección en tu wallet para enviar Tether
Stellar!
Si el artículo te resultó útil, no dudes en colaborar con nosotros con Stellar. Escanea el código QR o copia la siguiente dirección en tu wallet para enviar Stellar
Has probado Wallaby? También de Adobe. Leí algo acerca de que pasa Flash a HTML5, pero aún no lo probé.
No, no lo he probado. Pero según lo que estuve leyendo (y lo que recuerdo de su código) es algo muy parecido a lo que hace el Adobe Edge.
Yo si lo he estado probando, la cuestión es que la tecnología html5 quiere destronar a flash del mercado web (creo q es el futuro, pero aun lo veo complicado) entre las desventajas de flash, encontramos que su contenido no puede ser encontrado por un buscador, y me dió gracia leer que dijiste que una desventaja es que las imágenes salen del buscador; eso es cierto, pero edge no está pensado para hacer imagines, sino animaciones y páginas iteractivas como en flash (Adobe no se quiso quedar atrás, pues reconoce que html5 es el futuro).
Otra ventaja de edge con respecto flash es su exigencia, pues consume muchos recursos (quizá al hacer cosas grandes con edge, también llegue a tener esta desventaja) Sin embargo creo que es no es para usuarios avanzados (pues estos estarán acostumbrados a crear paginas animadas muy creativas con poco código), sino para básicos que podamos hacer una página bien llamativa en poco tiempo sin necesidad de grandes conocimientos.
PD: Soy usuario Flash, pero me gusta que la tecnología vaya avanzando, tendré que especializarme en html5, css3 y demás.
Saludos desde Colombia.
Hola Joseth, gracias por tu aporte!
Lo que me refería es a que tendremos una imagen menos para que Google indexe, puede parecer algo sin importancia, pero creo que en términos de SEO y WPO los detalles importan cada vez más.
Pregunta, cómo te está siendo la «transición» desde Flash a HTML5/CSS3, etc?
Saludos!
Joseth Guerrero el contenido de flash si puede ser indexado por un buscador, por otro lado edge esta en su etapa de prueba y se espera salga listo en la CS6 en definitiva representara muchas ventajas para el desarrollo web en html5
Hola gente, muy buena la discusion.
Es verdad que hay riesgo de perder SEO para utilizar esta tecnologia, creo que Adobe apunta mas a los dispositivos moviles, y especialmente a las tabletas para que los que crean revistas online usen esta herramienta para la completa creacion de animaciones de manera muy facil. Ellos no estan preocupados por el SEO ni que Google pueda leer el contenido. Fijense este video: http://tv.adobe.com/watch/digital-publishing-customer-showcase/fast-company-uses-adobe-edge-in-digital-publications/
Las laptops y computadoras de escritorio van a ser obsoletas en 5 años, y Adobe no quiere perderse el tren…
Mi humilde opinion.
yo me estoy metiendo en el tema del html5 para crear juegos usando construct 2 he aqui una animacion q hice en apenas 1 min.
http://dl.dropbox.com/u/96231736/planetahtml5/index.html
pero si 200kb no es nada de peso!!!! No si eres un viajero del pasado usas internet a pedales
Hola que tal primero que nada muy buena discución.
Para estas fechas edge todavia esta en labs y tiene otras funciones y todo eso aunque creo que no salio con el CS6.
definitivamente no esta pensado para imagenes es para animaciones simples
que regularmente un diseñador sin mucha experiencia en javascript no podria hacer.
y si bien edge no exporta a canvas (que seria genial..!!!) PORFAVOR en esta epoca 200kb no es nada (aunque tambien creo que depende mucho de el nicho de usuarios de tu sitio ya que no es lo mismo un sitio para geeks que uno para divorcios. Obvio los geeks tienen mas ancho de banda mejores dispositivos etc.. y los usuarios que comunmente se divorcian pues solo les interesa la funcianlidad del sitio y no si tiene animaciones o que tecnologia utilizas etc…)
es cierto 200 kb me las paso por mis b… con los 3 mb que tengo 🙂 en cuanto al SEO ya uno se las ingeniara cuando salga la versión final pero de que vamos a utilizar esta herramienta no me quepa la menor duda todos estan con la locura html5 y y a camaron que se duerme se lo lleva la corriente xD
Pablo disculpando mi opinión del caso… ¿te imaginas programando o diseñando en una tablet?
Yo no, tal vez para usuarios finales las computadoras no sean su fin pero para el resto de nosotros (programadores o diseñadores) no lo creo.
Ahora con el resto de la charla, sigo pensando que Edge va a ayudar a los usuarios de flash para que puedan volver a trabajar con lo ultimo en tecnología, pero también pienso que va a suceder lo mismo que con flash, muchos sitios sobre cargados de animaciones, música y efectos.
Hay que aprender a medirse y decirle al cliente «no» de vez en cuando para mejorar la web.
En el caso de cargar 200 kb para una imagen si es algo exagerado pero no para cargar las animaciones, ¿viste los ejemplos de la propia pagina del proyecto?
Wallaby no puede comvertir todos los archivos de flash en HTML5, mas si son desarrollados con XML o estan formados por códigos complejos y fases 3D… es limitada…
Yo tuve el mismo problema con Adobe Edge. Estaba muy ilusionado con las posibilidades de este programa pero me encontré con el mismo problema al trabajar con imágenes. ¿Habéis probado A5 HTML5 Animator? Yo me acabo de descargar la versión de prueba y la verdad es que por ahora estoy bastante contento. ¿Alguien más ha usado este programa? Gracias!!
Yo sería un poco más cuidadoso con el título, como está es bastante alarmista. Seguramente quienes usen este software lo harán para crear complicadas escenas, juegos, etc. de los cuales espera un peso similar al de los archivos de Edge. Hoy en día la velocidad de bajada de los usuarios en la red descargaría esa página sin hacer esperarlos esperar mucho.
Creo que hacen mal al decir que 200kb no es nada (no digo que sea pesado) pero igual saben muy bien que al crear un web debemos pensar en todos y cuando me refiero a todos digo a los Geek’s y no Geek’s de eso se trata una web, de comunicar dar a conocer un producto, articulo o lo que fuera.
Esta muy buena la herramienta pero imaginense una web con mucha animación y esta creada con adobe egde, de hecho que estará mucho mas pesada a que lo animemos con puro codigo.
Saludos.
Considero que los Hachetemeleros se clavan en la textura, llevan especulando años y aún no veo nada claro. Mientras tanto hago cosas en flash que en html las hacen en sueños ustedes. Flash se va a adaptar fácilnmente.
Laptops y Desktops obsoletas? Especializadas más bien.
http://tv.adobe.com/watch/adobe-technology-sneaks-2012/export-to-html5-from-flash-professional/
Yo tambien lo he usado, y realmente no lo veo como una desventaja, mencionas que una imagen menos para que el buscador indexe, pero realmente queremos indexar botones fondos o banners???
personalmente no soy partidario de que si buscas mi pagina por el buscador de imagenes de google me salgan todos los fuentes fondos bordes y demas cositas de primero, o revueltas con las verdaderas imagenes de contenido o los articulos noticias o productos…
es mas que claro que no vas a usar adobe edge para las imágenes de contenido, sino para la parte estetica e interactiva del sitio…
eso por la parte de las imágenes, por la parte de las animaciones quizas sea cierto que implican menos peso, pero si tu animacion lleva texto, aqui viene lo divertido, porque una animacion flash que lleve texto no será indexada…
pero una animación en edge que lleve texto si es mas probable que lo sea, ya que el texto es parte del código con todo y sus etiquetas…
lo otro es que esos 6 archivos de 200kb que mencionas pueden ser para una minuscula animacion de un boton, como lo pueden ser para una aplicacion compleja de toda la pantalla, con interactividad y demás, y si aumenta su tamaño o cantidad de peticiones será dependiendo de los recursos que se usen (imagenes musica y demás) cuantas megas pesaria una animacion de 1024 x 768? en flash y en edge?
sin mencionar de que no requerimos de el plugin de flash player en el navegador…
si, los navegadores no lo traen incorporado, es una descarga obligada que hicimos alguna vez en nuestros PC y eso es parte importante para que nuestros trabajos de flash deban ser vistos, personalmente creo que adobe dio un paso correcto al empezar a adoptar html5 y css3
y yo si pienso que flash esta en vía de extinción.
http://mrdoob.com
les invito a revisar esta página que contiene proyectos realizados en html5 y css, y claro una locura de programacion en javascript detrás…
Saludos desde Colombia
Hola!!
bueno es obvio la diferencia pero veo que caes en algunos pocos errores.
para lo cual mencionas que «es un archivo PNG que pesa… 12 KB, lo cual también implica una sola http request»
y «inyectando así como si nada 200 KB ( y unas cuantas llamadas http) para cargar una simple imagen.»
bueno la diferencia las veras cuando armes una galeria o un juego en el cual van a utilizar cientos de imagenes.
OCURRE que jquery es una libreria que requiere algunos kbites de más pero que solo tendras que bajar una vez, el resto se usara en repeticiones.
asi por ejemplo:
vas a tener 200 imagenes (un juego fondos, detalles, sprites… etc.)
imagina que son 10 kb por imagenes. esas son al rededor 2MB totales.
ahora tienes un numero de 14 librerias que pesan alrededor de 200kb pero cada información externa para las imagenes solo pesan 3 kb cada una (las librerias son las mismas asi que no se descargan mas de una vez), esas son 200kb + 3(200) kb = 800 kb. (y eso con el beneficio de poder agrandarlas) aunque no se exactamente cuanto pese las librerias, espero que se concluya que al final cada tecnología tiene sus usos.
Hola a todos, ya existe una herramienta que te permite crear animaciones como lo hace Adobe Edge, pero a diferencia de Adobe Edge es que esta herramienta si te crea las animaciones a HTML5 Canvas, que es mucho mas rápido para reproducir y sin cargar tanto al servidor, les paso el sitio para que vean la aplicación y descarguen la versión de prueba, para que la usen y vean el potencial de la herramienta. http://www.sinergysoft.com/canvaspresenter.html
He leído todos los comentarios y siento que me a ayudado a comprender un poco mas este programa , solo deseaba comentarlo Gracias.
Todo gracias a una estúpida disputa personal entre el Sr Jobs y los de Adobe, es increible que tengamos que cambiar la forma de trabajar de millones de diseñadores solo por la pataleta de dos .. ejmmm… IDIOTAS… ayyyy perodonnn señores Mac – eros… Jobs ya no sigue aquí, pero flash SI
Señores:
Si no les gusta flash, me parece bien. Si son partidarios de html5 también me parece bien.
Pero:
Dejémonos de que flash no es indexable porque sí lo es. ¿O uds. creen que saben más que los montones de ingenieros e investigadores que tiene Adobe para que todos y cada uno de sus productos sean impresionantemente comerciales? Para los que todavía creen que no lo es, les invito a que se pasen por las webs (si, digo bien, webs) de adobe. Se les van a caer hasta las pupilas de toda la información que hay allí sobre SEO e indexación.
Y para los que son seguidores de html5 también les invito a que consigan la versión 5 ó 6 de flash (no la de cs6 o cs5, sino la versión 5). Si tienen un poco de cabeza, se van a dar cuenta en qué lugar está html5.
Además, ya está más que demostrado que html5 no puede hacer nada por sí mismo y acude a librerias. También se sabe que html5 no corre en casi ningún navegador (cosa que flash lo tiene resuelto desde la prehistoria).
Por otro lado, el interés que hay por html5 viene porque a apple le interesa. Hoy por hoy, la plataforma flash ocupa muchísimo mercado (tanto que no necesita a apple ni de lejos). Esa es la razón por la que flash no está en los móviles de apple: la cuota de mercado y el hecho de que flash es plataforma propietaria y no le deja a apple parte del pastel. Entonces, como apple no quiere tener a la competencia en sus productos, ¿qué hizo? Quitó a flash y apostó por html5.
En cuanto al peso de las webs hechas en flash (igual que en html5) depende totalmente del diseñador. O sea, a peor diseñador, más peso en la página web.
Que adobe apueste por html ¿quiere decir que html5 es el futuro? En absoluto. Sólo se trata de continuar en un mercado (el de html) que le puede dar beneficios, ni más ni menos. Porque con lo que respecta a flash, sigue desarrollando y desarrollando.
Por cierto, ¿sabeis que indesign cc puede leer lectores QR? ¿Y que con el lenguaje de programción as3 podemos hacer lo que queramos con una webcam, cosa que html5 no? ¿Y que con html5 no podemos leer lectores QR?
Chaíto a todos.
Hola a todos.
Finalmente salió la versión final del Adobe Edge Animate en la ultima versión de la suite de adobe Creative Cloud. la cual aun no he bajado así que no hablaré de sus funcionalidades sino que dejaré una opinión en virtud del debate abierto.
Algunas consideraciones despues de haber leido todos los post.
200 Kb son una piedra (es decir pesadisimos) cuando se usan telefonos inteligentes o tables y estas navegando con tu plan de datos, sobre todo en paises subdesarrolados como en el que yo vivo. por su puesto en mi PC y con banda ancha (aunque en mi pais es mas bien banda estrecha) 200 kb ciertamente no son nada.
Lo de indexar imagenes (no se si esto ha sido corregido o si está igual pero anyway) creo que tiene razon el amigo Reynerth, uno solo idexa la imagen que uno quiera idexar y no necesariamente los bordes y botones, pero por otro lado. siempre es malo o inconveniente que uno no tenga control de todo lo que tiene disponible. así que ambos tienen razon.
El autor teme que la web se llene de paginas abusivas en el uso de elementos multimedia, sonido, animaciones e interactividad innecesaria. pero eso simplemente será así. no todos tiene el concepto de buen gusto y funcionalidad bie claros. algunos simplemente pensarán que entre mas «estrambotico» pues entonces mejor. aunque el sitio pese 20 megas y tarde 5 minutos en cargar.
Lo de las librerias. es el mismo problema de Java. si yo quiero usar un programa que us e Java pues me tengo que bajar el Java. así de simple. si necesitas usar librerias como .NET framework o lo que sea, pues hay que bajarlas. eso es simplemente como «Se requiere traje y corbata para entrar» pues si quieres entrar, vas y te pones traje y corbata. si no la tienes la compras, pero no compras un traje y una corbata cada vez que quieres entrar, solo lo haces una vez. y además 800 Kb en librerias ciertamente es poco. ese será el sustituto de «Esta pagina requiere adobe Flash»
Si me imagino programando en una tablet, aunque yo no programo, mi trabajo es escribiendo. y para ello a veces he tenido que hacerlo en mi smartphone que tiene una pantallita de ¿cuanto? ¿3 pulgadas?, así que si estas en la carretera y tienes un trabajo que realizar, una tablet con conexión será un regalo del cielo a tus manos hasta que puedas llegar a casa. Ah! y despues de esto es posible que prefieras programar a la orilla de la playa con una tablet que en casa con el super monitor de 24 pulgadas.
Finalmnte. Debemos entender que html5 es una nueva manera de hacer las cosas, pero no significa que es «Infinita» en posibilidades, hay ciertamente cosas que aun NO SE PUEDEN HACER. pero que sin embargo siempre alguien consigue una alternativa para darle la vuelta y lograrlo.
Así que aqui comienza el juego.
Adobe Edge está pensado para que aquellos que no son tan duchos en las animaciones puedan crear cosas que de otra manera simplemente ni lo soñarían. por ese lado pues bienvenido.
Los detallitos como siempre se solventarán en futuras ediciones.
eciban un gran abrazo todos amigos
Saludos
Eddio
Es un tanto patetico leer esta discucion, los que son buenos para programar no deverian perder su tiempo en el diseños de paginas web por que un diseñador lo hace muchisimo mejor, casi todo lo que se dice aqui es una soberana idiotes, en edge se pueden usar videos a toda pantalla, sin tener problemas de peso por favor miren estos ejemplos http://www.bienvillecapital.com/
http://wagerfield.github.io/parallax/
http://www.pacorabanne.com/invictus/#!/webshow
yo le cambiaria el titulo a el comentario inicial y le pondria cuidado con los computines, amigos html le gano a flash en menos de un par de semanas principalmente por la facil manera de diseñar sin conocer de programacion que es irrelevante a la hora de diseñar.
Mi hermano debo decirte que Edge Animate es lo mejor 1ro: haz una animacion en solo html5 canvas, y haz la misma en edge, ahora compara el tiempo de edicion de la misma.
te podria seguir haciendo comparaciones, claro sin desmerecer la inmensa utilidad de canvas, pero en este mundo web que requiere alta eficiencia, lo mejor es usar herramientas practicas, o tecnologias practicas, ademas edge se integra htm5, css3 y javascript, se puede pedir mas?.
Marcas lo malo de edge, pero mi amigo la tecnologia avanza, es muy facil solventar a lo que llamas malo, con cualquier otra practica y/o tecnologia 😉
Hola a todos y buen día, leyendo todos los comentarios anteriores puedo decir que es edge es un gran y buen editor de texto web, y que el titulo de este articulo lo hace ver a primera instancia como un software devora recursos que no debe ser usado bajo ninguna circunstancia y si bien se puede dibujar en el, creo que depende del developer utilizar la tecnología con la cual se identifique más ya que tanto para dibujo, diseño, maquetación o desarrollo hay un sin fin de buenos software que en conjunto dan un buen resultado. Por lo tanto creo que no hay que discriminar ninguna tecnología por solo ser fan de otras tecnologías.
Aclaro que soy desarrollador flash y me encanta la tecnología de adobe y entiendo que es una empresa que no esta peleada con ninguna tecnología al contrario es impulsora de la innovación y apuesto mucho por adobe y aunque el futuro es incierto adobe no se esta quedando atrás.
Saludos y espero no trolear a ningún otro developer o designer.
Creo que yo también estoy de acuerdo con los defensores de Adobe Edge. Al igual que otras opciones, como sencha y similares, se trata de una herramienta muy útil para democratizar el acceso a la animación HTML5.
Las herramientas hay que testarlas para lo que están diseñadas, y en el caso de Adobe Edge es para hacer animaciones interactivas.
La verdad es que es un programa bastante completo (aunque todavía necesita bastantes mejoras, como loaders personalizados, inclusión de sonido, mejorar las CSS soportadas…), y con el que se puede conseguir animaciones bastante logradas. Incluso esas limitaciones que tiene el programa se pueden solucionar trasteando un poco en el código con unos conocimiento básicos de javaScript y CSS. Los archivos que dan como resultado de la publicación del proyecto son fácilmente editables, y el propio programa presenta cuadros de texto para insertar código (por ejemplo, para embeber fuentes personalizadas mediante @font-face, o introducir acciones javaScript personalizadas ante un evento).
A modo de ejemplo, las siguientes animaciones las hemos desarrollado con ese programa (y un poco de código extra):
http://flyingdodos.com/frame01_es.html
http://flyingdodos.com/frame02_es.html
¿Es una herramienta universal, una navaja multiusos que sirve para todo? Evidentemente no. Si quieres maquetar una web HTML5, la mejor opción sigue siendo el código puro, un editor WYSIWYG, o un CMS. Y si quieres ilustrar… Un archivo png tampoco pesa tanto, la verdad. Pero si lo que quieres es realizar animaciones interactivas, banners de alta calidad o pequeños widgets animados, esta es tu herramienta.
soy nuevo en programacion de paginas web
estoy empesando a estudiar por mi cuenta como programar paginas web
quisiera q me aconsearan por dnd empesar q programa usar
DREAMWEAVER O EDGE?
HTML5…
GRACIAS
Que opinan de Adobe Muse?
Buen articulo, aun no he probado Edge, quiza luego le de la oportunidad.
Saludos!
gracias por la info lo estoy probando y tienes razon con la cantidad de info q debe cargar, también hay problemas con la compatibilidad…
Hola a todos. Muy interesante el articulo aunque un poco anticuado, de hecho me pareció más interesante es el debate que se dio, razón por la cual me animo a comentar mi experiencia.
Soy Diseñador Gráfico y desde hace ya 3 años que empece a echar código, empezando con as2, pero muy poco de as3 y hoy en día mucho de HTML5. Lo que plantea el articulo es muy cierto, quizas no lo del SEO, que con edge es poca cosa, además hoy en día se necesita más que indexar imágenes para aparecer bien ranqueado y no, no importan los resultados de google imagenes, en realidad el SEO, aunque tiene que ver ni se preocupa.
Como me fue de la transición de FLASH a html5, sinceramente DIFICIL, creo que hoy día me siento muy a gusto con lo que aprendí, pero cada vez adobe me asombra con sus software que me hubiesen facilitado la vida para hacer lo mismo pero sin aprender código. Flash perdió, pero no por potencial sino porque tuvo mucho tiempo para evolucionar para la web y no lo hizo, tuvo que verse amenazado para moverse y lastimosamente cuando por fin fue sacando soluciones (algunas muy viejas pero desconocidas)la anticampaña, la publicidad pro HTML5 y el mercado en general, les ganaron el terreno que en su día fue el rey, quizas para no volver con la misma fuerza a la web (aunque aun le quedan, animaciones directamente a video y videojuegos).
Siguiendo con EDGE, es un buen intento pero lo cierto es que cuando entras al mundillo del codigo, te das cuenta que en proyectos serios, 200kb es demasiado peso, en esto se trata no de ‘es posible’ sino ‘totalmente optimizado’ y cuando conoces lo cruel que puede ser google con su ranking, así sea que te demores medio segundo más que otros, significan 3 o 10 puestos más abajo, para mas información busquen algoritmo ‘pinguin’ o ‘pandarizado’. Y no solo para moviles sino en termino de web ojo. Además cuando ya conoces mucho más te das cuenta que son 200kb que no se usan del todo, es decir, optimizadamente una animación sin importar cual librería de javascript se utilize, con solo 20kb como mucho se puede realizar sin problemas. Y 10 veces menos peso significa mayor ranking google, mejor experiencia del usuario y mejor rehuso del código para posteriores trabajos.
Ahora NO CASTIGO el software, porque osea para un portafolio personal es genial, para un cliente que solo quiere un sitio informativo pues venga también funciona (aunque lo mejor sería un cms tipo wordpress) o algun que otro proyecto que necesite una landing page sin problemas, y no solo EDGE, sino también MUSE, edge reflow y porque no? DREAMWEAVER e INDESIGN. no tienes que matarte aprendiendo código, solo siendo creativo con Photoshop o Ilustrator, o inskcape, gimp o bueno sí eres medio decente Corel Draw, que no es que sea un mal software es que es muy facilista, te da malas practicas y practicamente te exige que sepas componer más diseñar.
Que recomiendo sí estas empezando en el diseño web, bueno vete por a multimedia, animaciones o diseño de experiencias UX y de interfaces UI, sí las matematicas o las reglas lógicas no son lo tuyo. Aprende a crear tus propias fuentes de iconos, buenas practicas, diseño atomico y a exportar animaciones y graficos svg, que son vectoriales y eso es muy genial. En cambio sí te gusta los códigos, entender un poco más a los ingenieros, las matemáticas y la lógica no te dan mucho problema entonces prueba y sumergete en el mundo de CSS3 o de estilos, te da un poder y una libertad en el diseño web que ni te imaginas, aprende de semantica HTML y con Javascript (Jquery u otro framework) crearas animaciones fluidas e interfaces ricas en interacción, que no soñe nunca con flash.
Para concluir, aprender código es demorado (Y MUCHO Y NUNCA TERMINAS, siempre sale algo nuevo, como los preprocesadores LESS, SASS o STYLUS) si ves que no te va bien de primeras, vete a lo seguro, animaciones, concepto de interacción y UX/UI.
Bueno y como no, como buen amante de la publicidad hagamos la propia, si quieren ver demos en html y CSS, hechos por mi, para copiarselos o aprender, visiten mi codepen.io/g3kdigital y sí quiere ver mis trabajos como diseñador aquí: be.net/g3kdigital.
He leido todos los comentarios,
Mi opinion es que estamos entrando en un mundo minimalista, donde todo tiene que ser simple, facil, rapido. Edge Animate, creo que es la solucion a todo esto (luego que mejoren su version beta), Flash nunca morira, simplemente se adaptara (a mi entender) a este nuevo mundo.
Jamas, se diseñara con lo touch, ni tablet, es como decir que el papel morira, ¡Nunca!
Busque en varios foros y no encontre solucion a mi problema. Soy Diseñador Grafico con una base de web, mundo en el cual no estoy muy sumergido, pero me defiendo. Me puse al tanto con Wallaby, Swify, Edge y HTML5, porque un amigo me comento que no podia ver en su tablet una web mia.
El problema es toda mi vida anime en Flash y estos .swf los insertaba en el html con DW. Ahora bien, como inserto los archivo que converti en Swify? como lo importo a mi .html o html5.
Cuando trasformo mi .swf se me crea uno nuevo y un html, ahora bien? como lo inserto? Wallaby me ha creado muchos archivos (tal como el Edge).
Saludos,
Saludos, si me dan una mano se los agradeceria.
Yo vengo trabajando aproximadamente hace un año con Adobe Edge Animate, al parecer a 2014 la plataforma presta una versatilidad en cuanto a trabajo con jquery, js y cualquier librería externa, la recomiendo por encima de Flash. Sé que el artículo se escribió hace más de 3 años, pero está muy bien posicionado en Google y me parece que se basaba en una desconfianza que html5 (En especial Javascript) ha venido evaporando los últimos años.
Lo probé alguna vez, el problema es lo mucho que sobrecarga el ordenador al usar demasiados recursos (al menos eso me pasó a mi) y la incompatibilidad con algunos programas. Sinceramente a mi no me sirvió.
Y nadie habla de la seguridad? Llevo mucho tiempo trabajando con flash (as3) , y nunca he podido decompilar un archivo flash al 100% para leer o aprender de codigos ajenos. Sin embargo solo basta hacer click derecho en VER CODIGO FUENTE DE LA PAGINA para que tu codigo html5 sea robado.
He leído todos los comentarios y creo que hay que desglosar mejor para entender ciertas diferencias. Como se menciona en parte del articulo inicial:
«me parece que tenemos que tener cuidado con su uso y para qué lo queremos.»
Precisamente ese es el primer problema que debemos atajar, ¿Para que lo quiero?
Para una sencilla animación, para trabajar profesionalmente. Dependiendo de que respondamos deberemos atajar sus cuestiones lógicas. Si es para trabajar… creo que puede ser pesado «por los ficheros» o esperarme a una versión más optimizada (creo que han mejorado el peso y la dependencia de librerías un 55%).
En mi caso yo quiero el software para la crear personal de una web en concreto pero quiero los siguientes requisitos:
-Que sea de fácil aprendizaje.
-Que sea rápida en cargar y ocupe poco.
-Que tenga soporte y ayuda para integración en diferentes plataformas.
Como han mencionado en un comentario anterior, creo que el que sea un verdadero creativo, necesitará de un software más completo y con un aprendizaje más lento. Pero al final si es intuitivo acabas adaptando animaciones complejas partiendo de herramientas simples (uno se apaña).
En mi caso creo que Adobe Edge no cumple del todo los puntos de aprendizaje fácil y que sea rápido (seguro que muchos discreparán), yo nunca he usado una herramienta de adobe y sus cuadros y atajos son complejos, he aprendido sin ningún problema Google Web Designer y como primera experiencia ha sido muy buena, pero con muchos fallos, pero he cumplido mis objetivos y he tenido libertad de creación.
Ahora llega el dilema: Si con Web Designer he cumplido mis objetivos.. ¿Realmente necesito una aplicación costosa o avanzada?.
Es difícil pero creo que hay tecnologías existentes que pueden cumplir nuestro propósito, pero todo esta desordenado y falta solo eso, desglosar y ordenarlo de nuevo.
Hace tiempo trabajo con incomedia website como diseñador de mi web y estoy contento por la rapidez aunque te llevas verdaderos quebraderos de cabeza si quieres hacer algo que se salga del rectángulo, aunque al final acaba siendo menos tiempo que si tuviese que aprender java. Bueno, el caso es que he recibido una publicidad de ellos han creado un software nuevo llamado Incomedia WebAnimator y es el que me ha llevado a esta web, esta en ingles (no es que sea un problema), lleva muy poco tiempo pero por mi experiencia esta gente mejora para bien sus herramientas. Me gusta la idea de las plantillas (para los perezosos) y tiene la versión plus la posibilidad de meter vídeos y sonidos en tus animación sin mucha dificultad (seguro que los otros también) pero he visto algún tutorial y es un botón y listo. También cuenta con un botón de grabado, que al parecer puedes pulsar para crear los fotogramas clave de forma powerpoint. En fin dejo esto aquí para saber más opiniones porque cuesta 50 pavacos y antes me gustaría saber si alguien más opina como yo o por el contrario es tirar el dinero, y ojo, que aún me estoy pensando en comprarlo.
Añado, he instalado Adobe Edge 2014.1, tiene fotograma clave automático y vídeos, audio, tiene lo de las lecciones para aprendizaje, esta en español, etc.. pero la licencia es por meses?????? WFT?? cuanto acabas pagando?
Comprobado, Adobe Edge 2014.1 ha reducido considerablemente el tamaño, el mismo ejemplo puesto en este post ocupa 123 kb.
11 de marzo 2015.. vive el post por el cuarto año
Interesante el post y reveladores los comentarios.
Gracias a todos
SEO o «cómo ser esclavo de los caprichos de Google».
¡Que les den!
Me he leído todos los comentarios y estoy muerta de la risa…
Venía buscando una manera de traducir una animación hecha en Edge a algo más «actual»… o por lo menos vivo!
Un trabajador antiguo de la empresa en la que estoy hizo una publicación digital con Adobe DPS y Adobe Edge y ahora, 2 años después, ambas aplicaciones han desaparecido o se han convertido en un producto elitista para multinacionales. Muertas, sin soporte, sin posibilidad de recuperar archivos… Así es Adobe!
Que tenías un contrato firmado con una empresa para mantenerle un catálogo digital DPS actualizado durante un año y Adobe se carga la app sin avisar de un día para el otro? Pues te jodes. La cuota son ahora de 10.000 dólares/mes en adelante… Adobe seguirá ganando pasta… tú no importas si no estás al nivel de la Cocacola Company…
Leer ahora la discusión anterior sobre el futuro de Flash y HTML5 y CSS3 es hilarante…
Yo he trabajado con versiones pirata de Adobe toda mi vida de diseñadora (tengo 40), incluso en grandes empresas montábamos la Suite pirata, sí, qué pasa? Ahora, trabajando en una compañía que vende software, yo creo que les da palo (o les auditan mucho) y trabajo con mis primeras versiones legales de la Office y Adobe. Y estoy flipando!! Una colección de bugs detrás de otro. Siempre justifiqué los fallos de software al hecho de trabajar con versiones pirata, pero ahora veo que las versiones crackeadas son mucho más estables… Un asco.
Sinceramente, creo que Adobe ve su final próximo y busca un flotador en grandes empresas, vigiladas por auditores a sueldo, que mantengan su cada vez más exigua estructura. El resto de usuarios de a pie, cada día más, iremos acostumbrándonos a trabajar con apps de software libre, GNU… ese el futuro!!!
Somos una generación torpe y lenta en aprender nuevos lenguajes y sistemas, nos parece que la curva de aprendizaje lo es todo, el pasar de un sistema a otro… estamos tan muertos como flash! Las nuevas generaciones no tienen miedo al código, y cada vez lo tendrán menos, les gusta que haya código para poder tocas las tripas, es más!!
A ver si nos quitamos de en medio pronto todos los dinosaurios y damos a estos jóvenes de mentes abiertas, flexibles, adaptables, creativas… las riendas del mundo del diseño y de la web y nos apartamos para aprender lo que es bueno. Me flipa lo rápido que va todo… Y eso que para mi edad me mantengo al día porque por suerte desde los 90 supe que el papel tenía que morir y siempre quise formarme paralelamente en uno u otro ámbito. Eso me salvó el culo en mi carrera porque ahora mi generación está atada de pies y manos…
No está bien merecido… Leyendo los comentarios de arriba, se ven las lagunas de los que se niegan a aprender código y se siguen llamando diseñadores… ja ja ja ja ja!!! Antiguos, que sois unos antiguos!! ja ja ja ja
Ay… me he reído mucho. Gracias a todos.
Voy a mandarme este lonk y si dentro de 3 años la página sigue online, será súper interesante ver cómo ha evolucionado este tema…
Suerte!
Jajaja me estoy riendo igual que tu lo pudiste hacer hace 1 año Irene, no puedo estar más de acuerdo contigo y pasado 1 año se confirma aún más.
Adobe esta olvidando quien la hace ser lo que es y sigue el camino de este sistema podrido. Por suerte siempre estaremos creando algo más grande y maravillo… ‘en la deepweb claro’. Aun así pienso que una herramienta no te hace ser mejor simplemente te ahorra tiempo.
Soy un gran consumidor de Software libre aunque también lo soy de los avances como ‘adobe character animator’, lo divertido es la facilidad que lleva el aprendizaje de ellos y así será el futuro dividido en que aprender y que no aprender. Cualquiera que puede leer los vestigios de estos blogs/webs quedará en el recuerdo de lo que fué y acabó convirtiéndose la ilustración y desarrollo web.
Yo seguiré creando incluso desde cero porque me sigue divirtiendo (eso si.. gracias a tener tiempo para ello jaja). Un saludo! y es grato entrar por casualidad pasado años y deleitarse con algo así! saludos!!