{"id":315,"date":"2013-05-31T20:59:58","date_gmt":"2013-06-01T01:59:58","guid":{"rendered":"http:\/\/rockylouproductions.com\/blog_wp\/?p=315"},"modified":"2013-06-09T17:56:50","modified_gmt":"2013-06-09T22:56:50","slug":"up-up-and-away","status":"publish","type":"post","link":"https:\/\/rockylouproductions.com\/blog_wp\/2013\/05\/31\/up-up-and-away\/","title":{"rendered":"Up, Up, And Away"},"content":{"rendered":"<p>&nbsp;<\/p>\n<div id=\"attachment_317\" style=\"width: 586px\" class=\"wp-caption alignnone\"><a href=\"https:\/\/i0.wp.com\/rockylouproductions.com\/blog_wp\/wp-content\/uploads\/2013\/05\/rochelle_movieposter_PropBoth_Wink.gif\"><img data-recalc-dims=\"1\" decoding=\"async\" aria-describedby=\"caption-attachment-317\" data-attachment-id=\"317\" data-permalink=\"https:\/\/rockylouproductions.com\/blog_wp\/2013\/05\/31\/up-up-and-away\/rochelle_movieposter_propboth_wink\/\" data-orig-file=\"https:\/\/i0.wp.com\/rockylouproductions.com\/blog_wp\/wp-content\/uploads\/2013\/05\/rochelle_movieposter_PropBoth_Wink.gif?fit=720%2C466&amp;ssl=1\" data-orig-size=\"720,466\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;}\" data-image-title=\"MoviePoster_Rochelle\" data-image-description=\"&lt;p&gt;Animated movie poster GIF of character Rochelle from  Pixar&amp;#8217;s &amp;#8220;Planes&amp;#8221;. &lt;\/p&gt;\n\" data-image-caption=\"&lt;p&gt;Pixar presents Planes &amp;#8211; meet Rochelle&lt;\/p&gt;\n\" data-large-file=\"https:\/\/i0.wp.com\/rockylouproductions.com\/blog_wp\/wp-content\/uploads\/2013\/05\/rochelle_movieposter_PropBoth_Wink.gif?fit=625%2C405&amp;ssl=1\" loading=\"lazy\" class=\" wp-image-317  \" alt=\"Animated Movie Poster GIF\" src=\"https:\/\/i0.wp.com\/rockylouproductions.com\/blog_wp\/wp-content\/uploads\/2013\/05\/rochelle_movieposter_PropBoth_Wink.gif?resize=576%2C373\" width=\"576\" height=\"373\" \/><\/a><p id=\"caption-attachment-317\" class=\"wp-caption-text\">Meet Rochelle from Pixar&#8217;s movie &#8220;Planes&#8221;.<\/p><\/div>\n<p>Still\u00a0enamored with creating GIFs, I stayed up way too late last night creating this animated movie poster from the movie <a title=\"Pixar site about Planes\" href=\"http:\/\/pixar.wikia.com\/Planes\" target=\"_blank\"><em>Planes<\/em> by Pixar<\/a>\u00a0to be released in\u00a0theaters\u00a0August, 2013. (<a title=\"ds106 link to assignment\" href=\"http:\/\/assignments.ds106.us\/assignments\/animated-movie-posters\/\" target=\"_blank\">DesignAssignments313<\/a>)<\/p>\n<p>Let me give you a little background on why I chose this particular movie poster. My name is Rochelle, and it&#8217;s not a very common name in the United States. \u00a0I met only one other Rochelle growing up, and that was in High School. \u00a0I&#8217;ve met maybe 5 others my whole life. So when a Facebook friend posted on my timeline that Pixar would be introducing a new character in their upcoming movie about planes, I was beaming,<\/p>\n<p style=\"padding-left: 30px;\">\u00a0<em>&#8220;I have a cartoon character named after me?&#8221; \u00a0<\/em><\/p>\n<p><em><\/em>Now this assignment would give me the opportunity to create something out of a real movie poster that had my name on it. \u00a0How cool is that? If I liked it, I could see using it in other circumstances around the web. I do like my final product, so you might see it popping up again.<\/p>\n<p>Keeping with this week&#8217;s design theme, I studied the poster to understand what is being conveyed in the image. \u00a0Since the movie isn&#8217;t even out yet, I read the Pixar synopsis of the movie and more specifically the plane character, Rochelle. (voice of by Julia Louis-Dreyfus)<\/p>\n<p><a style=\"line-height: 1.714285714; font-size: 1rem;\" href=\"http:\/\/pixar.wikia.com\/Planes\">Excerpt from Pixar site:<\/a><\/p>\n<blockquote>\n<h3>Rochelle<\/h3>\n<figure><a href=\"https:\/\/i0.wp.com\/images2.wikia.nocookie.net\/__cb20130327234741\/pixar\/images\/8\/83\/Pla_rochelle_rolloutimage_v3-0simp.jpg\"><img data-recalc-dims=\"1\" decoding=\"async\" loading=\"lazy\" alt=\"Pla rochelle rolloutimage v3-0simp\" src=\"https:\/\/i0.wp.com\/images4.wikia.nocookie.net\/__cb20130327234741\/pixar\/images\/thumb\/8\/83\/Pla_rochelle_rolloutimage_v3-0simp.jpg\/180px-Pla_rochelle_rolloutimage_v3-0simp.jpg?resize=180%2C116\" width=\"180\" height=\"116\" data-image-name=\"Pla rochelle rolloutimage v3-0simp.jpg\" data-image-key=\"Pla_rochelle_rolloutimage_v3-0simp.jpg\" data-src=\"http:\/\/images4.wikia.nocookie.net\/__cb20130327234741\/pixar\/images\/thumb\/8\/83\/Pla_rochelle_rolloutimage_v3-0simp.jpg\/180px-Pla_rochelle_rolloutimage_v3-0simp.jpg\" \/><\/a><\/figure>\n<p>(voice of\u00a0<a title=\"Julia Louis-Dreyfus\" href=\"http:\/\/pixar.wikia.com\/Julia_Louis-Dreyfus\">Julia Louis-Dreyfus<\/a>)<\/p>\n<p>Rochelle is a tough racer and the pride of the Great White North. Always confident and capable, she got her start running mail to small towns in Quebec, picking up home remedies for mechanical maladies along the way. She also developed a knack for fast travel that ultimately inspired her to give air racing a try. Rochelle never looked back (this competitive contender doesn\u2019t need to). She is relentlessly pursued by charmer El Chupacabra, but steadfast Rochelle is much too focused on winning the race to return his affections.<sup id=\"cite_ref-sk_19-4\"><a href=\"http:\/\/pixar.wikia.com\/Planes#cite_note-sk-19\">[20]<\/a><\/sup><\/p><\/blockquote>\n<p>I would also need to keep in mind the file size limitations of a GIF, how many frames I&#8217;d be allowed in my photo editing software, and since I didn&#8217;t want this project to consume my life for days, the number of frames I&#8217;d actually have to create. \u00a0I decided that the important elements of the poster to focus on would be that this is a plane, and then illustrate something about Rochelle&#8217;s personality. \u00a0My first overly ambitious thoughts\u00a0were to have her fly on the poster. \u00a0Moderating my initial exuberance with a dose of reality, I admitted to myself the work required to make the plane actually fly in or out of the poster was way too complicated to pull off. \u00a0My rational, although still very creative self, went with animating the propeller props, and giving her a wink. \u00a0I&#8217;m not totally at peace with the\u00a0symbolism\u00a0of her winking, since the character synopsis says she is steadfast and much to focused on winning the race to return another plane&#8217;s affection, but I&#8217;ve seen the blinking effect used in a lot of other GIF projects (Ben&#8217;s <a href=\"http:\/\/blog.raptnrent.me\/2013\/05\/26\/the-colorized-zone\/\" target=\"_blank\">&#8220;The Colorized Zone&#8221;<\/a> was a big inspiration), so why not give it a try.<\/p>\n<p><span style=\"color: #993300;\"><em>[An illustrated detailed process of creating this animation will be documented and posted as a tutorial eventually. Until then, <a title=\"GIF tutorial with one animation zone\" href=\"http:\/\/rockylouproductions.com\/blog_wp\/2013\/06\/03\/have-a-rockin-birthday\/\">you can view a tutorial example with only one<\/a>\u00a0animation zone.]\u00a0<\/em><\/span><\/p>\n<p>A summary of the process using PhotoShop Elements 11 for the Mac:<\/p>\n<p>1. I used the lasso tool to grab an image of each of the propellers and the eyes\/windshield\u00a0of the plane. This was pretty painstaking while I experimented with which parts of the propeller would work best to create the rotating effect. \u00a0I then duplicated the propeller images and rotated them 30deg and 60 deg. I ended up with 3 different propeller images for each side of the plane.<\/p>\n<p>2. For the winking eye I used the lasso tool again to capture just the left half the windshield image. \u00a0Then started stretching, erasing, copying, pasting, aligning&#8230; until I had something that looked right.<\/p>\n<p>3. Once all of the individual image layers were created, it was time to merge the appropriate layers to create new combined images that would animate correctly. \u00a0Oh my was this a chore as it became closer and closer to midnight. \u00a0I was creating a total of 3 animation zones?! My brain just wasn&#8217;t working as well anymore and I was having a hard time following tracking of what went where. \u00a0And remember that ambitious enthusiasm I spoke about? Well I added in an additional challenge to have each of the propellers appear to be spinning a little differently. And believe you me, it was no walk in the park to properly align everything so that those parts that were supposed to be still remained still. \u00a0I didn&#8217;t want any distracting jumping around of the animation.<\/p>\n<p>4. The timing of the animation sequence was also important. \u00a0I didn&#8217;t want her constantly winking, yet I wanted the propellers to be moving at a quick rate to provide a better spinning illusion. I was able to create the effect I wanted by duplicating more of the image layers for the propellers and sandwich the winking effect in the middle. All-in-all I ended up with a total of 14 frames: 8 propeller frames + 2 winking frames + 4 propeller frames, all running at 0.2 seconds per frame.<\/p>\n<p>As I mentioned above, this post only gives a high level synopsis of creating this GIF. \u00a0The tutorial will have much more detail with screen shot images and examples at each stage as I move through the creation process.<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>&nbsp; Still\u00a0enamored with creating GIFs, I stayed up way too late last night creating this animated movie poster from the movie Planes by Pixar\u00a0to be released in\u00a0theaters\u00a0August, 2013. (DesignAssignments313) Let me give you a little background on why I chose this particular movie poster. My name is Rochelle, and it&#8217;s not a very common name [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"nf_dc_page":"","_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[64,12,21,460],"tags":[48,85,10,62],"class_list":["post-315","post","type-post","status-publish","format-standard","hentry","category-animated-gif","category-assignments","category-design","category-ds106","tag-animatedgifassignments","tag-animatedgifassignments1124","tag-designassignments","tag-designassignments313"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p3zfrO-55","jetpack_likes_enabled":true,"_links":{"self":[{"href":"https:\/\/rockylouproductions.com\/blog_wp\/wp-json\/wp\/v2\/posts\/315","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/rockylouproductions.com\/blog_wp\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/rockylouproductions.com\/blog_wp\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/rockylouproductions.com\/blog_wp\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/rockylouproductions.com\/blog_wp\/wp-json\/wp\/v2\/comments?post=315"}],"version-history":[{"count":21,"href":"https:\/\/rockylouproductions.com\/blog_wp\/wp-json\/wp\/v2\/posts\/315\/revisions"}],"predecessor-version":[{"id":357,"href":"https:\/\/rockylouproductions.com\/blog_wp\/wp-json\/wp\/v2\/posts\/315\/revisions\/357"}],"wp:attachment":[{"href":"https:\/\/rockylouproductions.com\/blog_wp\/wp-json\/wp\/v2\/media?parent=315"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/rockylouproductions.com\/blog_wp\/wp-json\/wp\/v2\/categories?post=315"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/rockylouproductions.com\/blog_wp\/wp-json\/wp\/v2\/tags?post=315"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}