{"id":6681,"date":"2021-03-05T10:06:37","date_gmt":"2021-03-05T15:06:37","guid":{"rendered":"https:\/\/niixer.com\/?p=6681"},"modified":"2021-04-16T07:27:02","modified_gmt":"2021-04-16T12:27:02","slug":"animacion_curvasbezier-splines","status":"publish","type":"post","link":"https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/","title":{"rendered":"Desde la Animaci\u00f3n: Splines o curvas de B\u00e9zier"},"content":{"rendered":"\n<p>La animaci\u00f3n como la conocemos se refiere al cambio de im\u00e1genes para darle movimiento a una escena u objeto que es desplegado r\u00e1pidamente en secuencia.<\/p>\n\n\n\n<p>Dentro de la animaci\u00f3n existen modelos virtuales llamados <strong>pausing<\/strong>. En estos modelos cada posici\u00f3n creada es traducida en coordenadas que son registradas en hojas de c\u00e1lculo.<\/p>\n\n\n\n<p>La computadora crea las im\u00e1genes intermedias para dar movimiento y luego se refina dando un efecto m\u00e1s natural y menos rob\u00f3tico.<\/p>\n\n\n\n<p>Existen formas de llenar los intermedios entre cada imagen y se puede describir con una funci\u00f3n llamada <strong>spline<\/strong> definiendo el movimiento que llevar\u00e1 un objeto espec\u00edfico y la computadora aplica<strong> interpolaci\u00f3n lineal<\/strong> a una velocidad constante.<\/p>\n\n\n\n<p>Lo m\u00e1s importante es analizar la personalidad del objeto y asociarlo a un tipo de curva, por lo tanto se divide esto en peque\u00f1os pedazos expresados en funciones matem\u00e1ticas abstractas.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Animaci\u00f3n Directa<\/strong><\/h3>\n\n\n\n<p>Creaci\u00f3n de dibujos en diferentes cuadros con una secuencia pasada luego a la computadora para ambientar el movimiento r\u00e1pidamente.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Interpolaci\u00f3n lineal<\/strong><\/h3>\n\n\n\n<p>La animaci\u00f3n directa sirve muy bien pero a veces se necesita una direcci\u00f3n. Aplicando la teor\u00eda de la <strong>pose clave<\/strong> se le da un objetivo de inicio y llegada, adicionando movimiento m\u00e1s real en espacios demarcados.<\/p>\n\n\n\n<p>La computadora conecta las poses con una l\u00ednea recta &#8220;<strong>interpolaci\u00f3n lineal<\/strong>&#8221; y que se obtiene cuando hay espacio en cada pose.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Animaci\u00f3n con curvas de B\u00e9zier<\/strong><\/h3>\n\n\n\n<p>A pesar de que con la computadora podremos lograr un movimiento casi fluido. Sin embargo, todav\u00eda queda lejos de esa naturalidad especial que vemos en la animaci\u00f3n.<\/p>\n\n\n\n<p>Aqu\u00ed entran las <strong>curvas de B\u00e9zier<\/strong> o <strong>Splines<\/strong>, controladas con manijas la forma gr\u00e1fica en cada posici\u00f3n clave, y as\u00ed entregando curvas m\u00e1s suaves que nos facilita el cambio entre la posici\u00f3n inicial y final.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Comprimir y estirar<\/strong><\/h3>\n\n\n\n<p>Luego de lograr una secuencia m\u00e1s natural, se pueden aplicar variables de animaci\u00f3n <strong>&#8220;Avars&#8221;<\/strong>. Por ejemplo, comprimir y estirar. <\/p>\n\n\n\n<p>Para la animaci\u00f3n la idea es brindar personalidad y vida del objeto, con esto se muestra de que est\u00e1 compuesto, la soluci\u00f3n es mostrar el proceso de pensamiento del personaje.<\/p>\n\n\n\n<p><strong>Autor:\u00a0<\/strong>Kevin Andres Luna Avila<\/p>\n\n\n\n<p><strong>Editor:<\/strong>\u00a0Carlos Iv\u00e1n Pinz\u00f3n Romero<\/p>\n\n\n\n<p><strong>C\u00f3digo:&nbsp;<\/strong>UCCG-9<\/p>\n\n\n\n<p><strong>Universidad:<\/strong>&nbsp;Universidad Central<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Fuentes:<\/h3>\n\n\n\n<ul class=\"wp-block-list\"><li>Pluralsight LLC. (2014). <em>Stepped Vs. Spline Curves When Blocking an Animation<\/em> [Fotograf\u00eda]. Pluralsight. https:\/\/www.pluralsight.com\/content\/pluralsight\/en\/blog\/film-games\/ste\/stepped-vs-spline-curves-blocking-animation\/_jcr_content\/main\/hero_blog_block\/image-res.img.jpg\/1527709386052.jpg<\/li><\/ul>\n\n\n\n<ul class=\"wp-block-list\"><li>Khan Academy. (2020). <em>Introducci\u00f3n a la animaci\u00f3n. <\/em>Khan Academy<em>.<\/em> https:\/\/es.khanacademy.org\/computing\/pixar\/animate#ball<\/li><\/ul>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>La animaci\u00f3n como la conocemos se refiere al cambio de im\u00e1genes para darle movimiento a una escena u objeto que es desplegado r\u00e1pidamente en secuencia. Dentro de la animaci\u00f3n existen modelos virtuales llamados pausing. En estos modelos cada posici\u00f3n creada es traducida en coordenadas que son registradas en hojas deSeguir Leyendo<\/p>\n","protected":false},"author":109,"featured_media":6683,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"colormag_page_container_layout":"default_layout","colormag_page_sidebar_layout":"default_layout","footnotes":""},"categories":[30,103],"tags":[1153,1152],"class_list":["post-6681","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-niixer","category-programacion-y-desarrollo-de-software","tag-animacion-2","tag-splines"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.2 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Desde la Animaci\u00f3n: Splines o curvas de B\u00e9zier &#8211;<\/title>\n<meta name=\"description\" content=\"Las curvas de B\u00e9zier o splines desde la perspectiva de la animaci\u00f3n, una funci\u00f3n que brinda fluidez y personalidad a la secuencia de im\u00e1genes.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Desde la Animaci\u00f3n: Splines o curvas de B\u00e9zier &#8211;\" \/>\n<meta property=\"og:description\" content=\"Las curvas de B\u00e9zier o splines desde la perspectiva de la animaci\u00f3n, una funci\u00f3n que brinda fluidez y personalidad a la secuencia de im\u00e1genes.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/\" \/>\n<meta property=\"og:site_name\" content=\"Portal de noticias de tecnolog\u00eda, Realidad Virtual, Aumentada y Mixta, Videojuegos\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/niixer\/\" \/>\n<meta property=\"article:published_time\" content=\"2021-03-05T15:06:37+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-04-16T12:27:02+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/niixer.com\/wp-content\/uploads\/2021\/03\/Animacion-Spline.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"800\" \/>\n\t<meta property=\"og:image:height\" content=\"450\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Kevin Andres Luna Avila\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Kevin Andres Luna Avila\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutos\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Desde la Animaci\u00f3n: Splines o curvas de B\u00e9zier &#8211;","description":"Las curvas de B\u00e9zier o splines desde la perspectiva de la animaci\u00f3n, una funci\u00f3n que brinda fluidez y personalidad a la secuencia de im\u00e1genes.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/","og_locale":"es_ES","og_type":"article","og_title":"Desde la Animaci\u00f3n: Splines o curvas de B\u00e9zier &#8211;","og_description":"Las curvas de B\u00e9zier o splines desde la perspectiva de la animaci\u00f3n, una funci\u00f3n que brinda fluidez y personalidad a la secuencia de im\u00e1genes.","og_url":"https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/","og_site_name":"Portal de noticias de tecnolog\u00eda, Realidad Virtual, Aumentada y Mixta, Videojuegos","article_publisher":"https:\/\/www.facebook.com\/niixer\/","article_published_time":"2021-03-05T15:06:37+00:00","article_modified_time":"2021-04-16T12:27:02+00:00","og_image":[{"width":800,"height":450,"url":"https:\/\/niixer.com\/wp-content\/uploads\/2021\/03\/Animacion-Spline.jpg","type":"image\/jpeg"}],"author":"Kevin Andres Luna Avila","twitter_card":"summary_large_image","twitter_misc":{"Escrito por":"Kevin Andres Luna Avila","Tiempo de lectura":"2 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/#article","isPartOf":{"@id":"https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/"},"author":{"name":"Kevin Andres Luna Avila","@id":"https:\/\/niixer.com\/#\/schema\/person\/be21178d730d17682c64b97c8d15fc45"},"headline":"Desde la Animaci\u00f3n: Splines o curvas de B\u00e9zier","datePublished":"2021-03-05T15:06:37+00:00","dateModified":"2021-04-16T12:27:02+00:00","mainEntityOfPage":{"@id":"https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/"},"wordCount":458,"commentCount":0,"publisher":{"@id":"https:\/\/niixer.com\/#organization"},"image":{"@id":"https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/#primaryimage"},"thumbnailUrl":"https:\/\/niixer.com\/wp-content\/uploads\/2021\/03\/Animacion-Spline.jpg","keywords":["Animacion","Splines"],"articleSection":["Niixer","Programaci\u00f3n y desarrollo de software"],"inLanguage":"es","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/","url":"https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/","name":"Desde la Animaci\u00f3n: Splines o curvas de B\u00e9zier &#8211;","isPartOf":{"@id":"https:\/\/niixer.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/#primaryimage"},"image":{"@id":"https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/#primaryimage"},"thumbnailUrl":"https:\/\/niixer.com\/wp-content\/uploads\/2021\/03\/Animacion-Spline.jpg","datePublished":"2021-03-05T15:06:37+00:00","dateModified":"2021-04-16T12:27:02+00:00","description":"Las curvas de B\u00e9zier o splines desde la perspectiva de la animaci\u00f3n, una funci\u00f3n que brinda fluidez y personalidad a la secuencia de im\u00e1genes.","breadcrumb":{"@id":"https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/#primaryimage","url":"https:\/\/niixer.com\/wp-content\/uploads\/2021\/03\/Animacion-Spline.jpg","contentUrl":"https:\/\/niixer.com\/wp-content\/uploads\/2021\/03\/Animacion-Spline.jpg","width":800,"height":450,"caption":"animaci\u00f3n con spline"},{"@type":"BreadcrumbList","@id":"https:\/\/niixer.com\/index.php\/2021\/03\/05\/animacion_curvasbezier-splines\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/niixer.com\/"},{"@type":"ListItem","position":2,"name":"Desde la Animaci\u00f3n: Splines o curvas de B\u00e9zier"}]},{"@type":"WebSite","@id":"https:\/\/niixer.com\/#website","url":"https:\/\/niixer.com\/","name":"Portal de noticias de tecnolog\u00eda, ciencia, Android, iOS, Realidad Virtual, Aumentada y Mixta, Videojuegos, computadores, todo lo mas reciente en tecnolog\u00eda","description":"Portal de noticias de tecnolog\u00eda","publisher":{"@id":"https:\/\/niixer.com\/#organization"},"alternateName":"Niixer","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/niixer.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/niixer.com\/#organization","name":"Niixer","alternateName":"Niixer.com","url":"https:\/\/niixer.com\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/niixer.com\/#\/schema\/logo\/image\/","url":"https:\/\/niixer.com\/wp-content\/uploads\/2022\/08\/logo-niixer-sin-fondo-1.png","contentUrl":"https:\/\/niixer.com\/wp-content\/uploads\/2022\/08\/logo-niixer-sin-fondo-1.png","width":140,"height":140,"caption":"Niixer"},"image":{"@id":"https:\/\/niixer.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/niixer\/","https:\/\/www.instagram.com\/niixer.tecnologia\/"]},{"@type":"Person","@id":"https:\/\/niixer.com\/#\/schema\/person\/be21178d730d17682c64b97c8d15fc45","name":"Kevin Andres Luna Avila","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/secure.gravatar.com\/avatar\/7248de86061d515d359e7c8c92a1c09f01eba1e587fb640b0bf1e65d46f810d7?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/7248de86061d515d359e7c8c92a1c09f01eba1e587fb640b0bf1e65d46f810d7?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/7248de86061d515d359e7c8c92a1c09f01eba1e587fb640b0bf1e65d46f810d7?s=96&d=mm&r=g","caption":"Kevin Andres Luna Avila"},"url":"https:\/\/niixer.com\/index.php\/author\/klunaa\/"}]}},"jetpack_featured_media_url":"https:\/\/niixer.com\/wp-content\/uploads\/2021\/03\/Animacion-Spline.jpg","_links":{"self":[{"href":"https:\/\/niixer.com\/index.php\/wp-json\/wp\/v2\/posts\/6681","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/niixer.com\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/niixer.com\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/niixer.com\/index.php\/wp-json\/wp\/v2\/users\/109"}],"replies":[{"embeddable":true,"href":"https:\/\/niixer.com\/index.php\/wp-json\/wp\/v2\/comments?post=6681"}],"version-history":[{"count":10,"href":"https:\/\/niixer.com\/index.php\/wp-json\/wp\/v2\/posts\/6681\/revisions"}],"predecessor-version":[{"id":6706,"href":"https:\/\/niixer.com\/index.php\/wp-json\/wp\/v2\/posts\/6681\/revisions\/6706"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/niixer.com\/index.php\/wp-json\/wp\/v2\/media\/6683"}],"wp:attachment":[{"href":"https:\/\/niixer.com\/index.php\/wp-json\/wp\/v2\/media?parent=6681"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/niixer.com\/index.php\/wp-json\/wp\/v2\/categories?post=6681"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/niixer.com\/index.php\/wp-json\/wp\/v2\/tags?post=6681"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}