{"id":97,"date":"2013-07-03T23:28:50","date_gmt":"2013-07-04T03:28:50","guid":{"rendered":"http:\/\/blog.espol.edu.ec\/jgidrovo\/2011\/10\/11\/gee-my-magazine-ai\/"},"modified":"2013-09-10T12:48:25","modified_gmt":"2013-09-10T16:48:25","slug":"adobeedge","status":"publish","type":"post","link":"https:\/\/blog.espol.edu.ec\/jgidrovo\/2013\/07\/03\/adobeedge\/","title":{"rendered":"Adobe Edge"},"content":{"rendered":"<p><a href=\"http:\/\/blog.espol.edu.ec\/jgidrovo\/files\/2011\/10\/adobe-edge-06-692x5351.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignleft size-medium wp-image-107\" src=\"http:\/\/blog.espol.edu.ec\/jgidrovo\/files\/2011\/10\/adobe-edge-06-692x5351-300x231.jpg\" alt=\"\" width=\"300\" height=\"231\" srcset=\"https:\/\/blog.espol.edu.ec\/jgidrovo\/files\/2011\/10\/adobe-edge-06-692x5351-300x231.jpg 300w, https:\/\/blog.espol.edu.ec\/jgidrovo\/files\/2011\/10\/adobe-edge-06-692x5351.jpg 692w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<p>Hola amigos ya hace alg\u00fan tiempo hable sobre todas las posibilidades que puede hacer Edge por ustedes y las ventajas que aporta al crear animaci\u00f3n sin utilizar Flash, haci\u00e9ndolo vers\u00e1til y sumamente atractivo para el uso en p\u00e1ginas web que van a visualizarse en distintos dispositivos m\u00f3viles. Pues bien de lo que vamos hablar en este tutorial es acerca de como crear una peque\u00f1a animaci\u00f3n con este grandiosos software hasta el momento en que estoy escribiendo este tutorial se tiene la versi\u00f3n Adobe Edge Preview , as\u00ed que ser\u00e1 necesario que tengas instalado en tu computadora esta versi\u00f3n para poder lograr los objetivos de este tutorial.<\/p>\n<p>Introducci\u00f3n a Adobe Edge<\/p>\n<p>Como ya mencione anteriormente este programa sirve para hacer animaciones sin necesidad de Flash. Este programa realiza las animaciones mediante Javascript, esto hace que la animaci\u00f3n que nosotros logremos con este software podremos verla en nuestros navegadores sin la necesidad de instalar un plugin que se tenga que instalar y estar actualizando en nuestro navegador. Ojo esto \u00faltimo es muy importante.<\/p>\n<p>Entorno de Trabajo de Adobe Edge<\/p>\n<p>Hablemos primeramente de la pantalla inicial que tiene Adobe Edge, pues cuando abrimos por primera vez el software nos advertir\u00e1 el periodo que durara nuestra beta instalada el cual es alrededor de 60 dias, una vez que se cierra esta ventana se tiene acceso ahora a la pantalla de inicio de Adobe Edge.<\/p>\n<p>En esta pantalla de inicio tendremos acceso a los diferentes tutoriales los cuales aparecen del lado izquierdo de la pantalla y que nos explican el uso de la aplicaci\u00f3n de una manera sencilla y muy r\u00e1pida.<\/p>\n<p>Tambi\u00e9n contamos con varios v\u00ednculos que se encuentra en la parte superior de donde se encuentran los tutoriales de inicio, estos v\u00ednculos dan acceso a las novedades del software y\u00a0 acceso a recursos de aprendizaje de este software mediante Adobe.<\/p>\n<p>Del lado derecho de la pantalla tendremos una serie de iconos que nos indicaran la creaci\u00f3n de un nuevo documento, la apertura de un documento de Adobe Edge, as\u00ed como una lista con los \u00faltimos archivos abiertos dentro del software.<\/p>\n<p>Una vez que creamos un nuevo documento tendremos acceso al ambiente de trabajo de Adobe Edge, este entorno se encuentra dividido en 7 partes:<\/p>\n<ul>\n<li>Barra de herramientas.<\/li>\n<\/ul>\n<ul>\n<li>Panel de propiedades<\/li>\n<\/ul>\n<ul>\n<li>Panel de l\u00ednea de tiempo.<\/li>\n<\/ul>\n<ul>\n<li>Librer\u00eda.<\/li>\n<\/ul>\n<ul>\n<li>Panel\u00a0 Elements.<\/li>\n<\/ul>\n<ul>\n<li>Panel Lesson.<\/li>\n<li>\u00c1rea de trabajo. Preparaci\u00f3n del proyecto<\/li>\n<\/ul>\n<p>En primer lugar si vamos insertar im\u00e1genes dentro de Adobe Edge debemos tomar en cuneta que las im\u00e1genes que podemos importar son im\u00e1genes jpg, png, gif o svg. Es importante remarcar que los archivos png tienen como caracter\u00edstica particular que puede preservar transparencias, as\u00ed que por tanto se pueden crear desde programas como Fireworks o Photoshop.<\/p>\n<p>Al momento de guardar el archivo Adobe Edge generara una serie de archivos los cuales son necesarios para el funcionamiento correcto de nuestra animaci\u00f3n. Estos documentos son una serie de Javascripts los cuales contienen las \u00f3rdenes que ser\u00e1n utilizadas dentro de nuestro proyecto.<\/p>\n<p>Conclusi\u00f3n<\/p>\n<p>Bien hasta aqu\u00ed dejaremos nuestro primer tutorial esperando que les haya gustado y les sea de mucha utilidad est\u00e9n pendientes para las pr\u00f3ximas entregas en donde podremos analizaremos las herramientas de texto y las animaciones.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Hola amigos ya hace alg\u00fan tiempo hable sobre todas las posibilidades que puede hacer Edge por ustedes y las ventajas que aporta al crear animaci\u00f3n sin utilizar Flash, haci\u00e9ndolo vers\u00e1til y sumamente atractivo para el uso en p\u00e1ginas web que van a visualizarse en distintos dispositivos m\u00f3viles. Pues bien de lo que vamos hablar en [&hellip;]<\/p>\n","protected":false},"author":4644,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[17],"tags":[],"class_list":["post-97","post","type-post","status-publish","format-standard","hentry","category-general"],"_links":{"self":[{"href":"https:\/\/blog.espol.edu.ec\/jgidrovo\/wp-json\/wp\/v2\/posts\/97","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.espol.edu.ec\/jgidrovo\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.espol.edu.ec\/jgidrovo\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.espol.edu.ec\/jgidrovo\/wp-json\/wp\/v2\/users\/4644"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.espol.edu.ec\/jgidrovo\/wp-json\/wp\/v2\/comments?post=97"}],"version-history":[{"count":12,"href":"https:\/\/blog.espol.edu.ec\/jgidrovo\/wp-json\/wp\/v2\/posts\/97\/revisions"}],"predecessor-version":[{"id":116,"href":"https:\/\/blog.espol.edu.ec\/jgidrovo\/wp-json\/wp\/v2\/posts\/97\/revisions\/116"}],"wp:attachment":[{"href":"https:\/\/blog.espol.edu.ec\/jgidrovo\/wp-json\/wp\/v2\/media?parent=97"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.espol.edu.ec\/jgidrovo\/wp-json\/wp\/v2\/categories?post=97"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.espol.edu.ec\/jgidrovo\/wp-json\/wp\/v2\/tags?post=97"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}